doc-figurelisted
Install: claude install-skill parkjui92/doc-figure
# doc-figure — 문서 삽도 만들기
문서에 넣을 **도식**을 스타일이 고정된 그림으로 만든다. 한글 라벨·수치·격자 정렬은 전부 코드가 그리므로 글자가 깨질 수 없다.
## 산출 3경로
| 경로 | 언제 | 설치 | 산출 |
|---|---|---|---|
| **기본** | 대부분 | 없음 | 자기완결 HTML → 브라우저로 열어 인쇄·캡처 |
| **정밀** | 여러 장을 반복해 뽑을 때 | 크롬 + 파이썬 | PNG 자동 + 텍스트 검증 |
| **자유형** | 도식이 아닌 삽화가 필요할 때 | 없음 | 이미지 모델용 프롬프트 규격문 |
**기본 경로를 먼저 쓴다.** 정밀 경로는 크롬이 있고 여러 장을 자동으로 뽑을 때만 쓴다.
## 진입 2경로
### 경로 1 — 문서를 받았을 때
1. 본문을 읽고 **삽도 후보표**를 만든다. 각 후보에 위치·유형·템플릿·근거를 적는다.
| # | 들어갈 위치 | 무엇을 보이나 | 템플릿 | 왜 필요한가 |
|---|---|---|---|---|
| 1 | Ⅱ장 추진체계 | 총괄–부문–자문 관계 | `org-chart` | 서술만으로는 책임 소재가 안 보임 |
2. **사용자 승인을 받는다.** 승인된 것만 그린다. 문서에 있지도 않은 내용을 그림으로 지어내지 않는다.
3. 승인분마다 spec을 쓰고 렌더한다.
### 경로 2 — 말로 지시받았을 때
"추진체계도 그려줘, 총괄은 A, 부문은 B·C·D" → 템플릿 고르고 spec 쓰고 바로 1장. 승인 게이트 없이 진행한다.
정보가 모자라면 **비워두지 말고 물어본다.** 도식은 빈칸이 그대로 드러난다.
## 기본 경로 — HTML 만들기 (설치 0)
템플릿은 마커 3개를 치환하면 그대로 완성된 HTML이 된다.
1. `templates/<템플릿>.html` 을 읽는다
2. `presets/<프리셋>.css` 를 읽는다 (기본 `gov-navy`)
3. 세 곳을 치환한다
- `/*__STYLE_TOKENS__*/` → 프리셋 CSS 전문
- `/*__FIGURE_DATA__*/ null` → spec JSON 전문
- `/*__ICONS__*/ {}` → **그대로 둔다** (아이콘 미탑재)
4. `그림_NN_<이름>.html` 로 저장하고, 브라우저로 열어 인쇄(PDF)하거나 캡처하라고 안내한다
spec JSON도 `그림_NN_<이름>.json` 으로 **반드시 함께 남긴다.** "부문 하나 추가"가 재작성이 아니라 한 줄 수정이 되는 이유다.
## 정밀 경로 — PNG 자동 생성 (선택)
```bash
python3 scripts/render_figure.py <spec.json> -o <out.png> --verify
python3 scripts/render_figure.py <spec.json> --preset mono-formal -o <out.png>
python3 scripts/render_figure.py --list # 템플릿·프리셋 목록