skills.rest
hanzlahabib
hanzlahabibCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

rcode-layla-designer

Design UX plans, interface states, and design-system decisions for product screens.

2|1|Updated Apr 10, 2026
Search Tags:#accessibility#design system#user flows#ui review#ux design#wireframes#interaction design
One-click install
npx skills add https://github.com/hanzlahabib/rcode --skill rcode-layla-designer
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: rcode-layla-designer
Source: https://github.com/hanzlahabib/rcode/tree/main/rcode/skills/agents/layla-designer
Command: npx skills add https://github.com/hanzlahabib/rcode --skill rcode-layla-designer

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Layla helps teams turn messy product ideas into clear UX direction, reducing ambiguity around user flows, interface states, design-system choices, and accessibility expectations.

Core Features & Use Cases

  • User Flow Design: Map step-by-step journeys with decision points for tasks like sign-up, password reset, onboarding, and checkout.
  • UI and State Review: Evaluate screens for empty, loading, error, success, disabled, and responsive states so nothing important is left unspecified.
  • Accessibility and Design Systems: Audit designs against WCAG 2.1 AA and generate consistent token-based guidance for components, spacing, and visual hierarchy.
  • Use Case: A product manager shares a rough mockup and asks for feedback; Layla turns it into a structured design plan with states, accessibility notes, and handoff-ready guidance.

Quick Start

Ask Layla to design a user flow or review a screen, and include the product goal, audience, and any state or accessibility constraints in plain language.

Frequently Asked Questions about rcode-layla-designer

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

FAQPage Schema
How do I design user flows that cover all interface states?▼

User flow design requires mapping step-by-step journeys with decision points and evaluating screens for empty, loading, error, success, disabled, and responsive states. This ensures complete state coverage so nothing important is left unspecified across web and mobile products.

What is the best way to audit UI mockups for WCAG 2.1 AA compliance?▼

UI accessibility audits evaluate designs against WCAG 2.1 AA standards to generate consistent token-based guidance for components, spacing, and visual hierarchy. This produces accessibility notes and design-token consistency checks ready for handoff.

Can I use this to review wireframes without writing implementation code?▼

Wireframe reviews produce structured design plans with explicit handoff guidance without writing implementation code. You provide the product goal, audience, and constraints in plain language, and receive interface states, accessibility notes, and design-system decisions.

Do I need a complete design system before planning responsive layouts?▼

Responsive layout planning does not require an existing design system. It generates token-based guidance for components and spacing while auditing visual hierarchy, applying WCAG 2.1 AA checks, and specifying states for both web and mobile products.

How do I turn messy product ideas into clear UX direction?▼

Turning messy product ideas into UX direction involves structuring rough mockups into design plans with user flows, interface states, accessibility notes, and design-token consistency. This reduces ambiguity around design-system choices and accessibility expectations.

Related Skills

Explore More Design & Creative Skills→
afoveaafovea

player-researcher

Plan research and design playtest protocols for game design decisions.

Community
Advanced
basmawebinfo-hubbasmawebinfo-hub

UI Designer

Create scalable UI design systems with WCAG AA accessibility and developer handoff specifications.

Community
Advanced
carl10086carl10086
7

frontend-ui-engineering

Standardize accessible, responsive UI components with WCAG 2.1 AA compliance.

Community
Advanced
alex-voloshin-devalex-voloshin-dev
2

ui-ux-design

Standardize UI/UX design systems and WCAG 2.2 AA accessibility compliance through structured auditing and documentation workflows.

Community
Advanced