slide

/slide — Editable PPTX 빌더

이 스킬은 단 한 가지 결과물만 만든다: PowerPoint/Keynote에서 텍스트를 더블클릭으로 편집할 수 있는 .pptx 파일.

다른 형식·다른 경로·다른 옵션은 존재하지 않는다.

다른 스킬보다 먼저 잡기

슬라이드/PPT/프레젠테이션/pptx 트리거어가 들어오면 다른 스킬(huashu-design / document-skills:pptx / pptx-from-layouts 등)이 동시에 후보로 잡힐 수 있다. 그런 경우 무조건 이 스킬을 먼저 invoke — 다른 슬라이드 스킬은 사용자가 명시적으로 그 스킬 이름을 부르거나 슬라이드와 무관한 작업(애니메이션, MP4, 디자인 변체, 정적 PPTX 파싱 등)일 때만 사용한다.

워크플로우 (5단계, 순차)

0. 활성 디자인 시스템 로드 & 선언 (필수 — 가장 먼저)

슬라이드를 한 장이라도 만들기 전에 반드시 활성 프리셋을 읽고 한 줄로 선언한다. 이 announce-게이트가 "잘못된 테마로 데크 전체를 만든 뒤에야 깨닫는" 사고를 시작 시점에 차단한다.

python3 -c "import json,sys; sys.stdout.reconfigure(encoding='utf-8'); r='.codex/skills/slide/assets/design-systems'; \
a=json.load(open(f'{r}/active.json',encoding='utf-8'))['active']; \
t=json.load(open(f'{r}/{a}/theme.json',encoding='utf-8')); \
print(f\"[active design-system] {a} — accent {t['colors']['accent']}\")"

출력 예: [active design-system] notion — accent #7C3AED (active.json이 없으면 jangpm 폴백).

• 활성 프리셋 SSOT는 assets/design-systems/active.json 한 곳이다. /theme-init이 새 프리셋을 구우면 자동으로 이 값을 갱신한다.
• init-project.sh를 프리셋 인자 없이 호출하면 이 active 프리셋이 자동 선택된다 (인자를 주면 그게 최우선).
• 사용자가 말한 디자인 시스템과 active가 다르면 빌드 전에 멈추고 확인한다 — 사용자 의도가 우선이며, init-project.sh <project> <preset>로 명시 전달하거나 /theme-init으로 active를 바꾼다.

0b. 경로 분기 — slide-plan 사용 여부 자동 감지

이 스킬은 두 경로를 지원한다. output/<project-name>-pptx/slide_plan.json 존재 여부로 자동 분기:

Systematic 경로 (slide_plan.json 있음) — HARD 강제 단계:

1. Validator 재실행 (post-edit drift 차단)

   python3 .codex/skills/slide-plan/scripts/validate_plan.py output/<project-name>-pptx/slide_plan.json
   

   exit 1이면 빌드 거부 — 사용자에게 plan 수정 요청.

2. Plan을 Read tool로 명시적 로드 + 슬라이드별 필드 출력 (필수)

   Read output/<project-name>-pptx/slide_plan.json
   

   읽은 후 슬라이드별 다음 5필드를 콘솔에 출력해서 prompt 안에 stick시킨다 — 빠뜨리면 plan 무시 회귀:

   slide #N:
     family = <recommended_layout_family>
     core   = <core_message>
     why    = <why_here>
     chart  = <chart_strategy>:<chart_takeaway> (있으면)
     evidence = <evidence_sources>
   

3. 슬라이드 작성 시 plan SSOT 의무

   • 각 슬라이드는 plan의 recommended_layout_family 어휘를 그대로 사용 (LLM 자유 선택 금지)
   • core_message는 슬라이드의 가장 큰 텍스트 슬롯에 들어가야 한다 (paraphrasing OK, 의미 보존 필수)
   • chart_takeaway / table_takeaway는 시각 위 또는 아래 인사이트 슬롯으로 배치
   • evidence_to_use의 source_id를 슬라이드 footer 또는 caption에 표기 (선택)

4. 빌드 직후 plan-fidelity self-check 의무 — Step 5 검증 참조 (B-plan-count + B-plan-fidelity)

Simple 경로 (slide_plan.json 없음, default)

