cx-inspiration

Figma → Analysis → Mobbin References

Analyze a selected Figma flow for UX best practices, or describe a pattern to get structured recommendations with real-world references from 600K+ curated app screens via Mobbin.

How to trigger

cx-inspiration

Type this in the Kiro chat, or simply ask for inspiration naturally: "how do others handle this?", "show me references for password reset". Works with or without a Figma selection.

Two modes

Mode A: Analyze

Select a Section or frame group in Figma. The assistant reads the structure, identifies the UX pattern, gives best-practice feedback, and finds matching references on Mobbin.

Requires: Figma Desktop Bridge

Mode B: Search

Describe a flow or pattern in words. The assistant provides structured UX recommendations, then searches Mobbin for real-world references with pattern analysis.

Requires: Mobbin MCP only

What happens

1
Understand — Reads the Figma selection (Mode A) or parses your description (Mode B) to identify the flow type and key elements.
2
Recommend — Provides structured best-practice analysis: standard steps, key decisions, common pitfalls, accessibility notes.
3
Search — Queries Mobbin for matching screens, flows, or web sections. Uses AI-scored deep search for relevance.
4
Analyze — Extracts patterns across results: "5 of 8 apps use OTP input", "3 use a bottom sheet for confirmation". Provides comparison table.
5
Iterate — Refine with follow-up queries: "show me more from fintech", "focus on the error states", "now search web versions".

Search modes

Mode	Best for	Platform
Flows	Multi-step journeys (onboarding, checkout, registration)	iOS, Web
Screens	Single patterns (empty states, error screens, modals)	iOS, Web
Sections	Web page sections (hero, pricing, footer)	Web only

Example output

For a query like "I'm designing a password reset flow":

Recommended steps: Email input → Verification code (6-digit OTP) → New password → Success confirmation

Pattern analysis: 5 of 8 apps use dedicated OTP input boxes. 3 use a bottom sheet. All show expected delivery time.

References: Eventbrite, Coinbase, Afterpay, Walmart, Best Buy — with inline screenshots and Mobbin links.

Key decision: Bottom sheet (quick, keeps context) vs. full-screen (more focused, less distraction).

MCP tools used

Mobbin MCP

Search screens, flows, and web sections from 600K+ curated real app screenshots. AI-scored deep search.

Docs →

Figma Console MCP

Read selected frames, traverse layer tree, capture screenshots (Mode A only)

Docs →

Prerequisites

Mobbin MCP connected (OAuth — browser login on first use)
Mobbin account (free tier works for basic searches)
Figma Desktop with Bridge Plugin (only for Mode A — analyzing selections)

Built-in UX knowledge

The assistant applies established UX principles when analyzing flows:

Authentication

Progressive disclosure, show/hide password, 6-digit OTP standard

Onboarding

3-5 steps max, progress indicator, allow skip

Error & Empty States

Explain what happened, provide action, reduce frustration

Form Design

One action per screen, inline validation, smart defaults

← Back to all flows