Claude Code로 인스타그램 카드뉴스 자동 생성하기 - instagram-card-news 사용 가이드

2026년 4월 3일
조회수 41
코멘트0

목차

인스타그램 카드뉴스를 만들려면 보통 Canva나 Figma에서 수작업으로 디자인해야 합니다. instagram-card-news는 Claude Code에서 한 줄 입력만으로 리서치, 팩트체크, 카피라이팅, 렌더링, 시각 검수까지 자동으로 처리하여 인스타그램 규격(1080x1350px) PNG 이미지를 생성하는 오픈소스 프로젝트입니다.

"카드뉴스 만들어줘: AI 트렌드" 한 마디면 7장짜리 전문 카드뉴스가 output/ 폴더에 떨어집니다.

어떻게 동작하나?

단순한 이미지 생성이 아니라, 6단계 자동화 파이프라인이 순차 실행됩니다:

  1. 요청 파싱 — 주제, 톤, 스타일, 장수 추출
  2. 리서치 — 웹 검색으로 핵심 포인트, 통계, 인용문 수집
  3. 팩트체크 — 팩트체커 + 리서치 전문가가 병렬로 검증
  4. 카피라이팅 토론 (Team 모드) — 카피라이터 + 후크 전문가가 합의할 때까지 협업
  5. 렌더링 — Puppeteer가 HTML 템플릿을 1080x1350px PNG로 변환
  6. 시각 검수 — 가독성, 텍스트 오버플로, 흐름, CTA 명확성 확인

설치 방법

방법 1: 저장소 클론 (기존 프로젝트에 추가)

git clone https://github.com/junghwaYang/instagram-card-news.git
cd instagram-card-news
npm install
claude

Claude Code에서 바로 요청합니다:

카드뉴스 만들어줘: 2025 디지털 마케팅 트렌드

방법 2: Claude Code 스킬로 설치 (빈 폴더에서 시작)

# 원라인 설치
curl -sSL https://raw.githubusercontent.com/junghwaYang/card-news-setup/main/install.sh | bash

# 또는 수동 설치
mkdir -p ~/.claude/skills/card-news-setup
curl -sSL https://raw.githubusercontent.com/junghwaYang/card-news-setup/main/SKILL.md \
  -o ~/.claude/skills/card-news-setup/SKILL.md

이후 새 폴더에서:

mkdir my-card-news && cd my-card-news
claude
/card-news-setup

사용 예시

입력 결과
카드뉴스 만들어줘: AI 트렌드기본 clean 스타일, 7장
볼드 스타일로 "성공하는 아침 루틴" 카드뉴스 5장bold 템플릿, 5장
"ChatGPT 활용법" 카드뉴스, 엘레건트, 10장, 악센트 #FF6B6Belegant, 10장, 빨간 악센트
미니멀 스타일로 투자 기초 지식, @finance_tipsminimal, 계정명 포함

8가지 템플릿 스타일

스타일 특징 악센트 컬러
clean에디토리얼 스타일 (기본값) #8BC34A (라임 그린)
minimal정보 중심, 깔끔 #2D63E2 (블루)
bold강렬한 임팩트, 그라데이션 #6C5CE7 (퍼플)
elegant프리미엄 느낌, 다크 배경 #D4AF37 (골드)
premium딥 다크, 고급스러운 #A855F7 (바이올렛)
toss핀테크 스타일 #3182F6 (토스 블루)
magazineSNS 매거진 느낌 #3B82F6 (블루)
blueprint프레젠테이션 스타일 #7BA7CC (소프트 블루)

14가지 슬라이드 타입

각 카드뉴스는 14가지 슬라이드 타입을 조합하여 구성됩니다:

타입 용도
cover표지 (헤드라인, 서브텍스트, 라벨)
content기본 헤드라인 + 본문
content-badge카테고리 태그 표시
content-stat숫자 강조
content-quote인용문
content-steps3단계 프로세스
content-list최대 5개 항목 리스트
content-split좌우 비교
content-highlight핵심 강조 박스
content-grid2x2 그리드
content-bigdata대형 숫자 표시
cta행동 유도 (항상 마지막)

설정 커스터마이징

config.json으로 기본값을 변경할 수 있습니다:

{
  "defaults": {
    "template": "clean",
    "accent_color": "#8BC34A",
    "account_name": "my_account",
    "slide_count": 7
  }
}

설정 가능한 파라미터:

  • template: 8가지 스타일 중 택 1 (기본: clean)
  • accent_color: Hex 컬러 코드 (기본: #8BC34A)
  • account_name: 인스타그램 핸들 (기본: my_account)
  • slide_count: 5~12장 (기본: 7)
  • tone: professional / casual / energetic

수동 렌더링

파이프라인 없이 JSON 데이터에서 직접 이미지를 생성할 수도 있습니다:

# 슬라이드 JSON에서 PNG 렌더링
node scripts/render.js \
  --slides workspace/slides.json \
  --style clean \
  --output output/ \
  --accent "#8BC34A" \
  --account "my_account"

# 전체 슬라이드 타입 샘플 생성
node scripts/generate-samples.js

텍스트 하이라이트

슬라이드 JSON에서 highlight 클래스를 사용하면 특정 텍스트를 강조할 수 있습니다:

{
  "headline": "2025 <span class="highlight">디지털 마케팅</span> 트렌드"
}

핵심 정리

  • Claude Code에서 한 줄 입력으로 인스타그램 카드뉴스 자동 생성
  • 리서치 → 팩트체크 → 카피라이팅 → 렌더링 → 검수 6단계 파이프라인 자동 실행
  • 8가지 템플릿 (clean, minimal, bold, elegant, premium, toss, magazine, blueprint)
  • 14가지 슬라이드 타입 조합으로 다양한 구성
  • 출력: 1080x1350px PNG (인스타그램 피드 최적 규격)
  • Puppeteer 기반 HTML→PNG 변환, Node.js 런타임
  • 스킬 설치로 빈 폴더에서도 즉시 시작 가능

참조 링크

조회 통계 (최근 30일)
PV 41UV 41
댓글 0