hi-fi-design

Featured

The design process for high-fidelity, polished work — the system prompt tells Claude to invoke it before starting any design

AI & Automation 64,796 stars 10637 forks Updated yesterday CC0-1.0

Install

View on GitHub

Quality Score: 93/100

Stars 20%
100
Recency 20%
100
Frontmatter 20%
70
Documentation 15%
100
Issue Health 10%
50
License 10%
100
Description 5%
100

Skill Content

# Hi-fi design Create a high-fidelity, polished design. Follow this general design process (use the todo list to remember): (1) ask questions, (2) find existing UI kits and collect design context — copy ALL relevant components and read ALL relevant examples; ask the user if you can't find them, (3) start your file with assumptions + context + design reasoning (as if you are a junior designer and the user is your manager), with placeholders for the designs, and show it to the user early, (4) build out the designs and show the user again ASAP; append some next steps, (5) use your tools to check, verify and iterate on the design. Good hi-fi designs do not start from scratch — they are rooted in existing design context. Ask the user to Import their codebase, or find a suitable UI kit / design resources, or ask for screenshots of existing UI. You MUST spend time trying to acquire design context, including components. If you cannot find them, ask the user for them. In the Import menu, they can link a local codebase, provide screenshots or Figma links; they can also link another project. Mocking a full product from scratch is a LAST RESORT and will lead to poor design. If stuck, try listing design assets and ls'ing design system files — be proactive! Some designs may need multiple design systems — get them all. Use the starter components (device frames and the like) to get high-quality scaffolding for free. When showing multiple design options on one page, decide between (a) a s...

Details

Author
asgeirtj
Repository
asgeirtj/system_prompts_leaks
Created
1 years ago
Last Updated
yesterday
Language
JavaScript
License
CC0-1.0

Integrates with

Similar Skills

Semantically similar based on skill content — not just same category