Menu
슬라이드 프로젝트의 발표용 프레젠터 생성. 클릭/키보드로 슬라이드를 넘기고, 하이라이터 마커 기능 포함. "발표용으로 만들어줘", "프레젠터", "presenter", "발표 모드" 등의 요청에 사용.
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
Based on SOC occupation classification
Remotion 슬라이드의 compare 타입 전용 스킬. 2~4개 항목을 나란히 비교하는 슬라이드를 설계하거나 수정할 때 사용.
Remotion 슬라이드의 evolution-flow 타입 전용 스킬. 왼쪽 상태에서 오른쪽 상태로 무엇이 어떻게 바뀌었는지, 그 변화 축과 결과를 3열 흐름으로 설명할 때 사용.
슬라이드를 PDF로 내보내기. 각 슬라이드를 PNG로 렌더한 뒤 pdf-lib으로 합쳐서 단일 PDF 파일을 생성한다. "PDF로 뽑아줘", "PDF 내보내기" 등의 요청에 사용.
Remotion 슬라이드의 quote 타입 전용 스킬. 핵심 문장이나 인용구를 큰따옴표 장식과 함께 크게 보여주는 슬라이드를 설계하거나 수정할 때 사용.
Remotion 슬라이드의 stat 타입 전용 스킬. 큰 숫자와 짧은 설명으로 임팩트를 주는 슬라이드를 설계하거나 수정할 때 사용.
Remotion 슬라이드의 steps 타입 전용 스킬. 번호가 매겨진 순차 프로세스를 연결선과 함께 보여주는 슬라이드를 설계하거나 수정할 때 사용.
| name | remotion-presenter |
| description | 슬라이드 프로젝트의 발표용 프레젠터 생성. 클릭/키보드로 슬라이드를 넘기고, 하이라이터 마커 기능 포함. "발표용으로 만들어줘", "프레젠터", "presenter", "발표 모드" 등의 요청에 사용. |
마크다운 슬라이드를 브라우저에서 클릭/키보드로 넘기며 발표할 수 있는 프레젠터.
Remotion의 @remotion/player를 사용하여 모든 애니메이션(뱃지 바운스, 타이틀 fade-in, 불릿 stagger 등)이 그대로 동작한다.
npm run slides:present -- markdowns/<topic>/<topic>.md
Vite 서버가 포트 4000에서 시작된다.
define으로 시작 시점에 읽는다.theme: 변경, frontmatter 수정, 이미지 참조 변경 후에는 기존 slides:present 프로세스를 종료하고 다시 실행해야 한다.src/presenter/
├── Presenter.tsx # Player + 클릭/키보드 제어
├── index.tsx # React 진입점
├── index.html # HTML
├── types.d.ts # 가상 모듈 타입
└── vite.config.ts # Vite 설정 (port 4000, 가상 마크다운 모듈)
| 동작 | 효과 |
|---|---|
| → / 스페이스 / PageDown | 다음 슬라이드 |
| ← / PageUp | 이전 슬라이드 |
| Home | 첫 슬라이드 |
| End | 마지막 슬라이드 |
| F | 풀스크린 토글 |
하단에 Prev / Next 버튼과 슬라이드 번호 표시.
SLIDE_MARKDOWN_FILE 환경변수로 마크다운 파일을 읽음markdowns/<topic>/파일명으로 자동 치환parseSlideMarkdown()으로 파싱하여 SlideData[] 생성@remotion/player의 Player 컴포넌트로 렌더링프레젠터는 Remotion 컴포지션이 아니라 독립 Vite 앱이므로 Root.tsx에 등록하지 않는다.