[DESIGN] Create Mission Wizard (founder)

[Kaylahray]

Description

Design the full Create a quest flow for founders: a multi-step creator (side panel / overlay on the Quests hub) with autosave, draft, preview, and publish — including success confirmation. Six steps, not a single form.

User Story

As a Founder (Creator),
I want a guided Create a quest flow,
so that I can define basics, eligibility, tasks, rewards, schedule, and publish with a clear funding summary before going live.

Requirements and Context

• Entry: “+ Add new Quest” from Quests hub; wizard as large right panel/overlay (Quests hub dimmed behind)
• Top bar: “Exit creator” · “Saved” indicator (checkmark when autosaved)
• Title: “Create a quest”
• Stepper (6 steps) — completed = checkmark; current = purple filled; upcoming = muted
  1. Basics
  2. Eligibility
  3. Tasks
  4. Rewards
  5. Schedule
  6. Review & publish
• Footer (all steps): Back (when applicable) · Preview · Save as draft · Continue (disabled until required fields valid) · on last step primary becomes Publish quest
• Step 1 — Basics
  • Quest type cards: Product testing (selected) vs Community participation
  • Title (0/90) · Description
  • Est. completion duration · Participant limit · Visibility
• Step 2 — Eligibility
  • Who can participate
  • Max submissions per participant · Eligible countries/regions
  • “Previous winners can participate” checkbox
  • Advanced eligibility (expandable) + additional requirement textarea
• Step 3 — Tasks
  • Helper copy about clear questions / useful evidence
  • Reorderable task blocks: type (Paragraph / Upload / …), title, participant instructions, Required toggle, delete
  • “+ Add task block”
• Step 4 — Rewards
  • Reward method (e.g. Selected winners)
  • Total reward budget · Number of winners · Reward per winner
  • Summary: Total required balance · Available wallet balance · Remaining balance
  • Fee line: platform fee + network fee estimate (estimates until distributed)
• Step 5 — Schedule
  • Publish immediately vs Schedule for later
  • Start · Closing · Time zone · Winner announcement
  • “Close automatically when participant limit is reached”
• Step 6 — Review & publish
  • Summary cards: details, eligibility, rewards, numbered tasks
  • Est. completion callout
  • Primary: Publish quest
• Success modal
  • “Quest Published Successfully”
  • Supporting copy
  • Close · View quest (primary)
• Desktop + tablet (+ mobile treatment for panel/full-screen)
• Component inventory + asset exports; Figma URL on issue

Suggested Implementation

1. Frame wizard shell: overlay, exit, Saved, stepper, footer actions
2. Frame all 6 steps with filled + error/disabled Continue states
3. Frame Publish success modal over Quests hub
4. Spec tablet/mobile panel behavior
5. Inventory components (stepper, type cards, task block, reward summary, success modal)

Acceptance Criteria

• Figma link + node URL posted
• All 6 steps designed with Continue/Publish footer patterns
• Rewards balance + fee estimate UI specified
• Review summary + success modal included
• Overlay relationship to Quests hub shown
• Component inventory documented

Submission Guidelines

• Branch: design/create-quest-wizard
• Depends on: [DESIGN] Creator Quests hub (wizard entry from hub)
• PR: docs(design): Create a quest wizard

[Glam26]

Hi! I'd like to work on this.

My plan is to:

• Review the existing implementation and identify the accessibility gaps described in the issue.
• Implement the required semantic and ARIA improvements while preserving the current UI and behavior.
• Add or update tests covering the new accessibility behavior and edge cases.
• Run the project's linting, test suite, and build to ensure there are no regressions.
• Open a PR with a summary of the implementation, test results, and any relevant notes.

Looking forward to contributing!

[Fabluchy]

I’m interested in contributing to this task because I enjoy designing user-centric workflows that simplify complex processes. I have experience working with data-driven applications and intuitive interfaces, and I’d like to help create a seamless Mission Wizard that enables founders to easily create, configure, and launch missions with a clear and engaging experience.

[SaintSammi]

Hi, Let me handle this issue.

I have seen the designs and I believe I can deliver the best for this!

[grantfox-oss]

🦊 GrantFox — @SaintSammi has been assigned to this issue as part of the Official Campaign | FWC26 campaign!

Next steps:

1. Open a Pull Request referencing this issue (e.g., Closes #258)
2. Your PR will be reviewed by the Quid-proquo maintainers

Good luck! Track your progress on GrantFox.

[grantfox-oss]

🎉 This issue has been marked as completed on GrantFox as part of the Official Campaign | FWC26 campaign!

@SaintSammi's PR #273 was approved and merged by @Kaylahray.

🏆 @SaintSammi: You earned 35 FoxPoints for this contribution! Your current tier: Explorer (166 total points). Track your full progress on GrantFox.

👏 Great work, @SaintSammi! Keep contributing to Quid-proquo.