Plan, design, and implement A/B tests and experiments with statistical rigor. Covers hypothesis frameworks, sample sizing, metrics, and result analysis.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
SebastianLuser/claude-code-arcane32026년 10월 27일 업데이트
무료GitHub에 공개
design-handoff
Design handoff: Figma design to tech spec + ClickUp/Jira ticket + component code stub. Full cross-tool handoff workflow.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
SebastianLuser/claude-code-arcane스타 3(GitHub 3 + cccskills 0)
실행 점수 미검증
설치 방법 보기포함된 파일(1)
- SKILL.md2.2 KB
SKILL.md(원문)
설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.
Design Handoff Workflow
Figma → spec doc → ticket (ClickUp/Jira) → component code stub → links bidireccionales.
/design-handoff <figma_url> [--target clickup|jira] [--stack react|vue|flutter]
Paso a Paso
1. Inspeccionar Figma
Usar figma skill: GET node data → extraer dimensions, layout, states, interactions, tokens usados, assets a exportar.
2. Generar Spec
Documento estructurado con: purpose (1-2 oraciones), anatomy (pseudo-component tree), variants table (variant/description/props), states table (state/description/trigger — default/hover/active/loading/error/empty), design tokens (colors/typography/spacing/radius/shadow), measurements table (element/dimension), interactions (click/hover/keyboard), responsive breakpoints (desktop ≥1024, tablet 768-1023, mobile <768), accessibility (focus visible, ARIA, keyboard nav, contrast 4.5:1, text alternatives), assets to export (file + output dir).
3. Crear Ticket
ClickUp: createTask con list_id, name [Component] Implementar X, spec embebido en description, tags: frontend/component/design-ready.
Jira: POST issue con project key, summary, ADF description, Task type, labels.
4. Generar Code Stub
React+TS stub: component file (interface con props de variants/states, JSX con semantic HTML, CSS module imports) + CSS module file (tokens como CSS vars). Stub compilable — no pseudo-code.
Assets: export desde Figma al directorio del repo.
5. Linkear Todo
En ticket: link a spec doc + Figma + PR reference cuando exista.
Config
.claude/config/design-handoff.yml: default_target, default_list_id, stack, components_dir, assets_dir, designers mapping (figma_email → clickup_id/jira_email).
Reglas
- Spec embebido en ticket — el dev no abre 3 tabs
- Assets exportados al repo inmediatamente
- Code stub compilable (
npm run buildfunciona) - Link bidireccional: spec ↔ Figma ↔ ticket ↔ code
리뷰
아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.
댓글
로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.
아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.
같은 저장소의 스킬
Web/mobile accessibility decision guide: WCAG 2.2 AA, ARIA, keyboard nav, focus management, contrast, testing. Use for: a11y, accessibility, wcag, aria, screen reader, keyboard, contrast.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
SebastianLuser/claude-code-arcane32026년 10월 27일 업데이트
Generate, iterate, and scale ad creative for paid advertising across Google, Meta, LinkedIn, and X. Covers platform specs, creative frameworks, and quality validation.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
SebastianLuser/claude-code-arcane32026년 10월 27일 업데이트
Musica interactiva para juegos: layering vertical, re-secuenciacion horizontal, stingers, reglas de transicion con sync points, y mapeo de estados de gameplay a musica. Usar para: musica adaptativa, sistema de musica dinamica, transiciones musicales, combat music.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
SebastianLuser/claude-code-arcane32026년 10월 27일 업데이트
Design multi-agent systems, create agent architectures, define communication patterns, and build autonomous agent workflows with structured evaluation frameworks.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
SebastianLuser/claude-code-arcane32026년 10월 27일 업데이트
Inter-agent communication protocol for C-suite agent teams. Defines invocation syntax, loop prevention, isolation rules, response formats, and quality loops.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
SebastianLuser/claude-code-arcane32026년 10월 27일 업데이트