ldy26098
/
BMAD-METHOD
mirror of https://github.com/bmad-code-org/BMAD-METHOD.git
1
0
Fork 0
Code Packages Projects Releases Wiki Activity
BMAD-METHOD/docs/examples/WDS-Presentation/docs/1-project-brief/01-product-brief.md

41 KiB
Raw Blame History

WDS Presentation Page - Product Brief

Project: WDS Official Presentation Page
Date: December 24, 2025
Author: Saga WDS Analyst Agent
Status: Complete

Project Structure

Type: simple_website
Description: Single-page marketing site with multiple content sections
Scenarios: single
Pages: single (with potential variants)

This is a simple website project with a single primary landing page. The page contains multiple sections but represents one continuous user journey. Future variants (e.g., for different audiences) may be added as page variants.

Delivery Configuration

Format: WordPress Markup
Target Platform: WordPress CMS (Whiteport.com)
Requires PRD: No

Delivery Description:
Ready-to-paste WordPress page editor code with properly formatted blocks, content sections, and embedded media. No separate PRD phase needed since the specifications translate directly to WordPress implementation.

Deliverables:

  • WordPress editor code blocks (headings, paragraphs, lists, tables)
  • YouTube embeds with proper shortcodes
  • Image placements with alt text
  • Links formatted as WordPress links
  • Paste-ready content sections

Project Vision

Create the official WDS presentation page for Whiteport.com that serves as the entry point for designers and entrepreneurs to understand, learn, and adopt the WDS methodology.

Primary Audience: Designers (UX, product, visual)
Secondary Audience: Entrepreneurs, system owners, clients

Core Message: WDS is an end-to-end design methodology that makes designers indispensable by delivering value through structured, actionable specifications, through responsibility and excellence.

Positioning Statement

For designers and design consultants who need to deliver exceptional value and maintain creative control in the AI era, WDS (Whiteport Design Studio) is an end-to-end design methodology that transforms design thinking into AI-ready specifications that preserve intent and enable perfect implementation. Unlike rapid prototyping tools or AI code generators that only handle fragments of the design process, WDS provides the complete journey from product vision to development handoff, making designers indispensable strategic leaders rather than replaceable pixel pushers.

Breakdown:

  • Target Customer: Designers (UX, product, visual) and design consultants who serve clients/teams
  • Need/Opportunity: Deliver exceptional value and maintain creative control despite AI disruption
  • Category: End-to-end design methodology with AI-augmented workflow
  • Key Benefit: Transforms design thinking into AI-ready specifications that preserve intent and enable perfect implementation
  • Differentiator: Unlike tools that handle fragments (prototyping, wireframing, code generation), WDS provides complete journey from vision to handoff, making designers strategic linchpins

Secondary Positioning (For Entrepreneurs/Clients):

For entrepreneurs and product owners who want products that truly succeed, WDS is a structured design foundation that delivers excellence through proven best practices and designer-led strategy. Unlike quick-fix approaches that create technical debt, WDS ensures every element serves business goals and user needs from day one, building products that work, scale, and win in the market.

Business Model

Type: Free and Open-Source (Community-Driven)

Revenue Model for Whiteport:

  • WDS is completely free with no cost barriers or subscriptions
  • Whiteport generates revenue through:
    • Design consulting services using WDS methodology
    • Client projects that benefit from WDS structure
    • Training and workshops (optional, not required)
    • Speaking and thought leadership opportunities

Sustainability Strategy:

  • Community contributions and feedback improve methodology
  • Real-world client projects validate and refine WDS
  • Open-source model attracts talented designers to Whiteport ecosystem
  • Establishes Mårten/Whiteport as thought leaders in AI-era design

Mission: Give designers everywhere the tools to thrive in the AI era, making design expertise more valuable rather than obsolete.

Project Background & Complexity

The Challenge We're Solving

This page must address multiple complex positioning challenges simultaneously:

For Designers - The Paradigm Shift:

