name

lecture-deck

description

HTML 강의안·교안 슬라이드(16:9)를 보고서·교안 스타일로 생성한다. 편집·PDF 저장·전체화면 발표 도구가 내장된 단일 HTML 파일을 만든다. "강의안", "강의 슬라이드", "교안", "발표자료(교육용)", "lecture deck", "슬라이드 만들어줘", "~로 강의안/교안 써줘" 요청에 사용. 크림 배경·다크 마스트헤드·러스트 액센트, 원문 최대 보존, 선언적·시적 문장과 슬로건 금지, 합니다체 본문, 비개발자 눈높이 설명이 특징. 표지 제목은 사용자에게 반드시 확인한다. 단순 PPT 변환·데이터 차트 생성에는 쓰지 않는다.

Lecture Deck — 강의안 생성

16:9 HTML 강의안을 보고서식 교안 스타일로 만든다. 결과물은 편집·PDF·발표 도구가 내장된 단일 HTML이다.

워크플로

요건 파악 — 주제·대상(특히 비개발자 여부)·시간/분량·강조점·기관/강사명을 확인한다. 표지 제목은 반드시 사용자에게 물어 확정한다. 원본 파일에 제목이 있더라도 표지에 넣을 최종 제목은 사용자 확인 전에는 임의로 만들지 않는다. 모르면 핵심만 1~2개 질문하되, 표지 제목 질문을 우선한다.
개요 설계 — 표준 구성(아래)을 바탕으로 슬라이드 목록을 잡는다. 1슬라이드 = 의미 단위 1개.
템플릿 복제 — assets/deck-template.html을 결과 경로로 복사한다. CSS·도구 스크립트는 수정하지 않는다. <section class="slide">만 주제에 맞게 채우고 불필요한 예시는 지운다.
본문 작성 — references/writing-style.md의 규칙을 반드시 지킨다(원문 최대 보존, 선언적·시적 문장 금지, 합니다체, 비유·슬로건·메타 금지, 비개발자 눈높이). 원문 기반 강의안은 제목·항목명·문장을 가능한 한 유지하고, 배치와 밀도만 교안형으로 정리한다. 레이아웃은 references/layout-primitives.md 참조.
자가검증 — python scripts/render_check.py <결과.html> --pdf 실행.
- ISSUES가 비고 JS ERRORS가 없어야 한다(넘침·박스 이탈 0).
- PDF는 16:9 가로 페이지로 슬라이드 1장=1페이지여야 한다.
- 렌더된 PNG를 반드시 육안 확인한다 — 휑한 곳(빈 밴드), 어색한 문체, 잘림. 스크립트만 믿지 말 것.
수정 반복 — 휑하면 내용/도식을 더하고(빈 박스로 때우지 말 것), 넘치면 글을 줄인다. 통과까지 반복.

표준 구성 (분량에 맞게 가감)

표지(다크) → 커리큘럼 표 → [이론] 정의/배경 → [이론] 핵심 구분 → [이론] 구조/도식 → [이론] 구성요소(표) → [개념] 항목 정의 → [사례] 도식 → [관점] 2열 비교 → [실습] 단계+릴레이 → [적용] 영역 카드 → 강의 요약(다크).

핵심 규칙 (요약 — 상세는 references)

표지 제목: 사용자에게 반드시 물어 확정한다. 사용자 확인 없이 임의의 표지 제목을 만들지 않는다.
원문 보존: 원본 슬라이드·문서가 있으면 제목·항목명·문장을 최대한 그대로 유지한다. 새 멘트나 새 메시지를 덧붙이지 않는다.
제목: [구분] 주제 — 기능적 부제. 비유·수사·슬로건·블로그체·선언적/시적 문장 금지. ("강의 요약"이지 "오늘 우리가 함께 본 것"이 아니다.)
본문: 합니다체 설명문 + 번호 개념 정의 + 도식. 불릿 박스 그리드 금지.
비개발자: 전문어 풀어 쓰고 "예 —" 한 줄로 구체화. 개발 용어(PR·머지·린터·CI) 금지 → 평이한 말.
메타 문장 금지(강사/수강생/제작 시점). 폰트는 템플릿 크기 유지(작게 줄이지 말 것).
밀도: 실제 내용·도식으로 채운다. 가로 스트립은 둘째 행(릴레이 등)으로 채운다. 박스 안 텍스트가 적으면 새 문장을 만들지 말고 기존 텍스트의 폰트 크기·여백·정렬을 조정해 채운다.

내장 도구 (편집 · PDF · 발표)

템플릿에 이미 들어 있다(우상단 버튼, 인쇄·발표 시 자동 숨김). 손대지 말고 그대로 둔다.

편집: 버튼 토글 → 슬라이드 텍스트를 브라우저에서 바로 수정. 저장(HTML) 버튼으로 수정본을 단일 HTML로 내려받는다(다시 열어 재편집 가능).
PDF: 버튼 → 브라우저 인쇄 → "PDF로 저장". @page가 1280×720(16:9)로 고정돼 슬라이드 1장=1페이지로 정확히 출력된다(배경색 포함). 인쇄 대화상자에서 여백은 "기본/없음", 배경 그래픽 켜기.
발표: 버튼 또는 진입 후 ← →(또는 클릭/Space) 로 한 장씩, Esc 로 종료. 화면 크기에 맞춰 자동 확대.

PDF가 세로로 잘리면 @page가 @media print 안에 중첩됐는지 확인한다 — 반드시 top-level에 둬야 크롬 인쇄 UI가 인식한다.

