블로그에 맨날 똑같은 노트북 사진만 나왔던 이유 (그리고 해결기)
AI로 글을 뽑다 보면 왜 항상 어두운 방에서 맥북을 쳐다보는 판박이 사진만 나올까? 범인은 프롬프트에 금지어를 덕지덕지 붙여놓은 나 자신이었다. 족쇄를 풀고 표지와 본문 이미지를 사람 냄새나게 뜯어고친 기록.
“또 그 노트북 사진이야?”: 모아놓고 보니 소름 돋았던 순간
며칠 전 블로그 글들을 쭉 넘겨보다가 문득 머리를 한 대 맞은 것 같았다.
글 주제는 분명 완전히 제각각이었다. 미국 교외 주택의 200A 배전반과 대용량 배터리 백업 가이드, 중국 DRAM 발표가 글로벌 반도체 시장에 미치는 영향 분석, 그리고 이번 주 깃허브 트렌딩 오픈소스 정리까지.
그런데 생성된 표지 이미지를 한 화면에 나란히 늘어놓고 보니, 놀라울 정도로 판박이였다.
어두침침한 방, 원목 책상 위에 놓인 맥북, 화면에서 새어 나오는 푸르스름한 네온 불빛, 그리고 턱을 괴고 심각한 표정으로 모니터를 응시하는 사람의 옆모습.
배경의 커피 머그잔 위치와 창문 블라인드 각도만 조금씩 다를 뿐, 1초 만에 훑어보면 전부 같은 날 찍은 스톡 사진 1, 2, 3탄 같았다.
누가 봐도 전형적인 ‘AI 툴 돌려서 대충 찍어낸 블로그’의 냄새가 풀풀 났다. 코딩하다 멘붕 와서 머리를 쥐어뜯는 사진이나, 실제 배전반 전선관이나 기판 같은 날것의 사진이 들어가야 제맛인데, 왜 죄다 컴퓨터 앞 책상 사진만 나오는 걸까?
어이가 없어서 웃음이 나오면서도 등골이 서늘해졌다.
범인은 누구인가: 내가 만든 ‘족쇄’의 역설
처음엔 AI 이미지 모델이 상상력이 부족해서 그런 줄 알았다.
그런데 시스템 프롬프트와 에이전트 가이드라인 파일을 차근차근 열어보다가 뒷목을 잡았다. 범인은 바로 나 자신이었다.
1
2
3
4
# 과거 사이트 가이드라인에 적혀 있던 실제 규칙들
- 프레젠테이션 슬라이드 같은 느낌은 피할 것.
- 차분한 작업 공간, 노트북, 터미널 불빛, 케이블 위주로 연출할 것.
- 이미지 내 읽을 수 있는 텍스트, 화살표, 플로우차트, 가짜 UI, 과장된 그래픽은 금지.
내가 이 규칙들을 적었을 때의 의도는 아주 단순했다. 촌스러운 PPT 슬라이드나 어설픈 가짜 인포그래픽, 정체불명의 네온 사이버펑크 클립아트 같은 전형적인 삼류 이미지를 원천 차단하고 싶었던 것이다.
Figure 1: 방어적 규칙이 AI를 가장 진부한 ‘안전빵’으로 몰아넣는 족쇄의 역설
하지만 AI 모델 입장에서 생각해 보니 상황이 전혀 달랐다.
AI는 규칙을 평가할 때 감점 위험(Penalty)을 가장 두려워한다.
- 텍스트나 도식을 넣으면 규칙 위반.
- 화려한 그래픽을 넣으면 “슬라이드 같다”고 탈락.
- 인물이 조금만 과장된 행동을 해도 “부자연스럽다”고 거부.
결국 AI 입장에서 모든 금지 조건을 100% 피해 가며 혼나지 않을 수 있는 유일한 ‘안전빵’이 바로 ‘조용한 책상 위에 놓인 노트북 모니터’ 하나뿐이었던 것이다.
내가 세운 안전장치가 역설적으로 AI의 모든 상상력을 거세하고 세상에서 제일 지루한 껍데기만 남겨버린 셈이었다.
해결 1: 표지에서 ‘금지어’를 걷어내고 감정을 살리다
문제를 알았으니 고치는 건 간단했다. “뭘 하지 마라”는 네거티브 제약을 다 걷어내고, “진짜 사람이 눈길을 줄 만한 장면”의 선택지를 넓혀주었다.
- 진짜 사람의 표정과 감정: 코드가 터졌을 때 머리를 감싸 쥐는 고뇌, 어이없어 터져 나오는 실소, 뜻밖의 버그를 마주한 깊은 한숨 같은 생생한 리액션을 허용했다.
- 날것 그대로의 물리적 현장: 책상 사진 대신 주제가 요구하는 현장을 담는다. 배전반 글이면 실제 차단기함과 금속 전선관(EMT), 골든아워 햇살을 받는 외벽 배터리를 비추고, 하드웨어 글이면 실제 회로 기판 텍스처를 살린다.
- 세련된 다크 테크 포스터: 깃허브 트렌딩 같은 시리즈는 억지스러운 인물 사진 대신 과감한 타이포그래피가 들어간 매거진 커버 스타일을 채택했다.
오늘 이 글의 표지로 쓰인 “모니터에 ‘NO MORE LAPTOPS!’ 포스트잇을 붙여놓고 허탈하게 웃는 개발자” 모습도, 이 금지 족쇄를 풀자마자 AI가 뽑아낸 결과물이다. 그래, 이런 게 블로그 표지지.
해결 2: 본문 이미지, ‘PPT 발표 장표’의 함정을 벗어나다
표지 문제를 풀고 나니 다음 숙제가 기다리고 있었다. 글만 너무 빽빽해서 읽다가 숨이 막히지 않도록 본문 중간에도 적재적소에 참고 이미지를 넣어야 했다.
외부 툴을 쓰면 귀찮으니, 로컬 크롬(Headless Chrome)으로 HTML 코드를 0.8초 만에 고해상도 PNG로 굽는 스크립트를 직접 짜서 붙였다.
Figure 2: 웹 표준 코드로 작성하고 로컬 크롬이 0.8초 만에 렌더링하는 파이프라인
그런데 첫 결과물을 뽑아놓고 보니 또 다른 늪에 빠져 있었다.
이번엔 본문 도식이 “어두운 배경 + 둥근 모서리 상자 3개 나란히 배치 + 상단 배지”로 이어지는 전형적인 ‘회사 회의실 PPT 장표’ 느낌이었던 것이다.
표지에서는 책상 사진에 갇혀 있더니, 본문에서는 PPT 카드 나열에 스스로를 가둬두고 있었다.
블로그 본문 중간에 들어가는 도식은 발표 슬라이드가 아니다. 모바일에서 스크롤을 내리며 읽을 때 눈에 거슬리지 않고 복잡한 내용을 단숨에 이해시켜 주는 ‘Stripe나 애플 개발자 문서 같은 담백한 미니멀 스키매틱’이어야 했다.
곧바로 방향을 바꿨다:
- 복잡한 박스를 걷어내고, 깔끔한 화이트 배경 위에 핵심 노드와 화살표만 남겼다.
- 툴 실행 결과는 장황한 카드 대신 실제 개발자 터미널 캡처 스타일로 담백하게 바꿨다.
본문 시각화 역시 특정 템플릿에 가두는 순간 또 다른 정형화가 된다. 화이트 스키매틱, 날것의 터미널, 실제 기기 사진 등 글의 내용에 맞는 형태를 유연하게 써야 한다는 원칙을 세웠다.
덤으로 잡은 템플릿 버그와 카테고리 교통정리
작업하는 김에 평소 눈에 밟히던 두 가지도 같이 손을 봤다.
1) AstroPaper 본문 표지 누락 버그
The Smart Suburbanite 블로그에서 홈 화면 목록에는 표지가 잘 나오는데, 글 본문 상세 페이지에 들어가면 표지 이미지가 사라지는 현상이 있었다.
템플릿(src/pages/posts/[...slug]/index.astro)을 뜯어보니 목록 카드에는 썸네일 코드가 있는데 상세 페이지 템플릿 내부에는 ogImageUrl 렌더링 코드가 아예 빠져 있었다. 상단에 히어로 이미지 영역을 명시적으로 추가해서 모바일과 PC 모두에서 시원하게 표지가 뜨도록 고쳤다.
2) 반도체 글의 YMYL 테크 분류
The Noise Filter에서 중국 창신메모리(CXMT)와 삼성/하이닉스 충격을 다룰 때, 주가 변동을 다룬다고 해서 ‘금융/소비자’ 카테고리에 넣을 뻔했다.
하지만 구글 검색의 YMYL(Your Money or Your Life) 기준은 금융/투자 조언에 매우 가혹하다. 공식 라이선스가 없는 사이트가 섣불리 주식이나 금융 분석 흉내를 내면 저품질 페널티를 맞기 십상이다.
그래서 글의 초점을 주가 전망이 아닌 하드웨어 물리학(4F² 공정 구조, EUV 수율 한계, HBM4 방열 설계)으로 꽉 채우고, 카테고리도 명확하게 tech-ai로 고정했다.
이번 삽질에서 얻은 교훈
사람은 쉽게 잊고, AI는 대화가 끝나면 리셋된다. 그래서 이번에 겪은 시행착오와 기준을 시스템 규칙(AGENTS.md와 에디토리얼 스킬)으로 영구 문서화해 두었다.
이번 삽질이 남긴 가장 큰 교훈은 명확하다.
AI에게 품질을 높이겠답시고 “이것도 하지 말고, 저것도 하지 말고, 이것도 금지야”라며 네거티브 족쇄만 채우면, AI는 가장 무난하고 진부한 최악의 타협점(Local Minimum)을 찾아 숨어버린다.
진짜 좋은 시스템 가이드라인은 위험을 막는 벽을 세우는 데서 그치는 것이 아니라, “독자가 보기에 재미있고 사람 냄새나는 대안이 무엇인가”를 열어주고 구체적인 표현의 자유를 주는 것이다.
적어도 앞으로 내 블로그에서 ‘어두운 방에서 노트북만 멍하니 바라보는 스톡 사진’을 다시 볼 일은 없을 것 같다.