frontend-ui-engineering
Builds production-quality, accessible, responsive user-facing UIs
by addyosmaniFree
Description
frontend-ui-engineering is an agent skill from Addy Osmani's agent-skills collection for building production-quality user interfaces that are accessible, responsive and performant. The aim is UI that looks as though a design-aware engineer built it, not something that reads as generated by an AI. The skill calls for real adherence to the design system, proper accessibility, thoughtful interaction patterns, and no generic AI aesthetic. It covers component architecture and file structure, including colocating everything related to a component. The skill applies when building new components or pages, modifying existing user-facing interfaces, implementing responsive layouts, adding interactivity or state management, and fixing visual or UX problems. It is listed on skills.sh, with its security audit results shown there. The skill suits front-end developers and agents who build product interfaces and want them to follow a consistent design system and accessibility standard, without relying on an agent's default styling.…
Highlights
- Accessible, responsive, performant UI
- Design system adherence
- Component architecture and colocated files
- Avoids generic AI-styled interfaces
Ratings & Reviews
No ratings yet
Be the first to rate frontend-ui-engineering.
People also visit
frontend-ui-engineering FAQ
What does the frontend-ui-engineering skill do?
It guides an agent in building accessible, responsive and performant user interfaces that follow the project's design system.
How do I install it?
Run: npx skills add https://github.com/addyosmani/agent-skills --skill frontend-ui-engineering
How does it organize components?
It colocates everything related to a component, and it sets out a file structure for the component architecture.
When should I use it?
When building or changing pages and components, implementing responsive layouts, adding interactivity or state, or fixing visual and UX issues.
What security checks has it passed?
skills.sh lists three audits: Gen Agent Trust Hub Pass, Socket Pass and Snyk Pass.
What are the best frontend-ui-engineering alternatives?
Popular alternatives to frontend-ui-engineering include accessibility, impeccable-design-polish and image-to-ui. See all frontend-ui-engineering alternatives