디자인·UI

HTML만으로 고품질 프로토타입·슬라이드·애니메이션·인포그래픽을 만들고, 항상 세 가지 시안을 먼저 제시하는 디자인 스킬.

iOS·macOS·watchOS·visionOS UI를 Apple 휴먼 인터페이스 가이드라인(Liquid Glass 포함) 기준으로 점검하고 설계해 주는 스킬.

코드·IaC·자연어 요청에서 편집 가능한 .drawio 다이어그램을 만들고, 동기화·검증·리뷰까지 처리하는 스킬.

브랜드 브리프부터 SVG 로고 제작, 소형 사이즈 테스트, 프레젠테이션 보드, 파비콘·앱 아이콘 납품까지 시니어 아이덴티티 디자이너처럼 진행해 주는 스킬.

짧은 JSON 스펙만 쓰면 45종 다이어그램을 애니메이션 HTML과 SVG·PNG·MP4로 만들어 주는 스킬입니다.

웹·앱·관리자 화면의 디자인 방향 설정부터 구현, 실제 스크린샷 기반 독립 평가까지를 단계별로 강제하는 UI 디자인 워크플로 스킬.

WCAG의 POUR 원칙을 기준으로 UI의 접근성 문제를 진단하고 고치도록 Claude를 안내하는 스킬입니다.

스크린샷과 리콘 문서를 바탕으로 색 역할·타이포·간격 토큰과 컴포넌트 스펙을 만들고 WCAG 대비까지 검증해주는 스킬.

복제한 앱에 고유한 이름·색상·로고 브리프·목소리를 입히고 원본의 흔적을 코드베이스에서 완전히 지워주는 리브랜딩 워크플로우.

완성된 UI를 별도 컨텍스트에서 렌더링·스크린샷하고, 시니어 디자이너 관점으로 '반려' 근거를 들이대는 적대적 디자인 리뷰 스킬.

디자인 철학을 먼저 정의하고 그것을 미술관급 포스터·아트워크 PDF/PNG로 구현해주는 공식 Anthropic 스킬입니다.

기술 스택과 시스템 아키텍처를 실제 브랜드 로고가 들어간 클라우드 벤더 스타일 다이어그램(HTML·PNG·React 컴포넌트)으로 만들어 줍니다.

UI나 디자인을 WCAG 2.2 기준으로 점검해 우선순위가 매겨진 접근성 감사 보고서와 수정안을 만들어 주는 스킬.

실제로 렌더링된 화면의 computed style을 읽어 디자인 토큰을 벗어난 색상·보이지 않는 컨트롤·실행되지 않은 애니메이션을 찾아낸다.

프로젝트의 디자인 규칙을 보존하면서 UI 제작·검토·토큰·접근성 작업을 하나의 입구에서 라우팅해주는 스킬입니다.

UI 구축·토큰·리뷰·렌더링 검증을 22개 워크플로로 분기하는 단일 진입점 디자인 스킬입니다.

배포된 URL이나 로컬 빌드를 스크린샷과 실측 지표만으로 Awwwards 심사 기준에 맞춰 점수화하고 우선순위 수정 목록을 뽑아준다.

모션·접근성·색상 일관성·반응형·성능을 스크립트로 정적 검사하고 심각도별로 리포트하는 UI 최종 점검 스킬.

저장소 성격에 맞는 SVG 히어로·섹션 헤더·다이어그램을 만들고 README를 시각적 스토리로 재구성해 주는 스킬.

Shiny 앱과 Quarto 문서에 일관된 브랜드(색상·폰트·로고)를 적용하는 _brand.yml 파일을 만들고 관리해 줍니다.