WDS represents an evolution in how designers work—expanding the designer's role from creator to strategic leader who owns the complete product journey.

  • A methodology, not just a tool: While most AI tools on the market cover a fraction of the modern design process (prototyping, wireframing, handoff), WDS gives you the complete journey from idea to maintenance. This isn't about adding another tool to your stack—it's about elevating how you approach your entire craft and the value you deliver.

  • Moving into the codebase: Traditional design happens in visual tools (Figma, Sketch, Adobe). WDS invites designers to "move into" the codebase itself—working in IDEs and GitHub where your work lives alongside code. This puts you at the center of the action, where design decisions have immediate impact. While this represents a shift from familiar visual tools, it positions you as a true partner in the development process.

  • Text-based power: Working in text-based environments unlocks remarkable capabilities: version control, collaboration at scale, AI assistance, and specifications that travel directly from your mind to implementation. Yes, it's different from visual software where you "touch and feel" designs, but it's powerful precisely because it removes barriers between your thinking and the final product. We embrace this honestly—it's a skill worth learning because of what it enables.

  • The call to leadership: We're not positioning WDS as "simple and intuitive." Instead, we're inviting designers to step into leadership—taking ownership of product success from vision to delivery. The right designers will embrace this opportunity to go "pro," serving as linchpin actors who bridge business goals and user needs. This is where design becomes indispensable.

The Designer Profile We Seek:

We're looking for designers who:

  • See both business goals and user goals clearly
  • Have a bleeding passion for creating the optimal meeting between them
  • Wish to serve clients and teams by becoming linchpin actors
  • Are willing to stand up and take responsibility for product success
  • Understand that sometimes fast stands in the way of what matters
  • Aiming at delivering real value, not ust quick fixes

Key Message: "WDS is for people who means business."

For Entrepreneurs/Clients - The Path to Real Success:

Entrepreneurs and clients are discovering that lasting product success comes from structured, detail-focused approaches.

  • The foundation of success: Services that truly work deliver both function and beauty—depth and attention to detail from the start create products that fly. Screen by screen, interaction by interaction, you build something that works reliably and delights users.

  • The designer as strategic partner: When you're navigating complex product decisions, a skilled designer serves as your strategic guide. The designer's process provides clarity and direction, using craft perfected through decades and amplified by AI capabilities.

  • WDS as your foundation: Think of WDS as your strategic foundation—structured, nutritious, exactly what your project needs. It delivers excellence through proven best practices, ensuring every element serves your business goals and user needs.

  • Attention to detail creates results: Starting with clear structure and specifications means you build once, build right. You get products that work, that scale, that succeed in the market.

Key Message: "WDS delivers the structured excellence that drives real product success."

Our Positioning Approach

We balance important messages to serve both audiences effectively:

  • Acknowledge the learning curve while highlighting the empowerment it brings
  • Be realistic about effort while showing the structure that makes it achievable
  • Focus on WDS benefits while respecting that different approaches serve different needs
  • Invite to responsibility while celebrating the leadership opportunity
  • Show depth and capability while providing clear entry points for beginners
  • Serve both audiences (designers + entrepreneurs) with messages that reinforce each other

Our Communication Strategy

No Criticism of Other Technologies: We focus entirely on WDS benefits and what it enables. Every tool has its place; WDS serves those ready for end-to-end structured design.

Lead with Value: The power comes from being IDE-based with agents that can be molded and enhanced for each project or organization. This flexibility and depth creates remarkable possibilities.

Truth with Optimism: We're honest that this represents growth and learning. But we emphasize the value, show the clear path forward, and celebrate what becomes possible when designers take this step.

Target Users

Primary Audience: Designers

Profile:

Designers (UX, product, visual, service) who:

  • See both business goals and user goals clearly
  • Have a bleeding passion for creating optimal solutions that serve both
  • Wish to become linchpin actors in their teams/organizations
  • Are willing to stand up and take responsibility for product success
  • Understand that sometimes fast stands in the way of what matters
  • Aim at delivering real value, not just quick fixes
  • Want to thrive (not just survive) in the AI era

Experience Level:

  • Experienced consultants/senior designers (primary): Years of design wisdom that WDS helps scale and preserve
  • Growth-minded mid-level designers: Ready to step into strategic leadership roles
  • Design teams at agencies/consultancies: Looking for structured methodology that delivers consistent excellence

Current Situation:

  • Feeling threatened by AI tools that can "do design"
  • Frustrated by design intent getting lost in handoffs
  • Want to deliver more value but struggle with scalability
  • Seeking to differentiate themselves as AI becomes ubiquitous
  • Desire deeper client relationships as strategic partners, not just service providers

What They're Looking For:

  • A methodology that makes them indispensable
  • Tools that amplify (not replace) their expertise
  • Structure that enables faster delivery without compromising quality
  • Way to preserve design thinking through to implementation
  • Path to becoming strategic leaders in organizations

Key Message for Designers: "WDS is for people who mean business."

Secondary Audience: Entrepreneurs & Product Owners

Profile:

Entrepreneurs, startup founders, and product owners who:

  • Are building products with real market ambitions
  • Understand that quality and structure matter for success
  • Want to avoid the "fast but broken" trap
  • Need structured excellence but may lack design expertise
  • Are willing to invest time in foundations that pay off long-term
  • Value strategic partnerships with designers who guide product success

