Community라이팅 & 에디팅github.com

RinDig/lecture-deck

스토리보드로부터 고품질 애니메이션 HTML 강의 또는 워크숍 데크를 모든 테마로 제작합니다. 생중계(대면 또는 Zoom) 강연, 세션 데크, 워크숍 슬라이드, 발표자 노트 등에 사용하세요. 하나의 독립형 HTML 파일과 키보드 탐색, 발표자 노트, 개요, 인쇄, 클립보드 복사 프롬프트 및 모드 스트립을 제공하며, PNG 렌더링으로 확인도 가능합니다. PowerPoint가 필요한 피치 데크나 데이터 대시보드에는 적합하지 않습니다.

lecture-deck란 무엇인가요?

RinDig/lecture-deck은 발표자가 라이브 강연이나 워크숍에서 사용할 고품질 애니메이션 HTML 슬라이드 데크를 구축하기 위한 AI 에이전트 스킬입니다. 이 스킬은 Claude Code, Cursor, Codex 등 다양한 AI 에이전트 플랫폼에서 사용할 수 있으며, Python 기반의 스크린 모듈을 테마에 맞게 조합하여 하나의 자체 포함 HTML 파일을 생성합니다. 키보드 탐색, 발표자 노트, 개요 보기, 인쇄, 클립보드 복사, 모드 스트립(슬라이드, 공유, 브레이크아웃, 솔로, 핸드오프, 쉬는 시간) 등 강의 진행에 필요한 모든 기능을 내장하고 있으며, 각 화면을 PNG로 렌더링하여 레이아웃과 가독성을 확인할 수 있습니다. 또한 등록 검사(register check)를 통해 모든 화면의 텍스트가 일관된 어조와 스타일을 유지하도록 돕습니다. 특히 세 가지 기본 테마와 다이어그램, 애니메이션, 반복 등장하는 캐릭터(figure), 시스템(machine), 박스(rigid)를 위한 키트를 제공하여 강의 내용을 명확히 전달하는 시각 자료를 손쉽게 만들 수 있습니다.

지원 대상~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/RinDig/lecture-deck-skill/tree/main

Installed? Explore more 라이팅 & 에디팅 skills: steipete/notion, langchain-ai/langchain, bytedance/podcast-generation · View all 6 →

즐겨 사용하는 AI에게 물어보기

이 에이전트 스킬이 미리 로드된 새 채팅을 엽니다.

문서

강의 데크

화면 하나당 하나의 주장, 메커니즘을 보여주는 그림 하나, 캡션 하나, 나머지는 모두 노트에. 데크는 테마에 맞춰 Python 화면 모듈로 구축되며, 확인을 위해 PNG로 렌더링되고, 최종 출력 전에 등록 검사를 통과합니다.

요청을 받았을 때

  1. 강연 환경을 묻거나 추론하세요: 누가, 몇 명, 어디서, 얼마나 오래, 이미 아는 것은 무엇인지, 누가 발표하고 누가 진행을 맡는지. 진행표(run of show)가 있다면 이를 기준으로 삼으세요.
  2. 먼저 reference/storyboard-template.md를 사용하여 storyboard.md를 작성하세요. 목표, 주장을 번호가 매겨진 논점으로, 진행표와 모드, 그리고 각 화면에 대한 그림과 연결 문장(bridge)을 포함하세요. 헤더만 읽어 논점의 흐름을 확인하고, 연결 문장만 읽어 매끄러운지 확인하세요. 여기서 순서를 고치세요.
  3. 10화면이 넘는 경우, 스토리보드를 구축하기 전에 비평하세요(흐름, 청중 수준, 각 그림이 주장을 설명하는지, 요약이 요구 사항을 충족하는지). 수정 사항을 반영하세요.
  4. 화면을 구성하고 구축하세요(reference/workflow.md, reference/kit-api.md). 긴 데크는 여러 모듈로 나누어 병렬로 구축하세요.
  5. 모든 화면을 렌더링하고 모든 연속 사진을 살펴보세요. 넘침, 잘림, 읽을 수 없는 텍스트, 설명 대신 장식만 하는 그림을 수정하세요.
  6. --dump 플래그로 등록 검사를 실행하고 텍스트를 평문으로 읽으세요. 수정하고, 변경된 부분을 다시 렌더링하고, 깨끗해질 때까지 반복하세요.
  7. HTML을 전달하고, 자리 표시자(날짜, 이름, 아직 준비되지 않은 플랫폼)를 명시하며, 발표 방법(화살표, N, O, B, F, Print)을 설명하세요.