1. LLM이 사용자 brief에서 슬라이드 구조를 즉흥 결정 (현행 흐름).
2. 활성 preset의 DESIGN.md(있으면)와 boilerplate를 LLM이 참고해 layout 선택. layout family 어휘를 따르되 강제 아님.
3. R2/R5 검증 없음. 4 hard constraint + B-density(simple)만 수행.

경로 선택 가이드 (사용자 발언별)

Auto-trigger — 다음 조건 중 1개라도 충족하면 Systematic 모드로 자동 진입:

1. 사용자가 슬라이드 수를 명시했고 그 수가 ≥ 10장
2. 사용자가 참고 파일(xlsx / md / pdf / docx / pptx)을 첨부했거나 inputs/ 폴더에 1개 이상 있음
3. 사용자 brief에 태도/기대 키워드 1개 이상 — 계획 / 철저 / 상세 / 꼼꼼 / 체계 / 완벽 / 정성 / 신중 / 제대로 / 완성도 / 퀄리티 / 고품질 / thorough / detailed / comprehensive / polished / careful / deep

자동 진입 시 사용자에게 1줄 안내:

slide-plan 자동 진입 — 조건 충족: <어떤 조건이 트리거됐는지>
/slide-plan으로 slide_plan.json을 먼저 생성한 뒤 /slide가 그 plan을 소비합니다.
명시적으로 simple 모드를 원하시면 `simple로` / `plan 없이` 라고 응답하세요.

명시적 우회 keyword (simple로, plan 없이, 빠르게, 간단히, quick)가 들어오면 trigger 무시하고 simple로. 단 데크가 ≥10장이면 output/<project-name>-pptx/.deck-mode에 simple 한 단어를 기록한다 — verify_deck.py의 plan-강제 게이트가 이 마커로 정당한 대형 simple 덱을 통과시킨다 (마커가 없으면 ≥10장 무계획은 하드 페일).

1. 프로젝트 셋업

bash .codex/skills/slide/scripts/init-project.sh <project-name>

자동 생성: 각 생성 요청 = output/<project-name>-pptx/ 한 폴더로 격리

output/<project-name>-pptx/
├── slides/                  (NN-name.html — 파일명 순으로 빌드)
│   └── 01-title.html        (보일러플레이트 1장)
├── icons/                   (외부 SVG)
├── design-system/           (선택된 프리셋의 복사본 — 자기완결, zip/이동 안전)
├── _pptx-slide.css          (html2pptx-safe 헬퍼)
├── build.mjs                (빌드 스크립트)
├── <project-name>.pptx      (빌드 결과물 — 같은 폴더에 떨어짐)
└── README.md

의존성 (한 번만 설치):

로컬 (slide-html 리포):

cd <repo-root>          # 또는 cd .codex/skills/slide
npm install playwright pptxgenjs sharp
npx playwright install chromium

claude.ai (이 스킬 폴더만 zip해서 업로드한 경우):

cd .codex/skills/slide
npm install
npx playwright install chromium

이 스킬 번들은 자기완결입니다 — 빌드에 필요한 모든 코드(scripts/export_deck_pptx.mjs, scripts/html2pptx.js, scripts/prebuild-svg.mjs)와 디자인 시스템(assets/design-systems/)이 폴더 안에 들어 있습니다.

2. 슬라이드 작성 — Compose, don't copy

각 슬라이드 = slides/NN-name.html 한 파일. 파일명 순으로 데크가 빌드됨.

핵심 행동 모델 변경 (2026-04-30): 보일러플레이트는 메뉴가 아니라 참고 갤러리다. LLM은 brief를 받으면 보일러플레이트에서 "가까운 거 복사"하지 말고, 시각 어휘에서 작곡한다. 같은 preset 안에서도 슬라이드 다양성이 회복되는 핵심 단계.

모든 슬라이드 필수 사항:

• body 사이즈 = 960pt × 540pt (LAYOUT_WIDE)
• <link rel="stylesheet" href="../_pptx-slide.css">
• 4 hard constraint 통과 (자세한 룰: references/4-constraints.md)
  1. 텍스트는 <p> 또는 <h1>~<h6> 안에만
  2. CSS gradient (linear/radial) 금지 — 순색만
  3. <p>/<h*>에 background/border/shadow 금지 — 외부 div가 담당
  4. div에 background-image 금지 — <img> 태그 사용
