ux-redesign

Diagnose UX hierarchy and decision-flow problems before proposing a structured redesign.

22|3|Updated Jul 28, 2024
One-click install
npx skills add https://github.com/webdevcody/go-mailing-list --skill ux-redesign-webdevcody
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ux-redesign
Source: https://github.com/webdevcody/go-mailing-list/tree/main/.claude/skills/ux-redesign
Command: npx skills add https://github.com/webdevcody/go-mailing-list --skill ux-redesign-webdevcody

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

It helps you resolve “this page feels cluttered/confusing” by rethinking the page’s purpose and prioritizing what users must do next, instead of rearranging the same UI.

Core Features & Use Cases

  • Interrogate intent first: Clarifies the page’s primary job and the single success action before touching visuals.
  • Diagnose root cause: Identifies whether the issue is priority conflict, mixed concerns, hidden primary action, weak hierarchy, or premature density.
  • Propose a guided redesign: Produces an actionable plan (in-place redesign vs split vs removal vs progressive disclosure) aligned to existing project conventions and design rules.
  • Use cases: When users get lost on a route/component, the page has too many competing CTAs, or “what should I do here?” is unclear.
  • Explicit constraints: Forces the “what would we cut?” question to prevent reshuffling that preserves clutter.

Quick Start

Ask the user to describe the route/component they want redesigned and answer the Phase 2 interview questions to identify the primary job, top three elements, and what should be cut.

Frequently Asked Questions about ux-redesign

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

FAQPage Schema
How do I fix a cluttered UI page with too many competing calls to action?

To fix a cluttered UI page, re-establish its primary intent and prioritize the single success action before proposing visual changes. This approach diagnoses root causes like mixed concerns and hidden primary actions instead of simply rearranging existing components.

What is the best way to resolve confusing information architecture on a specific route?

Resolving confusing information architecture requires interrogating the page hierarchy and decision-flow first. By identifying priority conflicts and applying progressive disclosure, you can select what elements to remove or move to align with existing routing conventions.

How do I diagnose weak visual hierarchy without breaking my existing design system?

Diagnosing weak visual hierarchy involves taking a convention snapshot of your current loaders and design system rules. This ensures proposed redesign decisions align with established project conventions rather than introducing conflicting styles.

When should I split a confusing component versus doing an in-place redesign?

You should split a component when the root cause is mixed concerns or premature density that cannot be resolved by cutting elements. If the issue is a hidden primary action or weak hierarchy, an in-place redesign or progressive disclosure is more appropriate.

Why does my product design feel confusing even after rearranging the UI elements?

Your product design feels confusing because rearranging UI elements preserves clutter without addressing priority conflicts. You must force the decision of what to cut by clarifying the page's primary job and top three elements through a structured interview process.

Can I use a Socratic interview approach to guide UX redesign decisions?

Yes, applying a Socratic interview approach helps clarify the page's primary job and identify what should be cut. Answering targeted questions about user intent produces a structured proposal with an explicit redesign decision for the confusing route.