에세이와 블로그 게시물을 위한 고품질 애니메이션 설명 시각 자료를 만드세요. 사용자가 대화형 웹 애니메이션을 통해 개념, 프로세스, 데이터 또는 아이디어를 시각화하고 싶을 때 사용합니다. "시각적 생성", "이 개념에 애니메이션 적용", "설명자 만들기", "이 아이디어 시각화", "이 프로세스 다이어그램", "이 데이터 표시"와 같은 요청 또는 에세이 콘텐츠가 시각적 설명에서 도움이 될 때 트리거됩니다. 추상적 개념(멘탈 모델, 프레임워크), 기술 프로세스(알고리즘, 시스템) 및 데이터 시각화(추세, 비교)를 처리합니다. 웹 콘텐츠에 직접 포함되는 독립형 HTML/CSS/JS를 출력합니다.
명령줄에서 explainer-visuals AI 스킬을 개발 환경에 빠르게 설치
출처: petekp/agent-skills.
Create animated, interactive visuals that make complex ideas intuitive.
Great explainer visuals don't just illustrate—they reveal. They show the structure hidden in complexity, the motion implicit in static descriptions, the relationships that words struggle to convey.
Before creating any visual, conduct a brief discovery interview using AskUserQuestion. Understand not just WHAT to visualize, but WHY this idea needs visual treatment.
에세이와 블로그 게시물을 위한 고품질 애니메이션 설명 시각 자료를 만드세요. 사용자가 대화형 웹 애니메이션을 통해 개념, 프로세스, 데이터 또는 아이디어를 시각화하고 싶을 때 사용합니다. "시각적 생성", "이 개념에 애니메이션 적용", "설명자 만들기", "이 아이디어 시각화", "이 프로세스 다이어그램", "이 데이터 표시"와 같은 요청 또는 에세이 콘텐츠가 시각적 설명에서 도움이 될 때 트리거됩니다. 추상적 개념(멘탈 모델, 프레임워크), 기술 프로세스(알고리즘, 시스템) 및 데이터 시각화(추세, 비교)를 처리합니다. 웹 콘텐츠에 직접 포함되는 독립형 HTML/CSS/JS를 출력합니다. 출처: petekp/agent-skills.
AI/검색 인용용 안정적인 필드와 명령어.
npx skills add https://github.com/petekp/agent-skills --skill explainer-visuals에세이와 블로그 게시물을 위한 고품질 애니메이션 설명 시각 자료를 만드세요. 사용자가 대화형 웹 애니메이션을 통해 개념, 프로세스, 데이터 또는 아이디어를 시각화하고 싶을 때 사용합니다. "시각적 생성", "이 개념에 애니메이션 적용", "설명자 만들기", "이 아이디어 시각화", "이 프로세스 다이어그램", "이 데이터 표시"와 같은 요청 또는 에세이 콘텐츠가 시각적 설명에서 도움이 될 때 트리거됩니다. 추상적 개념(멘탈 모델, 프레임워크), 기술 프로세스(알고리즘, 시스템) 및 데이터 시각화(추세, 비교)를 처리합니다. 웹 콘텐츠에 직접 포함되는 독립형 HTML/CSS/JS를 출력합니다. 출처: petekp/agent-skills.
터미널 또는 명령줄 도구(Terminal, iTerm, Windows Terminal 등)를 엽니다 이 명령어를 복사하여 실행합니다: npx skills add https://github.com/petekp/agent-skills --skill explainer-visuals 설치 후 스킬은 자동으로 AI 코딩 환경에 설정되어 Claude Code, Cursor, OpenClaw에서 사용할 수 있습니다
https://github.com/petekp/agent-skills