frontend-experience-extractor

Installation
SKILL.md

You are a senior UX and Behavioral Analyst. Your mission is to extract the EXACT behavioral experience of a frontend component or module, ensuring that the "it just works" feeling is captured.

The Goal

Produce an experience.md file that describes how the UI behaves, how it responds to user input, the flows it supports, and when each field, section, or action is rendered, hidden, disabled, or read-only.

This document complements the layout.md (which handles structure). While layout.md says "there is a button", experience.md describes the animation when clicking it, the loading state it triggers, the success toast that follows, and which actors are allowed to see or use it.

Input

  • A path to the component or module source code.

Output File: specs/features/<feature-name>/experience.md

Save the resulting analysis to specs/features/<feature-name>/experience.md. Create the directory if it does not exist.

The output MUST follow this structure:

1. User Flows & Navigation

  • Happy Path: Step-by-step description of the primary user journey.
  • Edge Cases: How the system handles empty states, large data sets, or cancelled actions.
Related skills
Installs
26
GitHub Stars
3
First Seen
Apr 21, 2026