skills.rest
yves-s
yves-sCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

ux-planning

Generate markdown UX spec documents with user flows, screens, states, and interaction patterns.

24|5|Updated Feb 28, 2026
Search Tags:#planning#accessibility#mobile-first#user-flows#ux#interaction-patterns#screen-inventory
One-click install
npx skills add https://github.com/yves-s/just-ship --skill ux-planning
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ux-planning
Source: https://github.com/yves-s/just-ship/tree/main/skills/ux-planning
Command: npx skills add https://github.com/yves-s/just-ship --skill ux-planning

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It eliminates guesswork and missing details by providing a structured process to define user flows, screens, states, and interaction patterns before any code is written.

Core Features & Use Cases

  • Full UX Planning Process: Generates user flow maps, screen inventories, and state specifications based on mobile‑first heuristics.
  • Platform‑Specific Guidance: Offers iOS, Android, and web interaction patterns tailored to the target platform.
  • Developer Hand‑off Ready: Produces a markdown UX spec document that developers can use directly to implement the design.

Quick Start

Use the ux-planning skill to generate a complete UX spec for my new subscription management feature.

Frequently Asked Questions about ux-planning

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

FAQPage Schema
How do I create a UX specification document for developer hand-off?▼

A UX specification for developer hand-off is created by defining user flows, screen inventories, states, and interaction patterns. This process outputs a structured markdown document detailing the UI/UX design ready for implementation.

What is the best way to plan user flows and screen states before development?▼

Planning user flows and screen states involves mapping out the complete user journey and system conditions before coding. It applies mobile-first heuristics and platform-specific patterns to ensure all UI states are accounted for.

Can I generate platform-specific interaction patterns for iOS, Android, and web?▼

Yes, platform-specific interaction patterns for iOS, Android, and web can be generated. The UX planning process tailors interaction guidelines to the target platform to ensure conventions are followed.

How do I apply mobile-first heuristics and accessibility to my UX planning?▼

Mobile-first heuristics and accessibility are applied by evaluating the user experience against established UX principles during the planning phase. This ensures the generated design meets performance and accessibility standards.

Do I need existing UI designs to generate a complete UX spec?▼

No, existing UI designs are not required. This UX planning process is specifically designed for product features that lack detailed UI/UX design, allowing you to build specifications from scratch before implementation.

Related Skills

Explore More Design & Creative Skills→
skyf0xxskyf0xx
26

hedgehog-planning-intake

Convert project descriptions into BMAD-based technical build plans and TODO checklists.

Community
Advanced
AutisticAFAutisticAF
4

product-ux-spec

Generate UI/UX specifications and design systems from PRD and architecture documents.

Community
Advanced
mikeparcewskimikeparcewski
8

visual-review

Assess visual design against a design system using a scoring rubric.

Community
Intermediate
jeffwweeejeffwweee

ui-designer

Generate HTML wireframes, React/MUI mockups, and design specifications.

Community
Intermediate