Experience Level:

  • First-time founders: Need guidance and structure to avoid common pitfalls
  • Experienced entrepreneurs: Know the value of detail and strategic design
  • Product owners at companies: Responsible for product success and team coordination

Current Situation:

  • Overwhelmed by product decisions and uncertainty
  • Seeing competitors move fast but want to build something that lasts
  • Frustrated by past experiences where design didn't translate to working product
  • Looking for clear process that reduces risk and uncertainty
  • Need designer as strategic partner, not just visual executor

What They're Looking For:

  • Structured path from idea to working product
  • Design process that delivers business results
  • Partner who takes ownership of product success
  • Reduced risk through proven methodology
  • Way to build products that work reliably from day one

Key Message for Entrepreneurs: "WDS delivers the structured excellence that drives real product success."

Success Criteria

Page Launch Success (0-3 Months):

  1. Traffic & Engagement

    • 1,000+ unique visitors to WDS page in first month
    • Average time on page: 3+ minutes (indicates engagement with content)
    • 40%+ scroll to course modules section
    • 20%+ click-through to GitHub repository

  2. Repository Growth

    • 500+ GitHub stars within 3 months
    • 100+ repository clones per month
    • 50+ active watchers

  3. Course Engagement

    • 200+ Module 01 video views in first month
    • 100+ Module 02 video views in first month
    • 50+ users complete installation successfully

  4. Community Building

    • 100+ Discord server members in 3 months
    • 20+ active community participants (asking questions, sharing work)
    • 5+ testimonials from early adopters

Business Impact for Whiteport (3-12 Months):

  1. Thought Leadership

    • Mårten recognized as expert in AI-era design methodology
    • 3+ speaking invitations or conference proposals
    • 10+ articles/blog posts referencing WDS methodology

  2. Client Acquisition

    • 5+ qualified client inquiries directly attributed to WDS page
    • 2+ new client projects using WDS methodology
    • Client testimonials highlighting WDS-structured approach

  3. Designer Adoption

    • 500+ designers have tried WDS (based on GitHub clones + course views)
    • 100+ designers actively using WDS for projects
    • 10+ case studies from real projects
    • 20+ community contributions (feedback, improvements, examples)

Measurement Methods:

  • Google Analytics for page metrics
  • GitHub insights for repository activity
  • YouTube analytics for course engagement
  • Discord metrics for community growth
  • Client inquiry tracking in Whiteport CRM
  • Quarterly surveys to active users

Timeline: Targets measured at 1 month, 3 months, 6 months, and 12 months post-launch.

Competitive Landscape

Direct & Indirect Alternatives

1. Traditional Design Tools (Figma, Sketch, Adobe XD)

What they do well:

  • Visual, intuitive interface designers love
  • Real-time collaboration
  • Component libraries and design systems
  • Industry standard with massive adoption

Where they fall short:

  • Design handoff loses intent and context
  • No structure for "why" behind decisions
  • Separate from development workflow
  • Limited guidance on methodology/process
  • Don't address strategic thinking or specifications

Why users might choose them:

  • Familiar visual workflow
  • No learning curve for text-based work
  • Industry standard (client expectations)

2. AI Code Generators (V0.dev, Bolt.new, Lovable.dev)

What they do well:

  • Fast prototyping from prompts
  • Immediate code output
  • Low barrier to entry
  • Impressive demos

Where they fall short:

  • No methodology or strategic thinking
  • Design intent easily lost in prompts
  • Fragmented approach (no end-to-end journey)
  • Hallucination issues without clear specifications
  • No designer leadership or ownership
  • Focus on speed over depth and quality

Why users might choose them:

  • Quick results for simple projects
  • Low learning curve
  • Impressive initial demos

3. Design-to-Code Tools (Anima, Framer)

What they do well:

  • Bridge design and code
  • Export working prototypes
  • Reduce manual coding work

Where they fall short:

  • Limited to UI translation (no methodology)
  • No strategic or analytical phases
  • Don't preserve "why" behind decisions
  • Fragmented solution (only one piece of journey)

4. Traditional Design Agencies

What they do well:

  • Full-service design and strategy
  • Experienced teams
  • Proven client relationships

Where they fall short:

  • Often don't leverage AI effectively
  • Inconsistent methodology across teams
  • Expensive and slow
  • Handoff still problematic

Why clients might choose them:

  • Reputation and portfolio
  • Full-service convenience
  • Established trust

5. DIY Approach / No Methodology