좋은 데크를 만드는 규칙

  • 한 화면당 하나의 주장 규칙. 헤더는 주장입니다. 그림 하나. 최대 캡션 하나. 각주는 확인된 인용문에만 사용하세요. 단서는 연습 및 진행 화면에만. 심화 내용은 말 그대로 SAY 및 IF THE ROOM IS AHEAD 섹션에 넣으세요.
  • 그림은 메커니즘을 보여줍니다. 어떤 헤더 아래에나 들어갈 수 있는 그림은 장식입니다. 실제 대상을 그리세요: 채팅, 파일, 폴더, 구부리는 사람, 채워지는 쓰레기통. 발표자가 말할 순서대로 anim, draw, grow, rise, slide_in, drop을 사용하여 구성하세요. 설명이 된다면 복잡해도 괜찮습니다.
  • 단일 캐스트. 모든 사람, 시스템, 고정된 상자에 대해 figure, machine, rigid를 사용하여 청중이 데크 전체에서 동일한 그림을 보게 하세요.
  • 색상이 아닌 역할. HIGHLIGHT는 주제이자 현재; COOL은 시스템; WARM은 쓰여진 것; SOFT는 상대방; NEUTRAL은 빈 공간; LIVE는 모드 점에만 사용합니다. 그러면 모든 테마가 작동합니다.
  • 모드 스트립. 모든 화면은 mode(kind, label, who)로 시작합니다: slides, share, breakout, solo, handoff, break. 청중은 항상 누가 화면을 보고 있는지 알 수 있고, 발표자는 항상 앱을 전환하거나 인계할 때를 알 수 있습니다. 진행표 막대도 동일한 색상을 사용합니다.
  • 등록. 주장으로 시작하고, 완전한 문장을 사용하며, 설명 위주로 작성하고 연기하지 마세요. 드러내는 줄(reveal lines), 데크당 하나를 넘는 "X가 아니라 Y" 형식, 요점을 강조하는 단편, 강제적 삼항법, 대시, 인공지능 표준 단어, 청중 화면에 방법론 용어는 사용하지 마세요. 확인된 인용문만. 예제는 청중 세그먼트당 하나씩, 매번 동일한 순서로. 자세한 내용은 reference/writing.md를 참조하세요.
  • 노트가 곧 강의입니다. SAY는 발표자의 목소리로, DO NOW는 진행자를 위한 시간과 함께, LOOK FOR, IF STUCK, IF THE ROOM IS AHEAD, 그리고 다음 헤더로 이어지는 BRIDGE를 포함하세요.
  • 실제 크기로 확인하세요. 렌더러의 정적 모드는 모든 애니메이션 요소를 최종 상태로 보여줍니다. 브라우저 창에서 보이지 않는 결함이 1280×720에서 드러납니다.

명령어

python scripts/new_deck.py path/to/deck --title "Session one" --theme eduba --left "PROGRAMME" --right "SESSION 1"
python scripts/build_deck.py path/to/deck            # deck/out/<name>.html 파일 생성
python scripts/build_deck.py path/to/deck --theme slate   # 다른 테마로 두 번째 파일 생성
python scripts/render.py path/to/deck/out/<name>.html     # 화면별 PNG + 연속 사진, 정적 모드
python scripts/check_text.py path/to/deck/out/<name>.html --dump

요구 사항: Python 3.9+, 렌더링을 위한 Chromium(Playwright, Chrome 또는 Edge; 또는 DECK_CHROME 설정), 연속 사진을 위한 Pillow. 폰트는 열릴 때 Google Fonts에서 로드되며, 테마는 대체 스택을 제공합니다.

파일

  • scripts/deckkit/kit.py 도우미, 상수, 캐스트, 공통 그림. scripts/deckkit/shell.py 페이지 셸. scripts/deckkit/themes/*.json 테마.
  • reference/workflow.md 루프 · reference/writing.md 등록 · reference/kit-api.md 모든 도우미 · reference/themes.md 역할 및 테마 제작 방법 · reference/storyboard-template.md.
  • examples/demo/ 대부분의 키트를 사용하는 9화면 데크; 각 테마로 빌드하여 범위를 확인하세요.

관련 스킬