2.4 KiB
2.4 KiB
Quick Start
Your first 5 minutes with WDS
What You'll Do
- Create a Trigger Map
- Initialize a scenario
- Sketch your first page
- Generate specifications
Time: 5 minutes
Step 1: Start WDS
npm start
Agent: "Welcome to Whiteport Design Studio! Ready to start?"
Step 2: Create Trigger Map
You: "Let's create a Trigger Map for a dog walking app"
Agent: "Great! Who is your primary target group?"
You: "Parents who struggle with family dog care coordination"
Agent: "What triggers their need?"
You: "Family conflict over who walks the dog"
Agent: "What outcome do they want?"
You: "Accountability without nagging"
✅ Trigger Map created
Step 3: Initialize Scenario
Agent: "What feature delivers the most value to parents?"
You: "Family dog walk calendar"
Agent: "Where do they first encounter this?"
You: "Google search - frustrated with conflict"
Agent: "What's the shortest path to mutual success?"
You: "Landing → Sign up → Family setup → Calendar → First walk"
✅ Scenario initialized
Step 4: Sketch First Page
Agent: "Let's start with the Landing page. Upload your sketch."
You: [Upload sketch]
Agent: "I see: Header, Hero section, How it works, Sign up CTA.
Should I analyze these sections?"
You: "Yes"
✅ Sketch analyzed
Step 5: Generate Specifications
Agent: "Based on your Trigger Map:
- Target: Parents (tired of nagging)
- Trigger: Family conflict
For the Hero section, I suggest:
Headline: 'Stop Nagging. Start Harmony.'
Does this address their frustration?"
You: "Perfect!"
✅ Specifications generated
What Just Happened?
You created conceptual specifications in 5 minutes:
- Connected to user psychology (Trigger Map)
- Grounded in real context (Scenario Init)
- Generated with AI assistance (Agent collaboration)
- Preserved your thinking (Conceptual specs)
Next Steps
Learn the Concepts
Learn WDS Course - Deep dive into WDS methodology
Start Your Project
Workflows Guide - Full workflow documentation
Get Help
Community - Join the WDS community