What entrepreneurs do:

  • Jump straight to building
  • Use AI tools without structure
  • Learn by trial and error

Where this falls short:

  • High failure rate
  • Technical debt from lack of planning
  • Design decisions made reactively
  • Expensive pivots and rebuilds

Market Positioning

WDS Unique Position:

WDS is the only end-to-end design methodology that:

  • Provides complete journey (vision → specifications → handoff)
  • Preserves design thinking through conceptual specifications
  • Makes designers strategic linchpins (not replaceable executors)
  • Built on proven 25-year methodology (BMad Method)
  • Free and open-source (no cost barriers)
  • AI-augmented but designer-led
  • Works within development workflow (IDE-based)

Market Gap WDS Fills:

Most tools solve fragments of the design challenge:

  • Figma: Visual design
  • V0: Quick code generation
  • Framer: Prototyping

WDS solves the complete journey while making designers indispensable.

Unfair Advantage

What WDS Has That Competitors Cannot Easily Copy:

  1. 25 Years of Proven Methodology (BMad Method Foundation)

    • WDS built on battle-tested development framework
    • Decades of real-world project experience baked in
    • Integration between design (WDS) and development (BMM) is seamless
    • Competitors would need to build entire ecosystem from scratch

  2. Mårten's Unique Expertise

    • 25 years of design experience
    • Deep understanding of both design AND development
    • Track record: Dog Week project (26 weeks → 5 weeks, better quality)
    • Authentic voice as practitioner, not just theorist
    • Real agency experience with paying clients

  3. True Designer Leadership Philosophy

    • Not trying to replace designers or make design "easy"
    • Positioning designers as strategic linchpins
    • Authentic respect for craft and expertise
    • "WDS is for people who mean business" - attracts serious practitioners

  4. Complete Integration (Not Fragmented)

    • Only solution that covers idea → maintenance
    • Conceptual specifications unique approach
    • Design system + scenario design + PRD all connected
    • Seamless handoff to development (BMM agents)

  5. Open-Source Community Model

    • Free removes adoption barriers competitors can't match
    • Community contributions improve methodology
    • Goodwill and thought leadership difficult to replicate
    • Network effects as more designers adopt

  6. IDE-Based Approach

    • Puts designers in the codebase (true strategic partners)
    • Access to AI capabilities that visual tools can't match
    • Version control and collaboration at code level
    • Future-proof as AI development accelerates

  7. Real-World Validation

    • Dog Week case study proves 5x productivity
    • Built from actual client work (not theoretical)
    • Continuously refined through Whiteport projects
    • Authentic testimonials from real projects

The Moat:

Even if competitors copy individual features, they cannot replicate:

  • The 25-year foundation and ecosystem integration
  • Mårten's authentic expertise and reputation
  • The complete philosophical framework
  • The community and network effects
  • The proven real-world results

This combination creates a sustainable competitive advantage.

Current Page Analysis & Constraints

Reference: Existing WDS Course Page

Current WDS Page Structure

The current page (shown above) is built on WordPress and serves as a template for the WDS course presentation. This existing structure provides both opportunities and constraints for our new page.

Current Page Structure

1. Header & Navigation

  • Whiteport logo (left)
  • Navigation menu: Start, Agency, Projects, Services, Solutions, Manifesto, Blog, Contact
  • Social media icons (right)

2. Hero Section

  • Deep blue background with illustration
  • Large headline: "Whiteport Design Studio, WDS"
  • Tagline: "FREE AND OPEN SOURCE DESIGN AND STRATEGY AI AGENTS FOR OCDACID DESIGNERS EVERYWHERE!"
  • Body text explaining the course concept
  • Primary CTA button: "GET INFO 2025. FREE AT GITHUB"

3. Benefits Section (Three Columns)

  • Pink/purple icons
  • Three value propositions:
    • "Master sketching by hand"
    • "Solve problems together"
    • "Prompt more effectively"
  • Each with descriptive text
  • Blue link at bottom: "FOLLOW THE 5000 PEOPLE WHO LEARNED HOW TO SKETCH BY HAND WITH MASTER ANENER, THE FOUNDER OF WHITEPORT"

4. Two-Column Section

  • Left column: "Whiteports Design Studio"
    • "For designers everywhere"
    • "Get given here" (text area for main content)
  • Right column: "Course program"
    • Course description
    • Session listings (1-4) with pink circular icons
    • Session titles and descriptions
    • Blue CTA button: "CLAIM YOUR SEAT NOW"

