zarazhangrui/frontend-slides

해결하는 문제

Frontend Slides를 사용하면 디자이너가 아니더라도 CSS나 JavaScript를 작성할 필요 없이 전문적이고 시각적으로 매력적인 HTML 프레젠테이션을 만들 수 있습니다. 사용자가 선택할 수 있는 시각적 미리보기를 제공함으로써 디자인 선호도를 설명해야 하는 어려움을 없애고, 일반적인 "AI-slop" 미학을 피할 수 있습니다.

작동 방식

이 기술은 코딩 에이전트(Claude Code, Codex 또는 Gemini CLI 등)를 위한 기술로 구현되었습니다. 에이전트는 프로젝트의 템플릿과 스타일 프리셋을 사용하여 단일 파일 HTML 프레젠테이션을 생성합니다. 프로세스는 다음과 같습니다:

1. 사용자로부터 콘텐츠를 수집하거나 PowerPoint (.pptx) 파일에서 콘텐츠를 추출합니다.
2. 사용자의 브리프를 기반으로 세 가지 시각적 스타일 미리보기를 생성합니다.
3. 선택된 스타일로 최종 프레젠테이션을 생성하며, 이는 인라인 CSS 및 JS가 포함된 독립형 HTML 파일로 제공됩니다.

대상 사용자

빌드 도구나 프레임워크의 오버헤드 없이 고품질의 웹 기반 슬라이드쇼를 빠르게 제작해야 하는 비디자이너, 기업가 및 개발자.

주요 특징

• 의존성 없음: npm이나 빌드 도구가 필요 없는 단일 HTML 파일을 생성합니다.
• PPT 변환: 이미지와 콘텐츠를 유지하면서 기존 PowerPoint 파일을 웹 프레젠테이션으로 변환합니다.
• 시각적 스타일 탐색: 텍스트 설명 대신 시각적 미리보기를 사용하는 "보여주기(show, don't tell)" 방식을 사용합니다.
• 광범위한 템플릿 라이브러리: 34개의 디자인 시스템이 포함된 "Bold Template Pack"을 포함하여 엄선된 다양한 스타일이 포함되어 있습니다.
• 프로덕션 품질: 잘 주석이 달린 코드와 함께 접근성이 뛰어난 16:9 화면 비율의 슬라이드를 보장합니다.