AI 티 나는 SVG 일러스트를 전면 폐기한 이유
가볍고 편하다는 이유로 고집했던 SVG 일러스트를 전량 폐기하고, 18편 전체의 커버를 교외 주택 생활감이 살아있는 1200×675 실사 에셋으로 갈아엎으며 정립한 반(反) AI 비주얼 원칙을 기록합니다.
모바일 화면을 스크롤하다 느껴진 섬뜩한 위화감
51개에 달하던 사이트맵 URL을 28개로 쳐내고, 핵심 글 4편에 의사결정 매트릭스를 삽입하는 인프라 수술을 마친 날 밤이었다.
터미널에서는 빌드 에러 0개, 경고 0개가 떴고, Lighthouse 성능 점수도 초록색 불을 뿜고 있었다. 기술적으로는 아무런 하자가 없는 상태였다. 뿌듯한 마음에 침대에 누워 스마트폰을 켜고 The Smart Suburbanite 메인 화면을 아래로 쭉 스크롤해 보았다.
그런데 화면을 내리는 내내 가슴 한구석에서 묘한 거부감이 스멀스멀 올라왔다.
“이 사이트… 왜 이렇게 가짜 같지?”
객관적으로 봤을 때 레이아웃이 깨진 곳은 없었다. 하지만 제3자의 눈으로 사이트를 바라보는 순간, 내가 독자라도 이 블로그의 글을 1초 이상 읽고 싶지 않을 것 같다는 생각이 뇌리를 강하게 때렸다.
화면 가득 들어찬 커버 이미지들이 문제였다. 빌드 용량이 가볍고 코드로 찍어내기 편하다는 이유로 채택했던 미니멀 파스텔톤 SVG 일러스트들이 18편의 글마다 줄줄이 걸려 있었는데, 그것이 사이트 전체에 지독한 ‘기계가 찍어낸 가짜 블로그 냄새’를 풍기고 있었던 것이다.
‘AI 냄새(AI Smell)’는 문장이 아니라 이미지에서 먼저 난다
사람들은 보통 문장의 어색한 번역투나 반복되는 접속사만을 ‘AI 티(AI Smell)’라고 생각한다.
하지만 냉정하게 독자의 행동 패턴을 관찰해보면 전혀 그렇지 않다. 검색엔진이나 소셜 미디어에서 링크를 타고 들어온 독자가 이 사이트를 신뢰할지 말지 결정하는 시간은 채 3초도 걸리지 않는다. 글을 정독하기도 전에 시신경을 가장 먼저 때리는 것은 바로 커버 이미지의 분위기다.
특히 최근 웹상에 범람하는 AI 생성 이미지들은 하나같이 끔찍할 정도로 동일한 클리셰를 반복한다.
- 사방에서 번쩍이는 네온 광선: 스마트홈 전구 하나를 소개하는데 방 전체가 사이버펑크 영화처럼 보라색과 시안색 네온 불빛으로 도배되어 있다.
- 뜬금없는 공중 홀로그램: 평범한 와이파이 공유기 위로 정체불명의 3D 회로 기판과 데이터 파란 광선이 허공에 둥둥 떠다닌다.
- 현실에 존재하지 않는 기괴한 기기: 안테나가 7개 달리고 정체불명의 파란 구슬이 박힌, 세상 어떤 쇼핑몰에서도 팔지 않는 공상과학 허브가 당당하게 자리를 차지한다.
- 치아가 너무 많은 가짜 가족 모델: 어색하게 활짝 웃으며 허공을 응시하는 백인 가족의 얼굴이 등장해 “우리는 행복한 스마트홈 가족이에요”를 외친다.
독자가 이런 이미지를 마주하는 순간 무의식적인 경계경보가 발동한다.
“아, 이 글을 쓴 사람은 이 제품을 자기 손으로 만져본 적도 없고, 이런 집에 살아본 적도 없구나.”
본문 텍스트에 아무리 공식 표준 규격(FCC, IEEE, NIST)을 인용하며 신뢰를 쌓으려 발버둥 쳐봤자, 문패 역할을 하는 커버 이미지가 가짜 티를 팍팍 내고 있다면 그 글의 신뢰도는 이미 0점으로 시작하는 셈이다.
전면 폐기 결단: 18편 전체의 커버를 포토리얼리스틱 에셋으로 교체하다
타협하지 않기로 했다. “SVG는 용량이 작아서 모바일 로딩이 빠르다”는 얄팍한 엔지니어링 핑계 뒤에 숨지 않기로 했다.
우리는 커밋 f156b63(feat: replace svg covers with photorealistic jpgs and add in-body images)을 통해 사이트에 남아 있던 SVG 커버 일러스트를 전량 삭제했다. 그리고 18편 전체의 커버를 1200×675 규격의 고화질 실사 에디토리얼 이미지(JPEG)로 1:1 전면 재설계했다.
기존의 밋밋한 추상 벡터 일러스트(좌)와 교외 주택의 실제 설비 질감을 살린 실사 에셋(우)의 차이
우리가 새롭게 세운 이미지 생성 및 프롬프트 가이드라인은 매우 명확했다. 한마디로 “AI 클리셰의 철저한 거세”였다.
1. 네온, 홀로그램, 사이버 그리드 영구 퇴출
현실의 미국 교외 주택에는 파란색 네온사인이 번쩍이지 않는다. 우리는 프롬프트에서 모든 공상과학 요소를 금지어로 지정했다. 대신 따뜻한 2700K 색온도의 생활 조명, 지하실 창문으로 스며드는 자연광, 오래된 오크 목재 책상과 흰색 석고보드 벽면의 현실적인 음영만을 요구했다.
2. 가공의 하이테크 대신 ‘생활 밀착형 설비의 질감’ 묘사
017편(스마트 누수 감지기 및 차단 밸브) 커버를 만들 때는 우주선 같은 최첨단 밸브를 그리지 않았다. 지하실 콘크리트 벽면을 따라 지나가는 실제 PEX 수도관, 약간의 스크래치가 있는 황동(Brass) 볼 밸브, 배관공의 손때가 묻은 렌치 같은 현실의 거친 질감을 살렸다. 018편(홈 와이파이 메시 네트워크) 커버 역시 거실 선반 위 식물 화분 옆에 자연스럽게 놓인 무광 플라스틱 공유기의 차분한 앵글을 잡았다.
3. 텍스트, 라벨, 가짜 배너 일체 금지
유튜브 썸네일처럼 이미지 안에 “BEST 2026”, “SETUP GUIDE” 같은 글자나 빨간색 화살표를 박는 행위를 전면 금지했다. 우리는 인포그래픽 포스터를 만드는 것이 아니라, 권위 있는 테크 매거진의 한 페이지처럼 단정하고 깊이 있는 시각적 쉼표를 제공해야 했기 때문이다.
4. 어색한 인물 대신 ‘작업의 정황’에 집중
인공적인 얼굴을 한 가짜 모델을 세우지 않았다. 대신 현관문 도어벨 나사를 조이기 위해 드라이버를 쥐고 있는 손, 바닥에 굴러다니는 절연 테이프와 전선 피복, 서재 책상 위에 펼쳐진 매뉴얼과 스마트폰 앱 화면처럼 ‘실제 사람이 살면서 장치를 설치하고 고민하는 정황’에 카메라 앵글을 맞췄다.
본문 리딩 경험의 현대화: 표와 레이아웃
이미지를 갈아엎으면서, 커밋 f9af8b8(feat: modernize editorial reading experience)을 통해 본문의 리딩 환경도 함께 손봤다.
가장 신경 쓴 부분은 비교표(Table)였다. The Smart Suburbanite의 핵심 무기는 단순한 줄글이 아니라 제품 간의 규격과 실패 조건을 한눈에 보여주는 표다. 그런데 모바일 화면에서 이 표의 글자가 찌그러지거나 화면 밖으로 넘어가면 독자는 극심한 피로를 느낀다.
우리는 Tailwind CSS와 커스텀 스타일을 적용해, 좁은 스마트폰 화면에서도 표가 깨지지 않고 부드러운 터치 가로스크롤로 넓은 데이터를 탐색할 수 있도록 컨테이너를 감쌌다. 또한 본문 중간중간 텍스트의 호흡을 끊어주면서도 독자가 직관적으로 이해할 수 있는 다이어그램과 보조 컷을 적절히 배치했다.
정직한 비주얼이 만드는 마지막 1인치의 신뢰
18편의 실사 커버 이미지를 모두 배포하고 다시 스마트폰을 열었을 때, 화면 속 The Smart Suburbanite는 완전히 다른 사이트가 되어 있었다.
더 이상 정체불명의 AI 봇이 생성한 싸구려 템플릿 웹사이트가 아니었다. 미국의 오래된 단독주택에 살며 스마트 기기 때문에 골머리를 앓아본 생활자가, 자신의 작업대와 지하실 배관을 찍어 올리며 진지하게 해결책을 정리해둔 ‘진짜 미디어’의 얼굴을 하고 있었다.
이 작업을 통해 뼈저리게 배운 점이 있다.
독자가 느끼는 신뢰는 텍스트의 정교한 논리만으로 완성되지 않는다.
독자가 문을 열고 들어오는 순간 마주하는 화면의 정직함, 거짓말하지 않는 이미지의 질감, 바로 그 시각적 디테일에서 비로소 진정한 콘텐츠의 가치가 시작된다는 사실이다.
이제 18편의 글과 정직한 비주얼, 28개의 정예 사이트맵을 갖춘 The Smart Suburbanite는 조용히 검색엔진의 평가를 기다리는 관찰 궤도에 들어섰다.
우리는 서두르지 않고, 이 튼튼해진 기반 위에서 다음 커밋을 준비할 것이다.