skills.rest
Kaakati
KaakatiCOMMUNITY
Explore all skills by this author →
Website𝕏@kaakatiGitHub

ui-ux-patterns

Evaluate and implement UI/UX patterns using Nielsen's 10 heuristics.

2|1|Updated Feb 27, 2026
Search Tags:#design#ui#heuristics#patterns#usability#ux
One-click install
npx skills add https://github.com/Kaakati/sdh-claude-skills --skill ui-ux-patterns
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-patterns
Source: https://github.com/Kaakati/sdh-claude-skills/tree/main/.claude/skills/ui-ux-patterns
Command: npx skills add https://github.com/Kaakati/sdh-claude-skills --skill ui-ux-patterns

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill provides a comprehensive guide to UI/UX patterns, helping designers and developers create more intuitive, effective, and user-friendly interfaces.

Core Features & Use Cases

  • Pattern Library: Access to 8 core screen patterns (Onboarding, Dashboard, List/Detail, Forms, Search, Settings, Profile, Empty States).
  • Usability Evaluation: Apply Nielsen's 10 Heuristics for systematic interface review.
  • Visual Hierarchy & Interaction: Guidelines for clear visual flow and responsive user interactions.
  • Platform Adaptation: Best practices for web and mobile consistency.
  • Use Case: When designing a new dashboard, use this Skill to select the most appropriate layout, ensure key metrics are visible, and implement effective data visualization techniques.

Quick Start

Use the ui-ux-patterns skill to evaluate the current onboarding flow against Nielsen's heuristics.

Frequently Asked Questions about ui-ux-patterns

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

FAQPage Schema
How do I evaluate my interface against Nielsen's usability heuristics?▼

To evaluate your interface against Nielsen's usability heuristics, apply the 10 heuristics provided in this reference to systematically review user interactions, assigning scores to identify usability issues and guide improvements.

What are the best UI patterns for designing a dashboard layout?▼

The best UI patterns for designing a dashboard layout include selecting from 8 core screen patterns, ensuring key metrics are visible, and applying visual hierarchy checklists to implement effective data visualization techniques.

How do I adapt UI design patterns for both web and mobile platforms?▼

To adapt UI design patterns for web and mobile platforms, apply the platform-specific best practices included in this reference, ensuring interaction principles and visual hierarchy maintain consistency across different screen environments.

When should I use empty state patterns in user experience design?▼

Empty state patterns in user experience design should be used when screens have no data to display, serving as one of the 8 core screen patterns provided to guide user onboarding and interaction within the interface.

What visual hierarchy guidelines help improve web usability?▼

Visual hierarchy guidelines that improve web usability include structured checklists for clear visual flow and responsive user interactions, ensuring users can easily navigate and interpret interface elements across platforms.

Related Skills

Explore More Design & Creative Skills→
ngochuy13ngochuy13

wireframe-helper

Create annotated ASCII wireframes for page layouts and responsive behavior.

Community
Basic
davissekaidavissekai

i-critique

Analyze design quality across UX dimensions and output quantitative scores.

Community
Advanced
flitzrrrflitzrrr
4

ux-design

Conduct user interviews, create personas, and run usability tests.

Community
Intermediate
SufficientDaikonSufficientDaikon
8

ux-test-suite

Run UX test suites covering task completion, accessibility, and performance.

Community
Advanced