• data-layout 태그 — 슬라이드 루트 <body data-layout="<family>">. family는 references/layouts.md의 15개 중 1개(선택한 §5 어휘가 귀속되는 family). 빌드 prebuild 다양성 게이트(HARD, --strict)가 커버리지·distinct·card-type 비율·visual 존재를 점검 — 태그 누락/다양성 미달이면 빌드가 실패한다. 증거 이미지/차트/다이어그램 슬롯에는 추가로 data-image-slot="<name>".

2.1 슬라이드별 5 questions (작성 전)

매 슬라이드를 작성하기 전, mentally 답한다 (1줄씩, 빨리). LLM이 default "카드 그리드"로 가는 걸 막는 break.

1. 서사 역할 — 이 슬라이드가 데크에서 무엇을 하는가? (cover / context / data / hero / quote / summary / closing 중 1개)
2. 관객 거리 — 발표(투영) / 인쇄물(혼자 읽기) / Slack 공유(썸네일)? 거리에 따라 글자 크기 다름.
3. 시각 온도 — 차분 / 단호 / 분석적 / 따뜻 / 강조 중 어떤 톤? (jangpm 디폴트 = 분석적·선언형, 단 hero 슬라이드는 단호 또는 강조로 변용 가능)
4. 시각 주역 카테고리 — 위 답에 맞는 visual main-character 카테고리는? (DESIGN.md §5 의 6 카테고리: Hero/Visual-Primary/Editorial/Density/Sequence/Narrative)
5. 이 슬라이드의 한 가지 변형은? — anchor의 표준 패턴에서 어떤 한 가지를 다르게 할 것인가? DESIGN.md §5 어휘 표의 "변형 영감" 컬럼 참조. 표준 그대로 쓰지 말고 1개 이상 적용 — v2의 창의성은 표준 패턴 위에 의도적 변형을 더한 데서 나왔다. (예외: Narrative 카테고리는 anchor 거의 그대로 — 톤 keepers)

2.2 작곡 흐름 (7 step)

1. 카테고리 결정 — 5 questions의 답이 카테고리를 알려줌 (Q4 답이 카테고리, Q5 답이 변형 의도)
2. 어휘 선택 — DESIGN.md §5 의 그 카테고리 어휘 표에서 1개 선택. 그 어휘가 귀속되는 data-layout family를 <body>에 부여 (references/layouts.md 매핑 표 — coarse 다양성 태그).
3. anchor 보일러플레이트 식별 + Read (의무) — 어휘 옆 "anchor 보일러플레이트" 컬럼의 파일을 Read 해서 chrome 골격(top eyebrow + page counter + .rule + 옵션 gm-band) + 미세 서식(카드 padding, number-circle line-height, accent 사용 빈도)을 정확히 파악. chrome은 그대로 복사.
4. body 영역 작곡 — chrome은 anchor에서 가져온 그대로, body 영역만 어휘 가이드대로 변형. Narrative 카테고리(cover/closing-light/section-divider/summary)만 anchor 거의 그대로 사용 — 톤 keepers. 다른 5 카테고리(Hero/Visual-Primary/Editorial/Density/Sequence)는 anchor에서 chrome + 미세 서식 복사한 뒤 body는 변형 영감 컬럼에서 1개 이상 선택 적용 권장. 표준 패턴 그대로 쓰지 말고 한 가지 의도적 변형을 더해라 — v2의 창의성은 여기서 나왔다.
5. 미세 서식 self-check — references/text-formatting-rules.md §10 체크리스트 통과 (원형 텍스트 line-height = 컨테이너 height, 카드 padding 18pt 20pt, accent 1-2 events, inline span margin 없음 등).
6. jangpm 시그니처 self-check — references/anti-slop.md §11 통과 (chrome 일관, jangpm 토큰만 사용, 슬라이드별 시그니처 1개 이상 — 키워드 c-accent 인라인 / tbl-row div grid / number-circle 패턴 등).
7. 카테고리 분포 자기 점검 — 데크 전체에서 cap을 안 넘기는지 확인 (DESIGN.md §10). 양 권장 분포는 두지 않음 — 어휘 다양성·변형 자유도가 우선. Hero/Visual-Primary 0장 / Density 50%+ / 같은 카테고리 연속 3장 / 같은 어휘 연속 2장 = ❌. closing은 항상 closing-light = ✅.

