skills.rest
ketanswebsite
ketanswebsiteCOMMUNITY
Explore all skills by this author →
GitHub

ui-ux-design-advisor

Analyze project structure and design system to propose UI/UX design options.

Updated May 28, 2025
Search Tags:#design#ui#layout#frontend#design system#component#ux
One-click install
npx skills add https://github.com/ketanswebsite/signalforge --skill ui-ux-design-advisor
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-design-advisor
Source: https://github.com/ketanswebsite/signalforge/tree/main/.claude/skills/ui-ux-design-advisor
Command: npx skills add https://github.com/ketanswebsite/signalforge --skill ui-ux-design-advisor

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill helps users make informed UI/UX design decisions by analyzing existing project structures and design systems, then providing contextually relevant design options with visual descriptions.

Core Features & Use Cases

  • Project Analysis: Assesses current codebase, design system, and tech stack.
  • Design Options: Presents 3-4 distinct, visually described design approaches.
  • Implementation Planning: Creates a detailed plan for integrating chosen designs.
  • Use Case: A developer building a new dashboard can use this Skill to get recommendations for layout, color schemes, and component patterns that align with their existing React and Tailwind CSS project.

Quick Start

Analyze my current project structure and suggest a modern card-based layout for a new dashboard.

Frequently Asked Questions about ui-ux-design-advisor

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

FAQPage Schema
How do I get UI design options that match my existing frontend codebase?▼

To get matching UI design options, this skill analyzes your existing project structure and design system. It then provides 3-4 contextually relevant visual design approaches, including layouts and component patterns, that integrate seamlessly with your current codebase.

What is the best way to choose a layout and color scheme for a new dashboard?▼

The best way to choose a layout and color scheme is to use contextual design analysis. By assessing your current tech stack and design system, this skill provides visually described component patterns and interactions tailored for your new dashboard.

Can I use this to plan component patterns for a React and Tailwind CSS project?▼

Yes, you can use this for a React and Tailwind CSS project. It assesses your current design system and tech stack to recommend component patterns and interactions, followed by a detailed implementation plan for integrating the chosen designs.

How does this approach generate design options that fit my current tech stack?▼

This approach generates fitting design options by first analyzing your existing project structure and design system. It then presents distinct UI/UX approaches with visual descriptions specifically tailored to align with your current tech stack.

Do I need an existing design system to get relevant UX recommendations?▼

You do not need a complex existing design system, but having a current project structure helps. The skill analyzes your codebase to provide contextually relevant UX recommendations and implementation plans that integrate seamlessly with what you have.

Related Skills

Explore More Design & Creative Skills→
rachel353rachel353

ux-insight-matcher

Extract and merge UX design insights into prioritized guidance for frontend tasks.

Community
Advanced
parhummparhumm
25

frontend-component-fix

Diagnose frontend UI bugs and generate patch artifacts for React-like components.

Community
Advanced
1479089714790897
7

kwp-design-design-system

Audit component libraries for naming inconsistencies and missing documentation.

Community
Intermediate
open-mercatoopen-mercato
1.6k

backend-ui-design

Design backend interfaces using @open-mercato/ui components and standardized layouts.

Official
Intermediate