skills.rest
IT-HUSET
IT-HUSETOFFICIAL
Explore all skills by this author →
WebsiteGitHub

UI/UX Design

Coordinate UI/UX workflows across research, design-system, wireframes, and review modes.

3|2|Updated Mar 13, 2026
Search Tags:#research#ui/ux#review#wireframes#design-system#design-guidelines#token-design
One-click install
npx skills add https://github.com/IT-HUSET/andthen --skill ui-ux-design-it-huset
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: UI/UX Design
Source: https://github.com/IT-HUSET/andthen/tree/main/plugin/skills/ui-ux-design
Command: npx skills add https://github.com/IT-HUSET/andthen --skill ui-ux-design-it-huset

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Streamline and align the full UI/UX lifecycle from discovery to validation by providing a structured, multi-mode workflow that integrates research, design tokens, wireframes, and review.

Core Features & Use Cases

  • Research: understand users, journeys, and constraints to inform design direction.
  • Design-system: create tokens and component styles that serve as a canonical reference.
  • Wireframes: generate grayscale layouts to validate structure and hierarchy.
  • Review: assess conformance to the intended design and UX principles, with actionable fixes.
  • Supports chaining modes (e.g., --mode research,design-system,wireframes,review) for end-to-end execution.

Quick Start

Design a complete UI/UX workflow for a new feature starting from research through design-system, wireframes, and review.

Frequently Asked Questions about UI/UX Design

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

FAQPage Schema
How do I structure an end-to-end UI/UX design workflow from research to final review?▼

An end-to-end UI/UX design workflow is structured by chaining research, design-system, wireframes, and review modes, allowing you to execute discovery, token creation, layout validation, and conformance assessment in one cohesive process.

What is design token creation and how does it fit into a design system?▼

Design token creation is the process of defining canonical component styles and visual variables within a design-system mode, serving as a single source of reference to maintain consistency across web, mobile, and desktop applications.

Can I generate grayscale wireframes to validate UI hierarchy before writing code?▼

Yes, you can generate grayscale wireframes using the wireframes mode to validate structural layout and visual hierarchy, ensuring the product design functions correctly before applying detailed styles or development.

How do I review an existing UI implementation for conformance to design guidelines?▼

You review an existing UI implementation by using the review mode to assess conformance against intended design guidelines and UX principles, providing actionable fixes to correct any structural or visual deviations.

Does the UI/UX workflow support both mobile and desktop product discovery?▼

Yes, the UI/UX workflow supports product discovery and feature design across web, mobile, and desktop contexts, applying mode-specific requirements to coordinate research and validate implementations for different platforms.

Related Skills

Explore More Design & Creative Skills→
mewomewoliumewomewoliu
1

design-taste

Apply a defined aesthetic direction across critique, spec, code, and variant workflows.

Community
Advanced
effiemincereffiemincer

normalize

Normalize frontend UI components to match design system tokens.

Community
Advanced
karchthokarchtho

ui-ux-design

Provide expert UI/UX design guidance for frontend frameworks and design systems.

Community
Intermediate
dain-agencydain-agency

ux-psychology

Access curated UX psychology frameworks for interface design and development.

Official
Basic