Frontend Slides

고르게 해서 취향을 알아내는 HTML 발표 자료 스킬

/plugin marketplace add https://github.com/zarazhangrui/frontend-slides

코딩 에이전트로 웹 발표 자료를 만드는 스킬입니다. 결과물이 인라인 CSS 와 자바스크립트를 담은 HTML 파일 하나라 npm 도 빌드 도구도 필요 없습니다. 원하는 분위기를 말로 설명하기 어려운 사람을 위해 미리보기를 여러 개 만들어 보여 주고 고르게 하는 방식을 씁니다. 기존 파워포인트 파일을 이미지와 내용을 지키며 웹으로 옮기는 경로도 있습니다. 흔한 인공지능 결과물 느낌을 피하려고 스타일을 골라 넣었다고 밝히고 있습니다. 클로드 코드 플러그인으로 포장돼 있지만 스킬 파일 자체는 파일시스템과 셸을 쓰는 다른 에이전트도 읽습니다.

판단

이럴 때 씁니다

  • 발표 자료를 웹으로 만들되 디자인 감각에 자신이 없을 때
  • 기존 파워포인트 파일을 웹으로 옮겨야 할 때
  • 빌드 도구 없이 파일 하나로 끝나는 결과물이 필요할 때

이럴 땐 쓰지 마세요

  • 회사 서식이 정해져 있으면 자유로운 스타일이 오히려 방해가 됩니다
  • 애니메이션이 복잡한 발표에는 전용 도구가 낫습니다
  • 설치 방식이 특정 도구의 플러그인 체계에 맞춰져 있습니다

차별점

  • 취향을 말로 묻지 않고 미리보기를 만들어 고르게 합니다.
  • 결과물이 의존성 없는 단일 HTML 파일입니다.
  • 파워포인트 파일을 이미지와 내용을 지키며 옮깁니다.
  • 흔한 인공지능 결과물 느낌을 피하는 스타일을 골라 담았습니다.

워크플로

  1. 01마켓플레이스를 등록하고 플러그인을 설치합니다.
  2. 02스킬을 부릅니다.
  3. 03만들어진 미리보기 중에서 마음에 드는 분위기를 고릅니다.
  4. 04내용을 넣고 슬라이드를 생성합니다.
  5. 05필요하면 HTML 을 직접 손봅니다.

주요 명령

명령설명
/plugin marketplace add https://github.com/zarazhangrui/frontend-slides마켓플레이스를 등록합니다.
/plugin install frontend-slides@frontend-slides플러그인을 설치합니다. 앞 명령이 끝난 뒤 따로 실행해야 합니다.
/frontend-slides:frontend-slides스킬을 부릅니다. 플러그인으로 깔린 스킬은 이름이 두 겹으로 붙습니다.

함정

설치 전에 확인하세요

  • 두 설치 명령을 한 번에 붙여 넣지 말라고 문서가 명시합니다. 각각 별도 메시지로 실행해야 합니다.
  • 짧은 저장소 이름 형식을 쓰면 SSH 로 접속을 시도해 실패할 수 있습니다. HTTPS 주소를 그대로 써야 합니다.
  • 화려한 템플릿 묶음은 선택 사항이고 단계적으로 불러옵니다. 실패하면 안전한 기본 스타일로 되돌아갑니다.
  • 결과가 고정 16대 9 비율입니다. 다른 비율이 필요하면 생성된 코드를 직접 고쳐야 합니다.

비교

발표 자료 생성 도구는 대체로 템플릿을 고르고 내용을 채우는 순서입니다. 이쪽은 취향을 먼저 시각으로 확인시키고, 결과를 고칠 수 있는 코드로 내놓습니다. 대신 슬라이드 편집기 같은 직접 조작은 없고 코드를 손봐야 합니다.

최근 변경

템플릿 라이브러리 연동과 더 안전한 슬라이드 생성 절차, 여러 에이전트와 플러그인 지원이 v2.0.0 이후 정리돼 들어갔습니다. 화려한 템플릿 묶음은 단계적으로 불러오도록 붙었습니다.