product-design
✓Automates design review, token extraction, component mapping, and implementation planning. Reduces design handoff from 6-10 hours to 5 minutes via direct Figma MCP integration. Auto-invoke when user mentions design review, Figma mockup, or design handoff.
Installation
SKILL.md
Automate design handoff from Figma to code with design system intelligence. Extract tokens, map components, detect drift, generate implementation plans.
New Architecture (v1.1.0+): Python directly connects to Figma MCP - no manual orchestration!
Output: Figma component → code component mappings with confidence scores
Automates design review, token extraction, component mapping, and implementation planning. Reduces design handoff from 6-10 hours to 5 minutes via direct Figma MCP integration. Auto-invoke when user mentions design review, Figma mockup, or design handoff. Source: alekspetrov/navigator.
Facts (cite-ready)
Stable fields and commands for AI/search citations.
- Install command
npx skills add https://github.com/alekspetrov/navigator --skill product-design- Source
- alekspetrov/navigator
- Category
- *Creative Media
- Verified
- ✓
- First Seen
- 2026-02-01
- Updated
- 2026-02-18
Quick answers
What is product-design?
Automates design review, token extraction, component mapping, and implementation planning. Reduces design handoff from 6-10 hours to 5 minutes via direct Figma MCP integration. Auto-invoke when user mentions design review, Figma mockup, or design handoff. Source: alekspetrov/navigator.
How do I install product-design?
Open your terminal or command line tool (Terminal, iTerm, Windows Terminal, etc.) Copy and run this command: npx skills add https://github.com/alekspetrov/navigator --skill product-design Once installed, the skill will be automatically configured in your AI coding environment and ready to use in Claude Code or Cursor
Where is the source repository?
https://github.com/alekspetrov/navigator
Details
- Category
- *Creative Media
- Source
- skills.sh
- First Seen
- 2026-02-01