perfect-design

Coordinate website design and development by routing tasks to specialized skills.

2|Updated Apr 11, 2026
One-click install
npx skills add https://github.com/motionharvest/agent-skills --skill perfect-design
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: perfect-design
Source: https://github.com/motionharvest/agent-skills/tree/main/perfect-design
Command: npx skills add https://github.com/motionharvest/agent-skills --skill perfect-design

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill solves the fragmentation of the website creation process by acting as a central coordinator that guides users from a vague idea or messy input through research, strategy, design, and final implementation.

Core Features & Use Cases

  • Pipeline Orchestration: Manages the full lifecycle of a web project, including audience research, persona development, reference analysis, architecture, visual identity, and coded builds.
  • Shared Source of Truth: Maintains a ux.md file to ensure all specialized skills and the user remain aligned on project status and decisions.
  • Use Case: A user has a vague goal to improve their landing page conversion; this skill diagnoses the specific gap (e.g., lack of audience research) and routes the user to the appropriate specialized skill while tracking progress.

Quick Start

Run the perfect-design skill with your website URL or a screenshot to begin the diagnostic process and start building your project strategy.

Frequently Asked Questions about perfect-design

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I manage an end-to-end website design pipeline from research to code?

An end-to-end website design pipeline coordinates audience discovery, persona creation, visual identity, and coded builds by routing tasks to specialized skills while tracking phase status in a shared ux.md file.

What's the best way to diagnose gaps in my web design and product strategy workflow?

Diagnosing web design workflow gaps involves analyzing your project URL or screenshot to identify missing elements like audience research or architecture, then routing the task to the appropriate specialized skill for execution.

Can I use this pipeline to improve landing page conversion and user experience?

You can improve landing page conversion by running the pipeline to diagnose specific UX gaps, trigger audience research and persona development, and implement targeted design updates followed by A/B testing.

How do I maintain a shared source of truth for product management and UX documentation?

Maintaining a shared source of truth for UX documentation requires a ux.md file that tracks project decisions and phase status, ensuring all specialized design and build skills remain aligned throughout the lifecycle.

Do I need audience research and personas before starting a website build pipeline?

You do not need audience research and personas prepared beforehand; the pipeline diagnoses project gaps and routes you to specialized research skills to develop them as part of the initial product lifecycle phases.

What happens after the design pipeline generates visual identity and architecture?

After generating visual identity and architecture, the pipeline routes tasks to build skills for final code implementation, followed by A/B testing to validate design decisions and conversion outcomes.