Files
bakery-ia/JTBD_UNIFIED_ADD_WIZARD.md
Claude 1eacfc8e64 feat: Add JTBD-driven Unified Add Wizard system
Implemented a comprehensive unified wizard system to consolidate all "add new content"
actions into a single, intuitive, step-by-step guided experience based on Jobs To Be Done
(JTBD) methodology.

## What's New

### Core Components
- **UnifiedAddWizard**: Main orchestrator component that routes to specific wizards
- **ItemTypeSelector**: Beautiful visual card-based selection for 9 content types
- **9 Individual Wizards**: Step-by-step flows for each content type

### Priority Implementations (P0)
1. **SalesEntryWizard**  (MOST CRITICAL)
   - Manual entry with dynamic product lists and auto-calculated totals
   - File upload placeholder for CSV/Excel bulk import
   - Critical for small bakeries without POS systems

2. **InventoryWizard**
   - Type selection (ingredient vs finished product)
   - Context-aware forms based on inventory type
   - Optional initial lot entry

### Placeholder Wizards (P1/P2)
- Customer Order, Supplier, Recipe, Customer, Quality Template, Equipment, Team Member
- Proper structure in place for incremental enhancement

### Dashboard Integration
- Added prominent "Agregar" button in dashboard header
- Opens wizard modal with visual type selection
- Auto-refreshes dashboard after wizard completion

### Design Highlights
- Mobile-first responsive design (full-screen on mobile, modal on desktop)
- Touch-friendly with 44px+ touch targets
- Follows existing color system and design tokens
- Progressive disclosure to reduce cognitive load
- Accessibility-compliant (WCAG AA)

## Documentation

Created comprehensive documentation:
- `JTBD_UNIFIED_ADD_WIZARD.md` - Full JTBD analysis and research
- `WIZARD_ARCHITECTURE_DESIGN.md` - Technical design and specifications
- `UNIFIED_WIZARD_IMPLEMENTATION_SUMMARY.md` - Implementation guide

## Files Changed

- New: `frontend/src/components/domain/unified-wizard/` (15 new files)
- Modified: `frontend/src/pages/app/DashboardPage.tsx` (added wizard integration)

## Next Steps

- [ ] Connect wizards to real API endpoints (currently mock/placeholder)
- [ ] Implement full CSV upload for sales entry
- [ ] Add comprehensive form validation
- [ ] Enhance P1 priority wizards based on user feedback

## JTBD Alignment

Main Job: "When I need to expand or update my bakery operations, I want to quickly add
new resources to my management system, so I can keep my business running smoothly."

Key insights applied:
- Prioritized sales entry (most bakeries lack POS)
- Mobile-first (bakery owners are on their feet)
- Progressive disclosure (reduce overwhelm)
- Forgiving interactions (can go back, save drafts)
2025-11-09 08:40:01 +00:00

14 KiB

Jobs To Be Done Framework: Unified Add Wizard System

🎯 Main Job Statement

When I need to expand or update my bakery operations, I want to quickly add new resources, relationships, or data to my management system, so I can keep my business running smoothly without interruption and make informed decisions based on complete information.


🔧 Functional Jobs (The 9 Core Sub-Jobs)

1. Inventory Management Job

When I discover or start using a new ingredient or finished product, I want to add it to my inventory system with type classification, essential details, and initial stock levels, so I can track availability, plan production, and prevent stockouts.

Steps involved:

  • Classify the item (ingredient vs. finished product)
  • Define core attributes (name, unit, category, storage requirements)
  • Add initial lot(s) with critical tracking data (quantity, expiry, batch number)

2. Supplier Relationship Job

When I find a new supplier or formalize a purchasing relationship, I want to record their contact details, the ingredients they provide, pricing, and minimum order quantities, so I can make informed purchasing decisions and maintain reliable supply chains.

Steps involved:

  • Capture supplier information (name, contact, payment terms)
  • Link to ingredients they supply from inventory
  • Set pricing and minimum order quantities per ingredient

3. Recipe Documentation Job

When I create or standardize a recipe, I want to document the recipe details, required ingredients from inventory, and applicable quality templates, so I can ensure consistent production quality and accurate costing.

Steps involved:

  • Define recipe metadata (name, category, yield, instructions)
  • Select ingredients from inventory with quantities
  • Assign quality templates for process control

4. Equipment Tracking Job

When I acquire new equipment (mixer, oven, proofer, etc.), I want to register it in my system with specifications and maintenance schedules, so I can manage capacity planning, maintenance, and operational efficiency.

Steps involved:

  • Record equipment details (type, model, capacity, location)
  • Set maintenance schedules and specifications

5. Quality Standards Job

When I establish quality criteria for my products or processes, I want to create reusable quality templates with checkpoints, so I can maintain consistent product standards and meet regulatory requirements.