자료 파일

assets/deck-template.html — 전체 디자인 시스템 CSS + 모든 레이아웃 예시 슬라이드 + 편집/PDF/발표 도구(복제해서 채운다).
references/writing-style.md — 문체·제목·비개발자 표현 규칙(반려 사례 포함).
references/layout-primitives.md — 슬라이드 골격, 부품별 클래스와 용도, 밀도 규칙.
scripts/render_check.py — 렌더 + 넘침/이탈 검사 + PDF 확인.

Lecture Deck — 강의안 생성

16:9 HTML 강의안을 보고서식 교안 스타일로 만든다. 결과물은 편집·PDF·발표 도구가 내장된 단일 HTML이다.

워크플로

요건 파악 — 주제·대상(특히 비개발자 여부)·시간/분량·강조점·기관/강사명을 확인한다. 표지 제목은 반드시 사용자에게 물어 확정한다. 원본 파일에 제목이 있더라도 표지에 넣을 최종 제목은 사용자 확인 전에는 임의로 만들지 않는다. 모르면 핵심만 1~2개 질문하되, 표지 제목 질문을 우선한다.

개요 설계 — 표준 구성(아래)을 바탕으로 슬라이드 목록을 잡는다. 1슬라이드 = 의미 단위 1개.

템플릿 복제 — assets/deck-template.html을 결과 경로로 복사한다. CSS·도구 스크립트는 수정하지 않는다. <section class="slide">만 주제에 맞게 채우고 불필요한 예시는 지운다.

본문 작성 — references/writing-style.md의 규칙을 반드시 지킨다(원문 최대 보존, 선언적·시적 문장 금지, 합니다체, 비유·슬로건·메타 금지, 비개발자 눈높이). 원문 기반 강의안은 제목·항목명·문장을 가능한 한 유지하고, 배치와 밀도만 교안형으로 정리한다. 레이아웃은 references/layout-primitives.md 참조.

자가검증 — python scripts/render_check.py <결과.html> --pdf 실행.

ISSUES가 비고 JS ERRORS가 없어야 한다(넘침·박스 이탈 0).
PDF는 16:9 가로 페이지로 슬라이드 1장=1페이지여야 한다.
렌더된 PNG를 반드시 육안 확인한다 — 휑한 곳(빈 밴드), 어색한 문체, 잘림. 스크립트만 믿지 말 것.

수정 반복 — 휑하면 내용/도식을 더하고(빈 박스로 때우지 말 것), 넘치면 글을 줄인다. 통과까지 반복.

표준 구성 (분량에 맞게 가감)

핵심 규칙 (요약 — 상세는 references)

표지 제목: 사용자에게 반드시 물어 확정한다. 사용자 확인 없이 임의의 표지 제목을 만들지 않는다.

원문 보존: 원본 슬라이드·문서가 있으면 제목·항목명·문장을 최대한 그대로 유지한다. 새 멘트나 새 메시지를 덧붙이지 않는다.

제목: [구분] 주제 — 기능적 부제. 비유·수사·슬로건·블로그체·선언적/시적 문장 금지. ("강의 요약"이지 "오늘 우리가 함께 본 것"이 아니다.)

본문: 합니다체 설명문 + 번호 개념 정의 + 도식. 불릿 박스 그리드 금지.

비개발자: 전문어 풀어 쓰고 "예 —" 한 줄로 구체화. 개발 용어(PR·머지·린터·CI) 금지 → 평이한 말.

메타 문장 금지(강사/수강생/제작 시점). 폰트는 템플릿 크기 유지(작게 줄이지 말 것).

밀도: 실제 내용·도식으로 채운다. 가로 스트립은 둘째 행(릴레이 등)으로 채운다. 박스 안 텍스트가 적으면 새 문장을 만들지 말고 기존 텍스트의 폰트 크기·여백·정렬을 조정해 채운다.

내장 도구 (편집 · PDF · 발표)

템플릿에 이미 들어 있다(우상단 버튼, 인쇄·발표 시 자동 숨김). 손대지 말고 그대로 둔다.

편집: 버튼 토글 → 슬라이드 텍스트를 브라우저에서 바로 수정. 저장(HTML) 버튼으로 수정본을 단일 HTML로 내려받는다(다시 열어 재편집 가능).

PDF: 버튼 → 브라우저 인쇄 → "PDF로 저장". @page가 1280×720(16:9)로 고정돼 슬라이드 1장=1페이지로 정확히 출력된다(배경색 포함). 인쇄 대화상자에서 여백은 "기본/없음", 배경 그래픽 켜기.

발표: 버튼 또는 진입 후 ← →(또는 클릭/Space) 로 한 장씩, Esc 로 종료. 화면 크기에 맞춰 자동 확대.

PDF가 세로로 잘리면 @page가 @media print 안에 중첩됐는지 확인한다 — 반드시 top-level에 둬야 크롬 인쇄 UI가 인식한다.

자료 파일

assets/deck-template.html — 전체 디자인 시스템 CSS + 모든 레이아웃 예시 슬라이드 + 편집/PDF/발표 도구(복제해서 채운다).

references/writing-style.md — 문체·제목·비개발자 표현 규칙(반려 사례 포함).

references/layout-primitives.md — 슬라이드 골격, 부품별 클래스와 용도, 밀도 규칙.

scripts/render_check.py — 렌더 + 넘침/이탈 검사 + PDF 확인.