Cascading v3: Writing stories from Figma

Cascading v3: Writing stories from Figma

Learn how to create shell stories and stories from Figma designs.

 

👉 Bitovi can help you integrate this into your own SDLC workflow: AI for Software Teams

 

The CascadeMCP server provides two MCP and API capabilities useful for this part of the Cascading workflow:

 

Given designs like:

MacBook Pro 16_ - 9.png



This will produce a list of shell stories like (full list on the left, example story on the right)

image-20251110-031549.png
  • st001 Display Core Dashboard Metrics ⟩ Show primary task and team statistics in summary cards (2025-11-09T22:20:02.861Z)

    • SCREENS: macbook-pro-16-9

    • DEPENDENCIES: none

    • ✅ Display Total Tasks card with count (30) and subtitle "All tasks in the system"

    • ✅ Display Completed Tasks card with count (5) and percentage (17% completed)

    • ✅ Display Open Tasks card with count (10) and subtitle "Tasks currently in progress"

    • ✅ Display Team Members card with count (8) and subtitle "Active users on the platform"

    • ✅ Fixed left sidebar navigation component with dark teal background (#0A3A3A)

    • ✅ Dashboard navigation item shown in active state (coral/orange color, grid icon)

    • ✅ Inactive navigation items: Tasks (checkbox icon), Board (vertical bars icon), Team (people icon), Analytics (bar chart icon)

    • ✅ TaskFlow branding logo with checkmark icon in top-left

    • ✅ Page title "Dashboard" displayed at top-center of main content area

    • ❌ Interactive icon functionality in top-right of metric cards (defer to st007)

    • ❌ Drill-down functionality for metric cards (defer to st008)

    • ❌ Real-time data updates (defer to st009)

    • ❓ What API endpoint(s) provide the metric data?

    • ❓ Should metrics update on page load only, or refresh periodically?

    • ❓ What should display if metric values are zero?