Superdesign 디자인 캔버스

무엇을 해주나

• Superdesign CLI(npx @superdesign/cli)를 실행해 프로젝트/드래프트를 만들고, 웹 캔버스 링크로 결과를 실시간 확인하게 해줍니다.
• 실제 코드베이스가 있으면 superdesign init으로 .superdesign/init/에 컴포넌트·레이아웃·라우트·테마·페이지 의존성·추출 가능 컴포넌트 6개 문서를 만들어 디자인 컨텍스트로 활용합니다.
• 여러 최상급 모델을 골라 같은 화면의 서로 다른 방향을 병렬 비교하고, 반복(replace) 또는 분기(branch)로 버전을 관리합니다.
• 참조 URL에서 디자인 언어를 추출해 디자인 시스템 문서를 만들거나, 슬라이드 덱·포스터·소셜 그래픽, 보조 이미지/영상 에셋까지 생성합니다.
• .superdesign/resume.json을 먼저 확인해 이미 작업 중인 화면은 재분석 없이 이어서 수정합니다.

이런 분께 추천

• Superdesign 계정을 사용하며 프런트엔드 UI 시안을 빠르게 여러 개 뽑아보고 싶은 개발자·디자이너
• 기존 웹앱 페이지를 리디자인하거나 브랜드 톤에 맞춘 발표자료·마케팅 이미지가 자주 필요한 팀
• 여러 AI 모델 결과를 나란히 비교하며 방향을 정하고 싶은 프로덕트 팀

활용 예시

1. "우리 대시보드 페이지를 더 어둡고 밀도 높게 리디자인해줘" → resume 상태 확인 후 필요한 컨텍스트 파일만 골라 드래프트를 갱신.
2. "이 사이트(URL) 스타일로 랜딩 페이지 3안 만들어줘" → extract-website로 디자인 DNA를 추출하고 여러 모델로 변형 생성.
3. "투자자용 10장 슬라이드 덱 초안" → 개요를 채팅으로 승인받고 프레젠테이션 드래프트 생성, 필요 시 편집 가능한 PPTX로 내보내기.

이 파일의 지시를 읽고 그대로 따라서 나를 도와줘:
https://raw.githubusercontent.com/superdesigndev/superdesign-skill/HEAD/skills/superdesign/SKILL.md

내가 원하는 것: (여기에 하고 싶은 일을 쓰세요)

클로드스킬마트에서 찾은 스킬을 설치해줘.
GitHub 저장소 superdesigndev/superdesign-skill 의 skills/superdesign 폴더를 내 ~/.claude/skills/superdesign/ 에 그대로 복사해줘.
설치가 끝나면 이 스킬로 무엇을 할 수 있는지 한 줄로 알려줘.