Skills
.Work. You
Rest

figma-user-flow-planner

Official

Plan complete Figma user flows before design.

Design & Creative#edge cases#figma#product design#user flow#ux planning#screen states#state matrix
Authorspontus-reach
Version1.0.0
Installs0

System Documentation

What problem does it solve?

It prevents designers and teams from discovering missing screens, states, or edge cases mid-build by planning the full user journey up front.

Core Features & Use Cases

  • End-to-end flow mapping: Defines entry/exit points, happy paths, failure paths, and edge-case routing for a feature.
  • Screen map with state coverage: Produces a screen list including loading, success, error, empty, and onboarding variants.
  • State matrix and decision points: Documents per-screen states, triggers, visual changes, and available actions, plus explicit branching decisions.
  • Figma-ready structure: Suggests a folder/page layout that matches the screen map and the states being designed.

Example use case: mapping the complete UX for an authentication feature so you know exactly which screens and error/empty states to design before touching Figma.

Quick Start

Ask for a user-flow plan in Figma by specifying the feature, user type, platform, starting point, and any known edge cases.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: figma-user-flow-planner
Download link: https://github.com/spontus-reach/spontus/archive/main.zip#figma-user-flow-planner

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.