Card News: FOMO Image Direction
역할과 라우팅
이 스킬은 카드 타입이 아니라 이미지 기획 보조 스킬이다. AI 뉴스 카드뉴스에서 첫 화면의 멈춤력과 기사 고유성을 높이기 위해 사용한다.
적용 순서:
hyperframes-card-news로 전체 카드 구조를 정한다.- 이 스킬로 뉴스 사실을 이미지 콘셉트와 A/B/C 시안으로 번역한다.
- 실제 구현은
hyperframes-card-news-work-photo-cover 또는 hyperframes-card-news-work-image-feature를 따른다.
overview.html의 축소 썸네일과 상세 화면에서 최종 이미지를 고른다.
허용 data-skill은 계속 photo-cover, video-cover, stat, image-feature 네 가지뿐이다. fomo, hook, fomo-image 같은 값을 새로 만들지 않는다.
목표
좋은 표지는 텍스트를 가려도 1초 안에 다음 세 가지 중 두 가지 이상이 보인다.
- 누구 또는 무엇에 관한 뉴스인가
- 무슨 변화·충돌·기회가 생겼는가
- 왜 지금 봐야 하는가
어두운 방 + 노트북 + 홀로그램 + 평범한 로봇처럼 어느 AI 기사에도 붙일 수 있는 이미지는 사용하지 않는다.
사실 확인 선행
이미지의 긴장감이 기사 사실보다 앞서면 안 된다.
- 발행 전 핵심 주장과 수치는 신뢰할 수 있는 출처 2개 이상으로 교차 확인한다.
- 출시, 무료, 종료, 보안 사고, 인수, 가격처럼 상태가 바뀔 수 있는 표현은 날짜와 범위를 확인한다.
- 확인되지 않은 피해, 공포, 인수 완료, 서비스 종료를 이미지로 단정하지 않는다.
- 시각적 은유가 실제 사건 사진처럼 오해될 수 있으면 카드 또는 캡션에
AI 생성 이미지, 연출 이미지, 개념도를 표시한다.
1초 훅 공식
인지 가능한 단일 주인공 + 기사 고유의 사물 + 한 가지 위기/욕망 + 짧은 사실형 헤드라인
필수 원칙
- 주인공 하나: 얼굴, 제품, 스마트폰, 서비스 화면, 동물, 거대한 숫자 중 하나를 우선한다.
- 은유 하나: 문, 게이트, 자판기, 경주, 미로, 금고, 파도, 균열처럼 사건을 즉시 이해시키는 장치 하나만 쓴다.
- 긴장 하나: 최신성, 손실, 희소성, 경쟁, 사회적 증거 중 하나를 선택한다.
- 색 두세 개: 검정/짙은 남색을 바탕으로 경고색 1개와 보조색 1개만 쓴다.
- 텍스트 여백: 4:5 기준 상단 65-70%를 이미지에, 하단 30-35%를 어두운 제목 영역에 남긴다.
- 모바일 크롭: 주인공의 얼굴·제품·손이 하단 헤드라인에 가리지 않게 한다.
뉴스 유형을 시각적 은유로 바꾸기
| 뉴스 유형 |
권장 주인공 |
권장 은유 |
FOMO 신호 |
| 신제품·출시 |
제품, UI, 창업자 |
열리는 문, 스포트라이트, 공개 무대 |
방금 공개, 지금 사용 가능 |
| 가격·무료·제한 |
제품, 카드, 사용량 계기 |
결제 게이트, 자판기, 금고, 영수증 |
무료, 추가 결제, 마감 |
| 성능·벤치마크 |
모델, 칩, 사람 |
경주, 시상대, 미로 탈출, 계기판 |
1위, 인간 추월, 격차 |
| 보안·개인정보 |
화면, 계정, 데이터 |
깨진 유리, 화면을 뚫는 손, 열린 자물쇠 |
옵트아웃, 유출, 즉시 확인 |
| 인수·투자·제휴 |
인물, 양사 제품 |
악수, 거대한 배지 병치, 다리 |
거액, 공식, 독점 |
| 활용법·바이럴 |
결과물, 사용자 |
전후 변화, 생산 라인, 포털 |
시간 절약, 댓글·사용자 수 |
이미지 자산 우선순위
- 공식 제품 이미지·스크린샷·사용 허가가 명확한 실사를 내려받아 로컬
assets/에서 사용한다.
- 실제 사진과 공식 로고를 수작업으로 합성한 편집 이미지.
- 기사 사실을 하나의 은유로 번역한 AI 생성 편집 이미지.
- 일반 스톡 이미지는 기사 고유 사물과 주인공을 확보할 수 있을 때만 사용한다.
실존 인물과 실제 사건은 AI로 가짜 현장 사진처럼 재현하기보다 정식 사진 또는 명백한 포스터형 콜라주를 우선한다. 로고, 숫자, 한글, 제품명은 이미지 모델에 맡기지 말고 HTML/CSS에서 정확하게 합성한다.
생성 프롬프트 조립식
4:5 vertical editorial technology-news poster.
[뉴스 사건]을 [한 가지 시각적 은유]로 표현한다.
[단일 주인공]이 [명확한 행동/감정]을 보이고,
[기사 고유의 사물]이 크게 보인다.
[카메라 구도와 렌즈], [조명],
black/deep navy background with [경고색] and [보조색],
high-contrast realistic editorial composite,
subtle halftone and magazine texture.
Main subject fills the upper 70 percent.
Leave a clean dark gradient in the lower 30 percent for headline.
No text, no letters, no numbers, no logo, no watermark,
no illegible UI, no clutter, no extra fingers, no distorted face.
프롬프트에는 반드시 주인공, 은유, 감정/행동, 구도, 조명, 색, 제목 여백, 제외 조건을 넣는다. 단순히 cinematic, futuristic, AI technology만 나열하지 않는다.
A/B/C 시안 규칙
같은 사건을 아래 세 방향으로 만든다.
- A 사실 중심: 제품·화면·공식 자산이 주인공. 신뢰와 이해가 우선.
- B 인물 중심: 한 명의 표정·행동으로 손실 또는 욕망을 전달.
- C 은유 중심: 게이트·경주·금고·균열 같은 불가능한 장면으로 사건을 시각화.
파일명 예시:
assets/cover-a-fact.jpg
assets/cover-b-person.jpg
assets/cover-c-metaphor.jpg
최종 선택 기준:
- 320px 내외의 3열 피드 축소 상태에서 주인공이 보이는가
- 텍스트를 가려도 기사 주제 또는 사건 방향이 읽히는가
- 다른 AI 기사에도 그대로 쓸 수 있는 generic 이미지가 아닌가
- 손, 얼굴, UI, 글자, 로고에 생성 오류가 없는가
- 헤드라인 영역과 주인공이 충돌하지 않는가
선택되지 않은 시안은 필요 없으면 삭제하고, 채택한 자산의 출처·생성 여부를 topics/<주제>/assets/ 또는 제작 메모에 기록한다.
카피와 이미지의 역할 분리
- 이미지는 사건과 감정을 보여준다.
- 헤드라인은 검증된 사실과 호기심 공백을 만든다.
- 숫자, 가격, 날짜, 제품명은 생성 이미지가 아니라 HTML 텍스트로 쓴다.
방금, 무료, 최초, 종료, 인간 추월은 사실일 때만 사용한다.- 표지는 결론을 모두 설명하지 않지만, 다른 사건으로 오해하게 만들면 안 된다.
최종 체크
1---2name: hyperframes-card-news-fomo-image-direction3description: AI 뉴스 인스타 카드뉴스의 표지·대표 이미지를 기획하거나 교체하고 FOMO·후킹 이미지를 만들 때 사용하는 보조 스킬. generic AI 이미지를 피하고, 최신성·손실·희소성·경쟁·사회적 증거를 구체적인 시각적 은유로 번역한다. photo-cover 또는 image-feature용 이미지 소싱, 생성 프롬프트, A/B/C 시안 선택, 오해 방지 검수를 다루며 새 data-skill 타입은 만들지 않는다.4---56# Card News: FOMO Image Direction78## 역할과 라우팅910이 스킬은 카드 타입이 아니라 **이미지 기획 보조 스킬**이다. AI 뉴스 카드뉴스에서 첫 화면의 멈춤력과 기사 고유성을 높이기 위해 사용한다.1112적용 순서:13141. `hyperframes-card-news`로 전체 카드 구조를 정한다.152. 이 스킬로 뉴스 사실을 이미지 콘셉트와 A/B/C 시안으로 번역한다.163. 실제 구현은 `hyperframes-card-news-work-photo-cover` 또는 `hyperframes-card-news-work-image-feature`를 따른다.174. `overview.html`의 축소 썸네일과 상세 화면에서 최종 이미지를 고른다.1819허용 `data-skill`은 계속 `photo-cover`, `video-cover`, `stat`, `image-feature` 네 가지뿐이다. `fomo`, `hook`, `fomo-image` 같은 값을 새로 만들지 않는다.2021## 목표2223좋은 표지는 텍스트를 가려도 1초 안에 다음 세 가지 중 두 가지 이상이 보인다.2425- 누구 또는 무엇에 관한 뉴스인가26- 무슨 변화·충돌·기회가 생겼는가27- 왜 지금 봐야 하는가2829`어두운 방 + 노트북 + 홀로그램 + 평범한 로봇`처럼 어느 AI 기사에도 붙일 수 있는 이미지는 사용하지 않는다.3031## 사실 확인 선행3233이미지의 긴장감이 기사 사실보다 앞서면 안 된다.3435- 발행 전 핵심 주장과 수치는 신뢰할 수 있는 출처 2개 이상으로 교차 확인한다.36- 출시, 무료, 종료, 보안 사고, 인수, 가격처럼 상태가 바뀔 수 있는 표현은 날짜와 범위를 확인한다.37- 확인되지 않은 피해, 공포, 인수 완료, 서비스 종료를 이미지로 단정하지 않는다.38- 시각적 은유가 실제 사건 사진처럼 오해될 수 있으면 카드 또는 캡션에 `AI 생성 이미지`, `연출 이미지`, `개념도`를 표시한다.3940## 1초 훅 공식4142`인지 가능한 단일 주인공 + 기사 고유의 사물 + 한 가지 위기/욕망 + 짧은 사실형 헤드라인`4344### 필수 원칙4546- **주인공 하나**: 얼굴, 제품, 스마트폰, 서비스 화면, 동물, 거대한 숫자 중 하나를 우선한다.47- **은유 하나**: 문, 게이트, 자판기, 경주, 미로, 금고, 파도, 균열처럼 사건을 즉시 이해시키는 장치 하나만 쓴다.48- **긴장 하나**: 최신성, 손실, 희소성, 경쟁, 사회적 증거 중 하나를 선택한다.49- **색 두세 개**: 검정/짙은 남색을 바탕으로 경고색 1개와 보조색 1개만 쓴다.50- **텍스트 여백**: 4:5 기준 상단 65-70%를 이미지에, 하단 30-35%를 어두운 제목 영역에 남긴다.51- **모바일 크롭**: 주인공의 얼굴·제품·손이 하단 헤드라인에 가리지 않게 한다.5253## 뉴스 유형을 시각적 은유로 바꾸기5455| 뉴스 유형 | 권장 주인공 | 권장 은유 | FOMO 신호 |56|---|---|---|---|57| 신제품·출시 | 제품, UI, 창업자 | 열리는 문, 스포트라이트, 공개 무대 | 방금 공개, 지금 사용 가능 |58| 가격·무료·제한 | 제품, 카드, 사용량 계기 | 결제 게이트, 자판기, 금고, 영수증 | 무료, 추가 결제, 마감 |59| 성능·벤치마크 | 모델, 칩, 사람 | 경주, 시상대, 미로 탈출, 계기판 | 1위, 인간 추월, 격차 |60| 보안·개인정보 | 화면, 계정, 데이터 | 깨진 유리, 화면을 뚫는 손, 열린 자물쇠 | 옵트아웃, 유출, 즉시 확인 |61| 인수·투자·제휴 | 인물, 양사 제품 | 악수, 거대한 배지 병치, 다리 | 거액, 공식, 독점 |62| 활용법·바이럴 | 결과물, 사용자 | 전후 변화, 생산 라인, 포털 | 시간 절약, 댓글·사용자 수 |6364## 이미지 자산 우선순위65661. **공식 제품 이미지·스크린샷·사용 허가가 명확한 실사**를 내려받아 로컬 `assets/`에서 사용한다.672. 실제 사진과 공식 로고를 수작업으로 합성한 편집 이미지.683. 기사 사실을 하나의 은유로 번역한 AI 생성 편집 이미지.694. 일반 스톡 이미지는 기사 고유 사물과 주인공을 확보할 수 있을 때만 사용한다.7071실존 인물과 실제 사건은 AI로 가짜 현장 사진처럼 재현하기보다 정식 사진 또는 명백한 포스터형 콜라주를 우선한다. 로고, 숫자, 한글, 제품명은 이미지 모델에 맡기지 말고 HTML/CSS에서 정확하게 합성한다.7273## 생성 프롬프트 조립식7475```text764:5 vertical editorial technology-news poster.7778[뉴스 사건]을 [한 가지 시각적 은유]로 표현한다.79[단일 주인공]이 [명확한 행동/감정]을 보이고,80[기사 고유의 사물]이 크게 보인다.8182[카메라 구도와 렌즈], [조명],83black/deep navy background with [경고색] and [보조색],84high-contrast realistic editorial composite,85subtle halftone and magazine texture.8687Main subject fills the upper 70 percent.88Leave a clean dark gradient in the lower 30 percent for headline.8990No text, no letters, no numbers, no logo, no watermark,91no illegible UI, no clutter, no extra fingers, no distorted face.92```9394프롬프트에는 반드시 `주인공`, `은유`, `감정/행동`, `구도`, `조명`, `색`, `제목 여백`, `제외 조건`을 넣는다. 단순히 `cinematic`, `futuristic`, `AI technology`만 나열하지 않는다.9596## A/B/C 시안 규칙9798같은 사건을 아래 세 방향으로 만든다.99100- **A 사실 중심**: 제품·화면·공식 자산이 주인공. 신뢰와 이해가 우선.101- **B 인물 중심**: 한 명의 표정·행동으로 손실 또는 욕망을 전달.102- **C 은유 중심**: 게이트·경주·금고·균열 같은 불가능한 장면으로 사건을 시각화.103104파일명 예시:105106```text107assets/cover-a-fact.jpg108assets/cover-b-person.jpg109assets/cover-c-metaphor.jpg110```111112최종 선택 기준:1131141. 320px 내외의 3열 피드 축소 상태에서 주인공이 보이는가1152. 텍스트를 가려도 기사 주제 또는 사건 방향이 읽히는가1163. 다른 AI 기사에도 그대로 쓸 수 있는 generic 이미지가 아닌가1174. 손, 얼굴, UI, 글자, 로고에 생성 오류가 없는가1185. 헤드라인 영역과 주인공이 충돌하지 않는가119120선택되지 않은 시안은 필요 없으면 삭제하고, 채택한 자산의 출처·생성 여부를 `topics/<주제>/assets/` 또는 제작 메모에 기록한다.121122## 카피와 이미지의 역할 분리123124- 이미지는 **사건과 감정**을 보여준다.125- 헤드라인은 **검증된 사실과 호기심 공백**을 만든다.126- 숫자, 가격, 날짜, 제품명은 생성 이미지가 아니라 HTML 텍스트로 쓴다.127- `방금`, `무료`, `최초`, `종료`, `인간 추월`은 사실일 때만 사용한다.128- 표지는 결론을 모두 설명하지 않지만, 다른 사건으로 오해하게 만들면 안 된다.129130## 최종 체크131132- [ ] `hyperframes-card-news`와 실제 카드 타입 스킬을 함께 적용함133- [ ] 새 `data-skill` 타입을 만들지 않음134- [ ] 출처 2개 이상으로 핵심 사실과 날짜를 확인함135- [ ] 한 장에 주인공 하나, 은유 하나, 긴장 하나136- [ ] generic AI 작업실·로봇·홀로그램 이미지를 피함137- [ ] 로고·숫자·한글을 HTML/CSS에서 정확히 합성함138- [ ] 하단 30-35% 제목 여백과 모바일 크롭을 확인함139- [ ] A/B/C를 비교하고 축소 썸네일에서 최종 선택함140- [ ] AI 생성·연출 이미지가 실제 사진으로 오해되지 않게 표시함
canine89