wordle/.claude/skills/wds-4-ux-design/data/page-creation-flows/workshop-c-placeholder-pages.md

Workshop C: Placeholder Pages

Trigger: User wants to quickly map out a scenario structure without full specifications

---

WORKSHOP GOAL

Rapidly create placeholder page documents with:

• Navigation structure
• Page names
• Page purposes
• Scenario context

This gives clarity to the overall flow before diving into detailed specifications.

---

PHASE 1: TRIGGER DETECTION

**Let's map out your scenario structure!** Sometimes it helps to create placeholder pages first - just the names, purposes, and navigation - before diving into detailed specifications. This gives you a clear roadmap. Would you like to: - Create placeholders for a whole scenario flow - Add individual placeholder pages as you plan Let's start! 📋

---

PHASE 2: SCENARIO CONTEXT

Determine scenario context:

• Read project structure from wds-workflow-status.yaml
• Check existing scenarios
• Determine if working with existing or new scenario

Which scenario are we mapping out?

{{#if existing_scenarios}} Existing scenarios: {{#each scenario in existing_scenarios}}

• {{scenario.number}}: {{scenario.name}} {{/each}}

Type scenario number or "new" for a new scenario: {{else}} This will be your first scenario. What should we call it?

Scenario name: {{/if}}

Store scenario_number and scenario_name

---

PHASE 3: FLOW MAPPING

**Great! Let's map out the pages in this flow.** Think about the user journey through "{{scenario_name}}"

How many pages will be in this scenario?

Think about the steps a user goes through:

• Entry point / first page
• Middle steps (actions, decisions, inputs)
• Completion / exit page

Number of pages:

Store pages_count

---

PHASE 4: PAGE ENUMERATION

**Perfect! Let's name and define each page.** I'll guide you through {{pages_count}} pages...

For each page, gather:

1. Page name (examples: "Start Page", "Sign In", "Checkout")
2. Page purpose (1-2 sentences: what user accomplishes)
3. User situation (what just happened, what they're trying to do)

Store page_name, page_purpose, user_situation for each page

---

PHASE 5: FLOW REVIEW

**Here's your complete scenario flow:** **Scenario {{scenario_number}}: {{scenario_name}}** [Display numbered list of all pages with purposes] Does this flow make sense? Any pages missing or in wrong order?

Review the flow:

• Type "good" to proceed
• Type "add" to insert a page
• Type "remove N" to remove page N
• Type "move N to M" to reorder

Action:

---

PHASE 6: GENERATE DOCUMENTS

**Perfect! Creating your placeholder pages now...**

For each page in pages_list:

1. Create folder structure with sketches subfolder
2. Generate placeholder document using template
3. Create scenario overview document
4. Create scenario tracking file

See: placeholder-templates.md for all templates

---

PHASE 7: COMPLETION

✅ **Placeholder pages created!** **Scenario:** {{scenario_number}} - {{scenario_name}} **Created:** - {{pages_list.length}} page folders with navigation - {{pages_list.length}} placeholder documents - 1 scenario overview document - 1 scenario tracking file **Next Steps:** 1. **Add sketches** - Upload visuals for each page 2. **Complete specifications** - Run Workshop A (Sketch Analysis) for each page 3. **Add more pages** - Come back and add pages to this scenario 4. **Create another scenario** - Start a new user journey **Ready to work on a specific page?** Pick a page to work on: [1-N] Page name [N] Add another scenario [D] Done for now Choice:

---

ROUTING

Based on user choice:

• If user picks a page number → Route to Workshop B (Sketch Creation) for that page
• If user selects [N] → Route to scenario-init workshop
• If user selects [D] → Return to main UX design menu