5. "Get your seat now!" Section

  • Three checkmarks with benefits:
    • "Choose your time and place"
    • "Get a supportive network"
    • "Get your personal follow up & feedback"
  • Large pricing: "190€"
  • Blue button: "CLAIM YOUR SEAT NOW!"
  • PayPal logo
  • "LET US KNOW YOUR INVOICE DETAILS"

6. Footer Section

  • Dark blue background
  • "Contact us" heading
  • About text (left side)
  • Two circular profile photos (Mårten and colleague)
  • Contact details: Names, titles, emails, phone numbers
  • Bottom bar: Copyright, social links

Constraints We Must Work Within

Technical Constraints:

  1. WordPress Platform

    • Must work within WordPress page editor capabilities
    • Limited to WordPress formatting options
    • Need paste-ready editor code for quick deployment

  2. Template Reuse

    • Using existing template structure to reduce development cost
    • Cannot do major structural changes
    • Must adapt content to fit existing layout patterns

  3. Left Column Content Area

    • Main editable area is left column in two-column section
    • This is where we'll place most custom content
    • WordPress editor code must be carefully formatted for this area

Design Constraints:

  1. Fixed Layout Elements

    • Header section (top) - Fixed
    • Three-column benefits/values section (below header) - Fixed
    • Two-column main content area:
      • Right column: Fixed structure for lists (course modules, artifacts, steps, etc.)
      • Left column: Flexible content area for main explanation and concepts

  2. Existing Visual Language

    • Deep blue hero background
    • Pink/purple accent colors for icons
    • Illustration style (person with tablet)
    • Blue CTA buttons
    • Circular profile photos

  3. Layout Patterns

    • Hero with right-side illustration
    • Three-column benefit cards (fixed position)
    • Two-column main content area (right column lists, left column flexible)
    • Stacked module/item listings with icons (right column)
    • Pricing/CTA section (to be adapted)
    • Footer contact section

Content Constraints:

  1. Pricing Section

    • Current page has pricing (190€)
    • WDS is free and open-source
    • Need to adapt this section for different purpose (perhaps "Get Started" CTAs instead)

  2. Course vs. Method Page

    • Current page is course-focused
    • Our page is method presentation + course access
    • Must balance methodology explanation with course promotion

  3. Session Listings

    • Current format shows 4 sessions
    • We have 17+ modules (though only 2 complete)
    • Need to show completed modules + indicate more coming
    • May need to adapt visual presentation

Opportunities Within Constraints

Fixed Elements Working for Us:

  1. Header Section: Perfect for WDS positioning message and primary navigation
  2. Three-Column Benefits: Ideal for "The WDS Difference" key benefits (fixed, prominent position)
  3. Right Column Lists: Can present course modules, WDS phases/artifacts, installation steps, or other structured content
  4. Left Column: Flexible space for methodology explanation, agents, BMad foundation, man-in-the-loop concept, etc.
  5. Footer Contact: Good for Mårten bio and Whiteport information

Flexibility Within Structure:

  • Left column content can be organized in any sequence
  • Right column can showcase different types of lists depending on what serves users best
  • We can adapt the pricing/CTA section for multiple "Get Started" paths

Creative Solutions We'll Use:

  1. Course Modules in Tables: WordPress table formatting within the left column presents course modules with YouTube embeds, descriptions, and GitHub links in an organized, accessible way

  2. Agent Presentations: Heading hierarchy + formatted text in left column introduces each agent with personality and role, making them relatable and approachable

  3. Installation Checklist: WordPress checklist or ordered list formatting with links to Module 02 lessons breaks down setup into manageable steps

  4. Testimonials: Adapt the three-column section or create new section using WordPress column blocks to showcase user experiences

  5. BMad Method Subsection: Nested headings and formatted text explain the solid foundation WDS is built upon

Deliverable Requirements

To work within these constraints, our specifications must include:

  1. WordPress Editor Code Blocks

    • Ready to copy-paste into WordPress page editor
    • Properly formatted headings (H2, H3, H4)
    • Links formatted as WordPress links
    • Lists (ordered, unordered, checklists) in WP format
    • Tables for course modules (if needed)
    • YouTube embeds with proper WP shortcode

  2. Content Sections Mapped to Template Areas

    • Hero content (headline, tagline, body, CTA text)
    • Three-column benefits content
    • Left column main content (methodology, agents, installation)
    • Right column course modules (adapted session format)
    • Adapted pricing/CTA section (free, get started)
    • Footer content (bio, contact)

  3. Visual Element Specifications

    • Icon selections (where needed)
    • Image placements
    • Button text and links
    • Color usage (within existing palette)

