Community코딩 & 개발github.com

zhouwei713/article-visual-director

아티클 비주얼, 샤오홍슈 캐러셀, HTML 기반 튜토리얼 카드를 기획하고 제작하기 위한 Codex 스킬입니다.

article-visual-director란 무엇인가요?

이 스킬은 개발자와 AI 에이전트가 아티클 비주얼, 샤오홍슈(Xiaohongshu) 스타일의 캐러셀 이미지, 그리고 HTML 기반 튜토리얼 카드를 자동으로 기획하고 제작할 수 있도록 도와줍니다. 간단한 설명이나 주제만 입력하면 스킬이 자동으로 비주얼 레이아웃, 색상 팔레트, 타이포그래피를 제안하고 최종 결과물을 생성합니다. 주로 Codex, Claude Code, Cursor 등 AI 코딩 에이전트와 함께 사용하도록 설계되었으며, HTML, CSS, JavaScript를 활용하여 반응형이고 깔끔한 디자인을 출력합니다. 콘텐츠 크리에이터, 개발자 블로거, 기술 문서 작성자에게 특히 유용하며, 수동 디자인 작업 없이도 일관된 비주얼을 빠르게 생성할 수 있습니다.

지원 대상~Claude Code✓Codex CLI~Cursor
npx skills add zhouwei713/article-visual-director

Installed? Explore more 코딩 & 개발 skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

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

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

문서

article-visual-director은(는) 무엇을 하나요?

아티클 비주얼, 샤오홍슈 캐러셀, HTML 기반 튜토리얼 카드를 기획하고 제작하기 위한 Codex 스킬입니다.

개요

이 스킬은 AI 에이전트가 다음을 수행할 수 있도록 지원합니다:

  • 아티클 비주얼 기획: 주제에 맞는 이미지 레이아웃, 색상, 폰트 제안
  • 샤오홍슈 캐러셀 생성: 여러 장의 슬라이드로 구성된 캐러셀 이미지 자동 생성
  • HTML 튜토리얼 카드: 코드 스니펫과 설명을 포함한 인터랙티브 카드 제작

사용 방법

AI 에이전트에게 원하는 비주얼의 주제나 콘텐츠를 설명하면, 스킬이 자동으로 적절한 디자인을 기획하고 HTML/CSS/JavaScript 코드를 생성합니다.

지원 플랫폼

  • Codex
  • Claude Code
  • Cursor
  • 기타 AI 코딩 에이전트

예시

사용자: 블로그 포스트 'React 상태 관리 완벽 가이드'의 썸네일을 만들어 줘.
에이전트: zhouwei713/article-visual-director 스킬을 사용하여 썸네일을 생성합니다...

관련 스킬