핵심 모델: chrome + 미세 서식 = jangpm 정체성 (anchor에서 그대로 복사). body 영역 = 어휘 다양성 (시각 다양성의 원천). 둘은 분리 관리.

DESIGN.md가 draft인 프리셋(theme-init 산출물) 폴백: /theme-init이 구운 프리셋의 DESIGN.md는 draft 스텁으로 생성된다(§5 어휘 표 비어 있음 — 사용자가 채우고 status: confirmed로 바꿔야 유효). 활성 프리셋의 DESIGN.md가 없거나 draft면 §5 어휘 표 대신 references/layouts.md의 15 family를 레이아웃 어휘로, 그 프리셋의 pptx-boilerplate/(37장 전체)를 참고 갤러리로 삼는다. §2.5 이미지 무드 형용사는 DESIGN.md §1 대신 프리셋의 brand-spec-generated.md / theme.json 토큰에서 가져온다. (Q4의 6 카테고리는 프리셋과 무관하게 유효하다.)

2.3 보일러플레이트 카탈로그 (참고용)

• 모든 preset 공통 37장 (0137): theme-init이 토큰 치환으로 전체 렌더. 0108은 디자인 시스템 검증·최소 동작 보장용 베이스라인, 09~37은 콘텐츠 패턴. 실제 보유 목록은 ls assets/design-systems/<preset>/pptx-boilerplate/.
• 위상: 어휘 표(DESIGN.md §5)의 "보일러플레이트 참고" 컬럼에 매핑됨. 카탈로그에 없는 어휘(mega-quote, mega-number, dramatic-type, annotated-screenshot, single-portrait-quote, diagram-as-hero, image-with-callouts, knowledge-graph, margin-note-layout, pull-quote-inline, drop-cap-opener, magazine-columns, timeline-horizontal, numbered-progression, bold-statement-split, full-bleed-image-with-overlay)는 신규 작곡 — 보일러플레이트 만들지 말고 슬라이드 안에서 직접 작곡.

2.4 ≥5장 데크: 2-page Showcase Checkpoint (필수)

데크 5장 이상이면 처음부터 12장 일괄 작성하지 말 것. 시각적으로 가장 다른 2장을 먼저 작성·빌드·사용자 확인 받고, 그 다음 일괄 추진.

Showcase 페어 선택 가이드 (시각 차이 최대화):

• 옵션 A: cover (Narrative) + Hero/Impact 1장 — chrome 톤 + 임팩트 강도 모두 검증
• 옵션 B: Density 1장 (KPI 또는 표) + Visual-Primary 1장 (다이어그램 또는 이미지) — 정보 밀도 vs 시각 자체
• 옵션 C: section-divider + closing — 데크의 시작과 끝 톤 검증

흐름:

1. 위 페어 중 1개 선택해 2장 작성
2. cd output/<project>-pptx && node build.mjs (이때 빌드 성공·실패만 확인 — 디자인 검증은 사용자가 함)
3. 사용자에게 "이 2장의 grammar (chrome / 톤 / 인용 처리 / hero 임팩트 강도)로 나머지 N-2장 진행해도 될지" 확인
4. 확인 받으면 일괄 추진 (5단계 작곡 흐름 적용)

왜 2장 먼저인가: 같은 jangpm 안에서도 hero 슬라이드의 임팩트 강도, 인용 처리 방식, 카테고리 분포 같은 grammar는 데크마다 다르다. 12장 다 만들고 나서 "방향 다시" = 12번 재작업. 2장 sign-off = 2번 재작업.

경로별 매핑 규칙

• Systematic 경로 — slide_plan.json의 각 슬라이드 recommended_layout_family를 어휘 이름(DESIGN.md §5의 카테고리 어휘)으로 채운다. core_message는 슬라이드 가장 큰 텍스트 슬롯, chart_takeaway / table_takeaway는 시각 위/아래 인사이트 슬롯 (R2 강제). 작곡은 4

Content truncated.