2026-08-25 작성. 다음 세션이 이 파일만 읽고 바로 시작할 수 있게 적었다.
앞선 세션에서 og 버그는 이미 고쳤다(배포 완료). 남은 건 그림이 진짜 없는 것뿐이다.
큐 글 33편 중 30편이 공용 대체 이미지 3장을 돌려쓰고 있다. 큐 자기 목록에서도,
본진 인사이트(the-moment.us/insights/)에서도 같은 그림이 17장·9장씩 반복된다.
대표 지적(8/25): "cue는 왜 썸네일이 컨텐츠 속 썸네일이 아니야?"
확인 결과 글 안에도 쓸 그림이 없었다 — 본문 이미지까지 전부 같은 대체 3장이었다.
| 갈래 | 편수 | 표지 |
|---|---|---|
| 응급(first-aid) | 6 | ✅ 6/6 자기 그림 — 손대지 마라. 이게 톤 기준이다 |
| 플레이북 | 33 | 자기 그림 3편 / 공용 대체 28편 / 없음 2편 |
만들 대상 = 플레이북 30편.
보유 그림 전부: public/img/pb/ 3장 · public/img/first-aid/ 12장 · public/img/site/ 5장.
src/index.js ogTags() 에 image 인자 추가 → 글마다 자기 표지가 og:image 로 나간다.cover 다(coverSrc 아님). 건드릴 때 주의.data/og_cache.json 의 큐 항목은 비워서 갱신했다. 표지를 새로 넣으면 또 비워야 한다.톤 기준 = public/img/first-aid/*-cover.jpg 6장. 열어 보고 그 결을 따라가라.
차분한 실사 사진, 글자 없음, 사람 얼굴은 크게 잡지 않는다. 면접 앞둔 사람이 보는 페이지라
자극적이면 안 된다. 🚫 마크식 큰 색글자 배너는 큐에 안 맞는다.
img/pb/ 3장과 동일). 응급은 1600x893·1440x803 이 섞여 있는데notes/pipeline/imggen.py(creagen→fal 폴백·예산가드) 또는 ugc-factory/src/image.py(가벼움).python3 ~/Projects/cap.py "i2i 커버 생성" 으로 다시 확인 가능.public/img/pb/<slug>.jpgpublic/data/playbook.json 에 연결각 글의 cover 를 이렇게 채운다:
"cover": { "src": "/img/pb/<slug>.jpg", "alt": "<글 내용을 설명하는 한 줄>" }
이 필드 하나만 채우면 세 곳에 동시에 반영된다 — 글 상단 표지 · 큐 목록 카드 · 본진 인사이트.
cd ~/Projects/cue && npm run deploy
# og 가 글마다 다른지 (같은 파일명이 반복되면 실패)
curl -s https://cue.the-moment.us/playbook/<slug> | grep 'og:image'
cd ~/Projects/momentus
# ⚠️ 본진은 og 를 캐시한다 — 안 비우면 옛 그림이 그대로 남는다
python3 -c "import json,io;p='data/og_cache.json';d=json.load(open(p));d={k:v for k,v in d.items() if 'cue.the-moment' not in k};io.open(p,'w',encoding='utf-8').write(json.dumps(d,ensure_ascii=False,indent=1))"
python3 scripts/gen_site.py && npx wrangler deploy
검증은 눈이 아니라 숫자로. 본진 목록에서 큐 카드의 그림 파일명을 세어
서로 다른 그림이 30종 이상이면 성공. 지금은 6종이다.
| # | slug | 단계 | 제목 | 지금 쓰는 그림 |
|---|---|---|---|---|
| 1 | interview-job-posting-closed |
waiting | 면접 후 채용공고 삭제 — 합격자가 정해졌다는 뜻은 아닙니다 | step-ambush.jpg |
| 2 | different-role-after-interview-rejection |
retry | 면접 탈락 후 같은 회사 다른 직무 지원 — 지원서 말고 두 공고부터 비교하세요 | step-empty.jpg |
| 3 | blind-interview-self-introduction |
soon | 블라인드 면접 자기소개 — 학교명은 빼세요. 면접관이 원래 못 받는 정보입니다 | step-ambush.jpg |
| 4 | quiet-work-interview-achievement |
before | 면접에서 말할 성과가 없을 때 — ‘아무 일도 없었다’도 성과입니다 | step-empty.jpg |
| 5 | reopened-job-postings-market-trend |
before | 채용 시장 동향 — 공고 재등장 268건, 신규 채용 268건은 아닙니다 | step-ambush.jpg |
| 6 | daangn-backend-interview-questions |
before | 당근 백엔드 면접 질문 — Go보다 먼저, 지원 팀의 ‘고객’을 보세요 | step-empty.jpg |
| 7 | post-interview-thank-you-email |
after | 면접 후 감사 메일 — 못한 답까지 붙이면 감사가 아니라 재면접입니다 | step-empty.jpg |
| 8 | reapply-after-rejection |
retry | 탈락한 회사 재지원 — 새 지원서보다 ‘지난번과 달라진 한 줄’이 먼저입니다 | step-ambush.jpg |
| 9 | job-search-burnout |
retry | 취업 번아웃 — 매일 넣은 지원서는 채용팀에 출석부로 보이지 않습니다 | step-empty.jpg |
| 10 | late-for-interview |
soon | 면접 지각할 것 같을 때 — 사과문 말고, 도착 시각부터 보내세요 | step-ambush.jpg |
| 11 | career-interview-reason-for-leaving |
before | 경력직 면접 퇴사 사유 — 면접관은 과거보다 ‘여기서도 나갈지’를 봅니다 | step-ambush.jpg |
| 12 | interview-rejection-mental-reset |
retry | 면접 탈락 멘탈 — ‘결정적 실수’ 하나를 찾지 마세요. 회사도 하나로 정하지 않았을 수 있습 | step-empty.jpg |
| 13 | product-designer-interview-questions |
before | 프로덕트 디자이너 면접 질문 — 버린 시안이 최종 화면보다 쓸모 있습니다 | step-empty.jpg |
| 14 | interview-result-delay |
waiting | 면접 결과 언제 나오나요 — 법에도 ‘면접 후 며칠’은 없습니다 | step-mirror.jpg |
| 15 | interview-rejection-feedback |
retry | 면접 탈락 피드백 — ‘자신감 부족’을 성격 고치라는 말로 읽지 마세요 | step-ambush.jpg |
| 16 | job-reposted-after-rejection |
retry | 면접 탈락 후 공고 재등록 — 회사의 후회가 아니라 ‘복사’ 버튼일 수 있습니다 | step-ambush.jpg |
| 17 | final-rejection-risk |
retry | 최종 면접 탈락 이유 — 잘한 답보다, 못 지운 의심이 남습니다 | step-empty.jpg |
| 18 | interviewer-face-signal |
after | 면접관 표정이 안 좋았다고요? — 합격 신호는 얼굴에 안 나옵니다 | step-mirror.jpg |
| 19 | first-sentence |
soon | 면접에서 머리가 하얘질 때 — 첫 문장 여는 3가지 방법 | 없음 |
| 20 | aim |
prep | 면접 답변 방법 — 길게 잘 말하면 다른 평가 기회가 사라집니다 | step-empty.jpg |
| 21 | self-intro |
prep | 면접 자기소개는 요약문이 아닙니다 — 면접관이 물을 증거 하나를 심으세요 | step-empty.jpg |
| 22 | conclusion-first |
prep | "결론부터 말씀드리면"이 면접에서 먹히는 진짜 이유 | 없음 |
| 23 | pressure |
prep | 압박 면접 꼬리질문 — 침착함보다 평가표의 빈칸을 먼저 채우세요 | step-empty.jpg |
| 24 | numbers |
prep | 면접 성과 어필 — 숫자보다 ‘내가 바꾼 것’이 평가표에 남습니다 | step-empty.jpg |
| 25 | company-diff |
before | 대기업 면접 특징 — 회사마다 다른 건 질문이 아니라 평가표의 칸입니다 | step-empty.jpg |
| 26 | night-before |
soon | 면접 전날 준비 — 예상질문 더 보지 말고, 채용공고 한 줄에 증거를 붙이세요 | step-empty.jpg |
| 27 | pm-experienced-interview-question-types |
prep | PM 경력직 면접 질문 유형 — 답 5개 말고, 프로젝트별 증거 5칸을 준비하세요 | step-empty.jpg |
| 28 | developer-job-change-interview-prep |
before | 개발자 이직 면접 준비 방법 — 기술 이름 말고, 왜 골랐는지 적으세요 | step-empty.jpg |
| 29 | data-analyst-interview-questions |
prep | 데이터 분석가 면접 예상질문 — SQL 정답만 맞히면 평가표 두 칸이 빕니다 | step-ambush.jpg |
| 30 | experienced-interview-star-method |
prep | 경력 기술 면접 STAR 기법 — 이야기가 아니라 평가표에 증거를 남기세요 | step-empty.jpg |
단계(stage) 뜻 — prep 평상시 · before 아직 면접 전 · soon 코앞 · after 면접 후 ·
waiting 결과 기다리는 중 · retry 다시 준비. 같은 단계끼리 결을 맞추면 목록이 정돈돼 보인다.
public/img/site/step-*.jpg 를 새 글에 다시 붙이지 마라. 그게 지금 문제의 원인이다./playbook/<slug>)를 바꾸지 마라. 31편이 이미 색인돼 있다.