Steps involved:

  • Define template name and scope (product/process)
  • Set quality checkpoints and acceptance criteria
  • Configure frequency and documentation requirements

6. Order Processing Job

When a customer places an order, I want to record order details, items, quantities, and delivery requirements quickly, so I can fulfill orders on time and track customer demand.

Steps involved:

  • Select or create customer
  • Add order items (products, quantities, custom requirements)
  • Set delivery date, payment terms, and special instructions

7. Customer Relationship Job

When I gain a new customer (wholesale, retail, or event client), I want to capture their information and preferences, so I can serve them better, track order history, and personalize service.

Steps involved:

  • Record customer details (name, contact, type, preferences)
  • Set payment terms and delivery preferences
  • Note dietary restrictions or special requirements

8. Team Building Job

When I hire a new team member, I want to add them to the system with role, permissions, and contact information, so I can manage responsibilities, access control, and internal communication.

Steps involved:

  • Enter team member details (name, role, contact)
  • Set permissions and access levels
  • Assign responsibilities and schedule

9. Sales Recording Job CRITICAL

When I complete sales transactions (daily, weekly, or event-based), I want to log them manually or upload them in bulk from my records, so I can track revenue, understand buying patterns, and maintain financial records.

Steps involved:

  • Choose entry method (manual entry vs. file upload)
  • For manual: Enter date, items, quantities, amounts
  • For upload: Map CSV/Excel columns to system fields, validate, and import
  • Review and confirm entries

Why critical: Most small bakeries lack POS systems and rely on manual logs, cash registers, or Excel spreadsheets. This is the primary way they capture sales data for business intelligence.


💭 Emotional Jobs

Users also hire this system to satisfy emotional needs:

  • Feel organized and in control of business operations
  • Feel confident that nothing is falling through the cracks
  • Feel professional in how I manage my bakery (vs. scattered notebooks)
  • Reduce anxiety about missing critical information that could hurt operations
  • Feel empowered to make data-driven decisions
  • Feel accomplished when completing complex setups efficiently
  • Avoid overwhelm when onboarding new operational elements

👥 Social Jobs

Users want the system to help them:

  • Demonstrate competence to staff, partners, and investors
  • Show professionalism to customers and suppliers
  • Build credibility for regulatory compliance (health inspections, quality audits)
  • Project growth mindset to stakeholders
  • Train new staff more easily with standardized processes

⚖️ Forces of Progress

🔴 Push (Problems creating urgency to change)

  1. Scattered navigation: "I have to remember which page has which 'Add' button"
  2. Context switching cost: "I need to add a recipe, but first I have to add ingredients on a different page"
  3. Incomplete data entry: "I forgot to add critical fields and now have errors downstream"
  4. Time pressure: "I'm in the middle of production and need to add something quickly"
  5. Mobile inaccessibility: "I'm on the bakery floor and can't easily add items from my phone"
  6. Repetitive tasks: "I have 50 sales entries from last week that I have to input one by one"

🟢 Pull (Vision of better state)

  1. One-click access: "A single 'Add' button that helps me add anything"
  2. Guided process: "Step-by-step guidance that prevents me from missing required fields"
  3. Mobile-friendly: "I can add items from my phone while in the bakery"
  4. Bulk operations: "I can upload all my sales at once from my spreadsheet"
  5. Contextual help: "The wizard shows me what I need and why"
  6. Progress saved: "I can pause and come back without losing my work"

😰 Anxiety (Fears holding back adoption)

  1. Fear of mistakes: "What if I enter something wrong and mess up my data?"
  2. Complexity concern: "Will this be harder than what I'm doing now?"
  3. Time investment: "I don't have time to learn a new system right now"
  4. Missing information: "What if I don't have all the information required?"
  5. Lost progress: "What if I get interrupted and lose everything I entered?"
  6. Change resistance: "The current way works, why risk changing it?"

🔄 Habit (Inertia of current behavior)

  1. Navigation muscle memory: "I'm used to going to the Inventory page to add ingredients"
  2. Familiar forms: "I know where all the fields are in the current forms"
  3. Workarounds established: "I have my own system for remembering what to add"
  4. Sequential thinking: "I think in terms of pages, not tasks"

🚧 User Struggles & Unmet Needs

Discovery Struggles

  • "I don't know what information I need to have ready before I start"
  • "I don't understand the relationship between items (e.g., recipes need ingredients first)"

Process Struggles

  • "I start adding something and realize I'm missing prerequisite data"
  • "I get interrupted frequently and lose my place"
  • "The form doesn't tell me why certain fields are required"

Efficiency Struggles

  • "I need to add multiple related items but have to repeat similar information"
  • "I can't add things in bulk when I have many items to enter" (especially sales data)
  • "Mobile forms are hard to use with small text and buttons"

Error Recovery Struggles

  • "If I make a mistake, I have to start completely over"
  • "I don't know what went wrong when submission fails"
  • "Validation errors don't clearly explain how to fix them"

