bencium-controlled-ux-designer

Coordinate design decision discovery and approval for accessible web interfaces.

Updated Apr 28, 2026
One-click install
npx skills add https://github.com/leexb-wp21-prog/Azure-Ticket-Helpdesk --skill bencium-controlled-ux-designer-leexb-wp21-prog
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: bencium-controlled-ux-designer
Source: https://github.com/leexb-wp21-prog/Azure-Ticket-Helpdesk/tree/main/.cursor/skills/skills-main/skills-main/skills/bencium-controlled-nx-designer
Command: npx skills add https://github.com/leexb-wp21-prog/Azure-Ticket-Helpdesk --skill bencium-controlled-ux-designer-leexb-wp21-prog

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill prevents generic, visually flat, or accessibility-brittle UI outcomes by guiding you through intentional UX and visual design decisions with an explicit approval-first protocol.

Core Features & Use Cases

  • Decision-first UI/UX collaboration: Forces a “ask before choosing” workflow for colors, fonts, sizes, and layouts to avoid rework and mismatched direction.
  • Accessibility and usability guardrails: Ensures WCAG AA alignment (contrast, focus visibility, keyboard navigation, touch targets) and avoids relying on color alone.
  • Uniqueness without chaos: Replaces template-like SaaS styling with coherent, brand-aware typography, spacing, interaction states, and subtle motion principles.

Quick Start

Use the bencium-controlled-ux-designer skill to get UI design guidance for your new web page or application, but first ask for the top design direction questions before implementing any visual decisions.

Frequently Asked Questions about bencium-controlled-ux-designer

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

FAQPage Schema
How do I design accessible web components that meet WCAG AA contrast and keyboard navigation standards?

Building accessible web components requires validating color contrast ratios, focus visibility, and keyboard navigation against WCAG AA standards before implementation. An approval-first UX workflow ensures these accessibility guardrails are checked during the design phase.

What is an approval-first UX design process and when do I need it for web page layouts?

An approval-first UX design process requires explicit confirmation of color systems, typography hierarchies, and layout structures before implementation. Use it when building unique web pages to prevent generic SaaS styling, avoid rework, and ensure consistent design language across application UI workflows.

How do I establish typography hierarchy and spacing for a flat visual design system?

Establishing typography hierarchy and spacing for a flat visual system involves selecting brand-aware fonts and spacing scales through a decision-first review process. This produces coherent interaction states and subtle motion principles without relying on heavy visual decorations.

Can I use a decision-first UX workflow to define interaction states and motion principles for application UI?

Yes, a decision-first UX workflow can define interaction states and motion principles for application UI by coordinating design discovery questions before implementation. This ensures implementation-aligned recommendations and consistent design language across all web components.

Why does my UI design look generic and how can I achieve brand-aware visual uniqueness without chaos?

Your UI looks generic when relying on template-like SaaS styling without intentional decisions. Achieve brand-aware uniqueness without chaos by using a flat, typography and spacing-driven visual system with coordinated interaction states and subtle motion principles.

Do I need to define color systems and layout structure before implementing web component UI?

Yes, you need to define color systems and layout structure before implementing web component UI. An approval-first protocol forces an ask-before-choosing workflow for colors, fonts, and sizes to prevent accessibility-brittle outcomes and mismatched design direction.