User Workflows

Test complete user journeys from start to finish. Each workflow is interactive and uses real mock data to simulate the full experience.

Ready

Add to Cart Flow

Browse products, select variant, add to cart, and see confirmation

4 steps2 min
Start Workflow
Ready

Complete Checkout

Full checkout process from cart review to order confirmation

5 steps5 min
Start Workflow
Ready

Apply Discount Code

Add items to cart, apply discount code, and see price update

3 steps2 min
Start Workflow
Ready

Product Search & Filter

Search products, apply filters, and find the perfect item

3 steps2 min
Start Workflow
Ready

Order Tracking

View order history, check status, and track shipment

3 steps3 min
Start Workflow
Ready

Update Cart Items

Change quantities, remove items, and update cart

3 steps2 min
Start Workflow

What are Workflows?

Interactive step-by-step user journeys

Workflows are complete user journeys that demonstrate how components work together. Each workflow walks you through a realistic scenario using mock data.

  • Interactive:Click through each step to progress
  • Realistic:Uses actual mock API calls with network delays
  • Educational:See code examples at each step
  • Testable:Try different scenarios and edge cases

How to Use Workflows

  1. Choose a workflow from the list above
  2. Click "Start Workflow" to begin
  3. Follow the step-by-step instructions
  4. Interact with components at each step
  5. View code examples to learn implementation details
  6. Complete the workflow or reset to start over