FreeVideo
App window with zoom
- 365365 downloads
- 125125 likes
- 188188 saves
Works with
+ HyperFrames- Claude Code
- Codex
- Cursor
- and 3 more
Frontend UI/UX design workflow v1.0.0
Use this resource to design a web interface from research through handoff
New
- 586 downloads
- 197 likes
- 161 saves
Free
Install with the CLI
In a terminal, from the folder you want:
npx --yes palatekit@latest install ui-ux-design-workflowWith no option, the skill goes to ~/.agents/skills/; add --agent claude-code (or codex, cursor…) to target an agent.
First time: connect the CLI with
npx --yes palatekit@latest loginThe agent follows an eight-step process: requirements, research, wireframes, visual design, accessibility, responsive layout, components, documentation. It loads the detailed guides in references/ when needed. You get design specifications, a component catalog and handoff notes for developers.
Updated November 2, 2026
Previews
Details
- Install guides
- Generates with
- Your agent's model
- Licence
- MIT
Similar resources
View all- Free
FreeVideo
One big number
- 463463 downloads
- 223223 likes
- 100100 saves
Works with+ HyperFrames- Claude Code
- Codex
- Cursor
- and 3 more
PROVideo
PalateKit Motion, the library
- 338338 downloads
- 198198 likes
- 249249 saves
Works with+ HyperFrames- Claude Code
- Codex
- Cursor
- and 3 more
PROVideo
Three bars head to head
- 348348 downloads
- 133133 likes
- 182182 saves
Works with+ HyperFrames- Claude Code
- Codex
- Cursor
- and 3 more
PROVideo
Before / after slider
- 322322 downloads
- 248248 likes
- 238238 saves
Works with+ HyperFrames- Claude Code
- Codex
- Cursor
- and 3 more
PROVideo
Three-card carousel
- 418418 downloads
- 157157 likes
- 101101 saves
Works with+ HyperFrames- Claude Code
- Codex
- Cursor
- and 3 more
PROVideo
Chat exchange
- 564564 downloads
- 127127 likes
- 161161 saves
Works with+ HyperFrames- Claude Code
- Codex
- Cursor
- and 3 more
PROVideo
Checklist ticking off
- 442442 downloads
- 233233 likes
- 160160 saves
Works with+ HyperFrames- Claude Code
- Codex
- Cursor
- and 3 more
What you get
- SKILL.md: the eight-step process and key principles (French translation included)
- Twelve guides in references/: process, principles, design systems, accessibility, responsive, components, performance, examples
- Deliverable templates and a quality checklist
Good fit for
- Scoping the design of a new site or app
- Building a design system with tokens and components
- Preparing a handoff package for a development team
Not for
- Crafting a highly distinctive visual identity
- Producing visuals or illustrations
- Coding the final interface
Tags
- ui
- ux
- design system
- responsive
- components
About
You say
"Design the interface of my booking app: mobile wireframes, palette, main components and handoff notes."
Skill published by dauquangthanh under the MIT license.
Show moreShow less
Prerequisites
- You bring
- The project description and target audience and Your brand guidelines if you have them
How to use it
- Describe the project, the audience and the constraints
- Approve the wireframes and visual direction
- Collect specs, components and the checklist
Content preview
Files
- LICENSE1 KB
- NOTICE-PALATEKIT.md0.4 KB
- references/accessibility-guide.md14.4 KB
- references/component-library.md15.4 KB
- references/component-patterns.md1.6 KB
- references/design-checklist.md0.9 KB
- references/design-principles.md1.3 KB
- references/design-systems.md1.1 KB
- references/design-tools-and-resources.md1.5 KB
- references/examples.md1.6 KB
- references/output-format.md1.1 KB
- references/performance-optimization.md1 KB
- references/responsive-design.md12.8 KB
- references/uiux-design-process.md8.2 KB
- SKILL.md7.3 KB
Origin and licence
Modified by PalateKit
- Author
- dauquangthanh
- Source
- github.com/dauquangthanh/hanoi-rainbow/tree/0e2ebaea024ad494bfd39cba73effa61a9c978cf/skills/frontend-ui-ux-design
- Licence
- MIT
Notice
Version modifiée de « frontend-ui-ux-design » (dauquangthanh, MIT) : traduction française et fiche par PalateKit.
User reviews
–
No ratings yet
Loading reviews…
Frequently asked questions
Are the references/ guides essential?
Yes for depth: the main file calls them step by step. Keep the whole folder.
Is the content tied to a framework?
No, the guidance is general and fits any CSS or JavaScript framework.