Success Criteria Considering Our Approach

The page succeeds when:

  1. Communicates WDS Value clearly within template structure, showing what becomes possible
  2. Presents Course Modules effectively in session listing format, making learning accessible
  3. Explains Methodology engagingly in left column content area, inviting exploration
  4. Maintains Visual Consistency with existing Whiteport design language, feeling cohesive
  5. Provides Paste-Ready Code that works immediately in WordPress, enabling quick deployment
  6. Delivers Efficiently by reusing template (smart use of resources)
  7. Allows Future Growth as more course modules complete and community expands

Content Concepts & Information Architecture

Using Action Mapping model to identify user actions and required information for each content concept. These concepts can be organized and sequenced during the design phase.

CONCEPT: INITIAL ORIENTATION

Reference Sketch:

Hero Section Concept

User Action Goal: Understand what WDS is and decide to explore further

What Users Need to Learn:

  • What WDS is (in one clear statement)
  • Who should care about it
  • Why it matters (value proposition)
  • Where to go next

Information to Provide:

  • Clear statement of what WDS is
  • Who it's for (designers, entrepreneurs)
  • The paradigm shift (design → specification → product)
  • Value statement: Why this matters (responsibility, excellence, results)
  • Primary path: GitHub repository
  • Secondary path: WDS articles and resources

Visual Elements (from sketch):

  • Illustration showing designer working with specifications/documentation
  • Deep blue background
  • Clear visual hierarchy
  • Right-side illustration area

Success Metric: User understands WDS concept and chooses to explore GitHub or continue reading

CONCEPT: WDS METHODOLOGY EXPLANATION

User Action Goal: Understand the WDS methodology and its foundation

What Users Need to Learn:

  • The paradigm shift in design process
  • That WDS is built on proven BMad Method (credibility)
  • The relationship between design (WDS) and development (BMM)
  • That this is a serious, established methodology with 25 years of experience

Information to Provide:

The Paradigm Shift

  • The design becomes the specification
  • The specification becomes the super-prompt
  • The code is just the execution

What WDS Delivers

  • End-to-end solution (idea → maintenance)
  • Design and specifications that become super-prompts AI can execute perfectly
  • Designer as linchpin (bridge business + user needs)
  • Why-based design instructions (WHAT + WHY + WHAT NOT TO DO)

How AI Amplifies Your Expertise:

Even experienced consultants with decades of design knowledge benefit at this stage:

  • You define the vision - AI helps structure and document it systematically
  • You make strategic calls - AI ensures nothing gets lost in translation
  • You bring wisdom - Your design and specifications become executable super-prompts
  • Your years of experience become amplified - do what used to take weeks in hours

Built on Solid Foundation

  • WDS is built on BMad Method (established development methodology)
  • Mårten's 25 years of design experience added to proven framework
  • In v6: BMM module handles development, WDS handles design
  • The integration is seamless and complete
  • Brief explanation of BMad Method (AI-augmented development framework)
  • Open-source, proven, serious methodology
  • Link to BMad Method documentation

Success Metric: User trusts WDS credibility and understands the ecosystem

CONCEPT: KEY BENEFITS

User Action Goal: Quickly grasp the three key benefits

What Users Need to Learn:

  • WDS is comprehensive (not just one tool)
  • Specifications are immediately actionable
  • Designers become strategic leaders (linchpins)

Information to Provide:

Benefit 1: End-to-End Solution

  • Not rapid prototyping or single-purpose tool
  • Full journey: idea → specification → development → maintenance
  • Designers work in codebase, not separate from it

Benefit 2: Design + Specifications = Super-Prompts

  • Your design and specifications become instructions AI can execute perfectly
  • No interpretation needed - your intent is preserved
  • Unified IDs, error states, multi-language content included
  • Years of design wisdom translated into executable super-prompts

Benefit 3: Designer as Linchpin

  • Bridge business goals and user needs
  • Ownership of product success
  • Serve team as strategic guide

Success Metric: User sees unique value and wants to learn more

CONCEPT: THE AGENTS

User Action Goal: Understand how agents guide through phases and relate to them as teammates

What Users Need to Learn:

  • WDS uses specialized agents for different phases
  • Each agent has personality, expertise, and specific role
  • Agents guide, don't dictate
  • The phases are covered through agent collaboration

Information to Provide:

Each agent needs:

  • Name + icon + tagline
  • Role/personality description (relatable, human)
  • Phases they guide
  • What you create together
  • Why this agent matters

Saga the Analyst 📚