Visibility Struggles

  • "I can't see what I've already added without leaving the form"
  • "I don't know if the item I'm adding already exists"
  • "No confirmation that my data was saved successfully"

Job Completion Criteria (Success Metrics)

The job is done well when:

Accuracy

  • ✓ All required information is captured completely
  • ✓ No invalid or duplicate data is created
  • ✓ Relationships between items are correctly established

Efficiency

  • ✓ Process feels fast and effortless
  • ✓ Minimal cognitive load (clear next steps always visible)
  • ✓ Bulk operations complete in seconds, not hours

Accessibility

  • ✓ Can complete on mobile as easily as desktop
  • ✓ Works in noisy, busy bakery environments
  • ✓ Readable with floury hands (large touch targets)

Confidence

  • ✓ Clear feedback on what's needed next
  • ✓ Validation happens in real-time with helpful guidance
  • ✓ Success confirmation is immediate and clear

Recovery

  • ✓ Can pause and resume without data loss
  • ✓ Easy to correct mistakes inline
  • ✓ Clear error messages with actionable solutions

🎨 Design Principles Derived from JTBD

1. Progressive Disclosure

Don't overwhelm users with all 9 options at once. Guide them through intent → action → completion.

2. Smart Defaults & Suggestions

Reduce cognitive load by pre-filling data, suggesting related items, and showing what's typically needed.

3. Mobile-First Touch Targets

Bakery owners are often on their feet, in production areas, with limited desk time. Mobile is primary context.

4. Forgiving Interactions

Allow users to go back, save drafts, skip optional fields, and fix errors inline without starting over.

5. Contextual Education

Don't just ask for data—explain why it matters and how it'll be used. Build user understanding over time.

6. Bulk-Friendly for Sales

Special attention to #9: Recognize that sales data often comes in batches. Optimize for CSV upload and validation workflows.

7. Relationship Awareness

When adding a recipe, show if ingredients exist. Offer to add missing ingredients inline. Reduce context-switching.

8. Confirmation & Next Actions

After completing a job, clearly show what was created and suggest logical next steps (e.g., "Recipe added! Add another or create a production batch?").


🗺️ User Journey Map (Generalized)

Stage 1: Intent Recognition

User state: "I need to add something to my system" Emotion: Focused, possibly rushed Touchpoint: Dashboard "Add" button OR specific page "Add" button

Stage 2: Selection

User state: "What type of thing am I adding?" Emotion: Seeking clarity Touchpoint: Wizard step 1 - visual card-based selection of 9 options

Stage 3: Guided Input

User state: "Walking through the steps for my specific item" Emotion: Confident with guidance, anxious about mistakes Touchpoint: Multi-step wizard tailored to item type (2-4 steps typically)

Stage 4: Validation & Preview

User state: "Is this correct? Did I miss anything?" Emotion: Cautious, double-checking Touchpoint: Review step showing all entered data

Stage 5: Confirmation

User state: "It's saved! What now?" Emotion: Accomplished, ready for next task Touchpoint: Success message with next action suggestions


📊 Prioritization Matrix

Based on JTBD analysis, here's the priority order:

Rank Job Frequency Impact Complexity Priority
1 Sales Recording (#9) Daily Critical High P0
2 Customer Orders (#6) Daily High Medium P0
3 Inventory Management (#1) Weekly High Medium P0
4 Recipe Documentation (#3) Monthly High High P1
5 Supplier Management (#2) Monthly Medium Low P1
6 Customer Management (#7) Weekly Medium Low P1
7 Quality Templates (#5) Quarterly Medium Medium P2
8 Equipment Tracking (#4) Rarely Low Low P2
9 Team Members (#8) Rarely Medium Low P2

Recommendation: Focus UX polish on P0 items, especially Sales Recording (#9).


🔍 Validation Checkpoints

Before finalizing the design, verify:

  • Are all 9 jobs clearly goal-oriented (not solution-oriented)?
  • Are sub-jobs specific steps toward completing each main job?
  • Are emotional jobs (confidence, control, professionalism) captured?
  • Are social jobs (credibility, competence) captured?
  • Are forces of progress (push, pull, anxiety, habit) identified?
  • Are user struggles and unmet needs specific and actionable?
  • Is the critical importance of sales recording (#9) emphasized?
  • Are mobile-first and bulk operations principles derived from insights?

📝 Next Steps

  1. Design the unified wizard architecture based on this JTBD framework
  2. Create component hierarchy (UnifiedAddWizard → ItemTypeSelector → Specific Item Wizards)
  3. Design each of the 9 wizard flows with special attention to sales recording
  4. Implement mobile-responsive UI following the existing design system
  5. Test with real bakery workflows to validate job completion
  6. Iterate based on user feedback from initial rollout

Document Version: 1.0 Date: 2025-11-09 Status: Framework Complete - Ready for Design Phase