"The one who tells your product's strategic story"

  • Role: Business Analyst + Product Discovery Expert
  • Phases: Product Brief, Trigger Mapping
  • Creates: Strategic foundation, target users and personas, business goals connected to user needs, trigger maps

How AI Amplifies Your Strategic Thinking:

Even with years of consulting experience:

  • You bring insights from deep user research knowledge
  • Saga structures those insights systematically
  • You guide discovery with strategic wisdom
  • AI ensures nothing gets lost in translation
  • Your expertise creates richer analysis, delivered faster

Freya the Designer ✨

"The one who brings clarity through design"

  • Role: UX Designer + Design System Expert
  • Phases: UX Design (Scenarios), Design System (optional)
  • Creates: Page designs with unified IDs, interactive prototypes, specifications that become super-prompts AI can implement

How AI Scales Design Excellence:

Experienced designers benefit from:

  • You sketch and conceptualize - Freya analyzes and structures
  • You make creative decisions - AI documents them as detailed specifications
  • You define interactions - Your design + specifications become implementation-ready super-prompts
  • You bring design intuition - AI scales it into comprehensive documentation
  • Decades of UX wisdom becomes executable by AI

Idunn the PM ⚔️

"The strategic leader who plans the path forward"

  • Role: Product Manager + Technical Planner
  • Phases: Platform Requirements, PRD Finalization
  • Creates: Technical architecture, complete PRD (super-prompt for teams), implementation roadmap

How AI Enhances PM Expertise:

Your technical judgment amplified:

  • You make platform decisions - Idunn organizes systematically
  • You define requirements - AI structures for implementation
  • You prioritize features - AI creates actionable sequences
  • Your years of PM experience becomes scalable documentation

Mimir the Orchestrator 🧙

"The wise one who coordinates the whole journey"

  • Role: Project Orchestrator + Workflow Guide
  • Does: Guides through WDS workflow, routes to appropriate agents, keeps project status, helps choose phases
  • Why Mimir: Your entry point and guide through the entire WDS process

Success Metric: User understands agent roles and sees them as helpful guides

CONCEPT: DESIGN TO DEVELOPMENT JOURNEY

User Action Goal: Understand how design deliveries transition to implementation

What Users Need to Learn:

  • Design work flows seamlessly into development
  • BMM agents handle breakdown, development, testing
  • The transition works because specifications are complete
  • WDS + BMM = complete product journey

Information to Provide:

The Complete Journey:

  1. WDS agents guide design phases (you lead, AI supports)
  2. Design + specifications created that become super-prompts (executable by AI or humans)
  3. BMM agents take over for development (your super-prompts guide implementation)
  4. BMM handles: epic breakdown, story creation, implementation, testing
  5. Continuous collaboration (your expertise guides, AI scales execution)

BMM Agents (Brief Introduction):

  • Dev agents: Break down your design and specifications into implementable stories
  • Development agents: Execute your super-prompts into working code
  • QA agents: Test against your design intent
  • Link to BMad Method documentation for details

Why This Matters:

  • You maintain creative control throughout
  • Your design and specifications become executable super-prompts
  • No "lost in translation" - your intent is preserved
  • AI implements perfectly because you defined the "why"
  • Experienced designers deliver more value, faster

Success Metric: User understands complete workflow and sees how WDS fits

CONCEPT: LEARNING RESOURCES (COURSE MODULES)

User Action Goal: Access learning resources and start learning WDS

What Users Need to Learn:

  • Course modules exist to teach WDS step-by-step
  • Modules 01-02 are complete and ready
  • More modules are in development
  • Each module has video, lessons, and GitHub resources

Information to Provide:

For Each Module:

  • Module number/name
  • Status (Complete / In Progress / Coming Soon)
  • YouTube video (if available)
  • Brief description
  • Topics covered
  • Links (GitHub lessons, NotebookLM resources)

Completed Modules:

Module 01: Why WDS Matters

  • Status: Complete
  • Description: Learn why designers are indispensable in the AI era. Understand the paradigm shift.
  • Topics: Factory vs linchpin mindset, AI threats and opportunities, becoming irreplaceable
  • Links to GitHub and NotebookLM resources

Module 02: Installation & Setup

  • Status: Complete
  • Description: Get WDS running. Step-by-step guide to GitHub, IDE setup, and agent activation.
  • Topics: GitHub setup, IDE installation, cloning repository, initializing WDS, activating Mimir
  • Quick checklist available

In Development: Modules 03-17 (list with brief descriptions and "coming soon" status)

Note: "We're developing these modules in collaboration with designers like you. More modules added regularly."

Success Metric: User clicks to watch videos or access GitHub lessons

CONCEPT: GETTING STARTED (INSTALLATION)

User Action Goal: Get WDS installed and ready to use

What Users Need to Learn:

  • The 5 essential steps to get started
  • Each step has detailed instructions available
  • It's achievable and well-supported

Information to Provide:

The 5 Steps: (Each links to detailed Module 02 lesson)

  1. Set Up GitHub Account → Detailed guide available
  2. Install IDE (Cursor Recommended) → Detailed guide available
  3. Clone WDS Repository → Detailed guide available
  4. Initialize WDS in Your Project → Detailed guide available
  5. Activate Mimir Orchestrator → Detailed guide available

Additional Info:

  • Time required: ~30 minutes for complete setup
  • Support available: Discord/Community link, troubleshooting guide

Success Metric: User completes setup or bookmarks checklist for later

CONCEPT: SOCIAL PROOF (TESTIMONIALS)

User Action Goal: Build trust through social proof

What Users Need to Learn:

  • Real designers use and value WDS
  • Results are tangible
  • Community exists

Information to Provide:

Testimonial Structure: (Ready for quotes to be added)

  • Profile photo (circular)
  • Quote text
  • Name
  • Title/Role
  • Company (optional)

Placeholder Content: "Testimonials from designers and teams using WDS will appear here. If you've tried WDS, we'd love to hear your story!"

Link to: Share Your WDS Story

Success Metric: User gains confidence through peer validation

CONCEPT: CALL TO ACTION

User Action Goal: Take immediate action

What Users Need to Learn:

  • Multiple entry points available
  • Choose path based on readiness level

Information to Provide:

Three Primary Paths:

  1. Explore WDS on GitHub

    • Browse repository, read documentation, clone WDS

  2. Start the Course

    • Learn WDS methodology through guided modules

  3. Join the Community

    • Get help, share work, connect with designers

Additional Resources:

  • WDS Workflows Guide
  • Example Projects
  • FAQs

Success Metric: User takes action through one of the three paths

CONCEPT: ABOUT & CONTACT

User Action Goal: Find additional information or contact

Information to Provide:

About:

  • Brief bio of Mårten Angner (creator)
  • Whiteport agency information
  • Mission statement: "Free and open-source for designers everywhere"

Links:

  • GitHub Repository
  • BMad Method
  • Whiteport.com
  • Blog/Articles
  • Contact

Social Media:

  • LinkedIn, Twitter/X, YouTube, Discord

Legal:

  • Open-source license information

Success Metric: User finds needed information or contact method

Page Technical Requirements

Platform: WordPress
Template: Existing WDS Course page template
Editor: WordPress page editor

Specifications Should Include:

  • WordPress editor code (paste-ready)
  • For course modules: YouTube embeds in tables
  • Formatted text with proper headings (H1, H2, H3)
  • Links formatted as WordPress links
  • Button CTAs with proper styling

Deliverable Format:

  • Markdown specification (this document)
  • WordPress editor code blocks (ready to paste)
  • Content in English
  • Links to GitHub, course modules, resources

Success Criteria

Page is successful if:

  1. Designers understand WDS value and credibility (not just another tool)
  2. Entrepreneurs understand how WDS supports their projects
  3. Users can easily find and access course modules
  4. Clear path to installation and first use
  5. Trust is established through BMad foundation and methodology depth
  6. Page loads quickly (WordPress template reuse)
  7. Content is paste-ready for WordPress deployment

Next Steps

  1. ✅ Complete Product Brief (this document)
  2. Next: Create Trigger Map (Phase 2) - Deep dive into user psychology
  3. Create page specifications with content (Phase 4)
  4. Generate WordPress editor code
  5. Test in WordPress staging
  6. Deploy to Whiteport.com

Document Revision History

Version 2.0 - December 27, 2025

  • ✅ Added formal Positioning Statement (primary + secondary)
  • ✅ Added Business Model section (open-source sustainability strategy)
  • ✅ Expanded Target Users with detailed Primary (Designers) and Secondary (Entrepreneurs) profiles
  • ✅ Created SMART Success Criteria with specific metrics and timelines
  • ✅ Added comprehensive Competitive Landscape analysis (5 competitor categories)
  • ✅ Added Unfair Advantage section (7 key differentiators)
  • Status: Complete and ready for Phase 2 (Trigger Mapping)

Version 1.0 - December 24, 2025

  • Initial draft with vision, constraints, content concepts

Document Status: ✅ COMPLETE - Ready for Trigger Mapping Phase
Next Phase: Phase 2 - Trigger Mapping
Last Updated: December 27, 2025