feat(wds): Add Module 02 YouTube show notes
Complete YouTube show notes for Module 02 video: - Optimized title and description for YouTube - Comprehensive timestamps for 30-minute video - Key concepts explained simply - All 4 lessons outlined with timing - Repository structure decision guidance - 8-phase docs structure overview - Common questions answered - Resources and links - Community connection - Mimir introduction - SEO-optimized tags - Pinned comments for engagement Focuses on encouragement and accessibility: - 'You can do this' messaging - Celebrates small wins - Normalizes being a beginner - Clear time expectations - No coding required emphasis Ready for video production!
This commit is contained in:
Mårten Angner
parent
5dbed97413
commit
d6dd21e781
|
|
@ -0,0 +1,268 @@
|
|||
# YouTube Show Notes: Module 02 - Installation & Setup
|
||||
|
||||
**Video Link:**
|
||||
[To be published]
|
||||
|
||||
**Title:**
|
||||
Module 02: Installation & Setup - From Zero to WDS-Ready in Under an Hour
|
||||
|
||||
---
|
||||
|
||||
## Description
|
||||
|
||||
"I've never used GitHub. I've never installed an IDE. I'm worried I'll mess something up."
|
||||
|
||||
Sound familiar? You're not alone. Every designer was once exactly where you are now.
|
||||
|
||||
In this 30-minute guided walkthrough, we take you from complete beginner to fully set up with Whiteport Design Studio - even if you've never touched GitHub, Git, or an IDE before.
|
||||
|
||||
You'll learn:
|
||||
✅ How to create a GitHub account and repository (it's easier than you think!)
|
||||
✅ Installing your IDE workspace (Cursor or VS Code)
|
||||
✅ Cloning your project to your computer
|
||||
✅ Adding WDS to your workspace
|
||||
✅ Meeting Mimir - your personal WDS guide
|
||||
|
||||
This isn't about becoming technical. This is about getting your professional environment set up so you can focus on what matters: designing with confidence.
|
||||
|
||||
**Total setup time:** 45-60 minutes
|
||||
**Prerequisites:** Computer + Internet + Email
|
||||
**Technical experience required:** None
|
||||
|
||||
---
|
||||
|
||||
## Timestamps
|
||||
|
||||
0:00 - Introduction: You Can Do This
|
||||
3:00 - Lesson 01: Git Setup - GitHub Account & Repository
|
||||
11:00 - Lesson 02: IDE Installation - Your Workspace
|
||||
17:00 - Lesson 03: Git Repository Cloning - Getting Your Project
|
||||
22:00 - Lesson 04: WDS Project Initialization - The Magic Happens
|
||||
28:00 - Celebration: Look What You Just Did!
|
||||
|
||||
---
|
||||
|
||||
## Key Concepts
|
||||
|
||||
🔹 **GitHub** - Professional cloud storage with time machine (version history)
|
||||
|
||||
🔹 **Repository (Repo)** - A tracked folder where your project lives
|
||||
|
||||
🔹 **IDE (Integrated Development Environment)** - Your workspace for creating specifications
|
||||
|
||||
🔹 **Git** - The sync engine (auto-installed by your IDE)
|
||||
|
||||
🔹 **Cloning** - Making a local copy of your GitHub repository
|
||||
|
||||
🔹 **Workspace** - Having both your project AND WDS side-by-side
|
||||
|
||||
🔹 **Docs Folder** - Your 8-phase design source of truth
|
||||
|
||||
🔹 **Mimir** - Your WDS orchestrator and guide (@wds-mimir anytime!)
|
||||
|
||||
---
|
||||
|
||||
## The 4 Lessons
|
||||
|
||||
### Lesson 01: Git Setup (15-20 min)
|
||||
- Create GitHub account with professional username
|
||||
- Understand repository structure
|
||||
- Single repo vs separate specs repo decision
|
||||
- Create your first repository
|
||||
- Or join an existing project
|
||||
|
||||
### Lesson 02: IDE Installation (10 min)
|
||||
- Choose Cursor (recommended) or VS Code
|
||||
- Download and install
|
||||
- First launch setup
|
||||
- Sign in with GitHub
|
||||
- Verify terminal works
|
||||
|
||||
### Lesson 03: Git Repository Cloning (10 min)
|
||||
- Create organized Projects folder
|
||||
- Get repository URL from GitHub
|
||||
- Clone with simple terminal command
|
||||
- Let IDE auto-install Git
|
||||
- Open project in workspace
|
||||
|
||||
### Lesson 04: WDS Project Initialization (15-20 min)
|
||||
- Clone WDS repository
|
||||
- Add WDS to workspace (dual folder setup)
|
||||
- Create 8-phase docs structure
|
||||
- Find and activate Mimir
|
||||
- First conversation with your guide
|
||||
|
||||
---
|
||||
|
||||
## Repository Structure Decision
|
||||
|
||||
**Single Repository** (`my-project`)
|
||||
- Specs + code together
|
||||
- Use when: Small team, building yourself, simple communication
|
||||
|
||||
**Separate Specifications Repository** (`my-project-specs`)
|
||||
- Specs only, separate code repo
|
||||
- Use when: Corporate, many developers, clear handoff needed
|
||||
|
||||
**Name your repository based on your choice!**
|
||||
|
||||
---
|
||||
|
||||
## The Docs Structure
|
||||
|
||||
Your 8-phase WDS methodology folders:
|
||||
|
||||
📁 **1-project-brief** - Vision and strategy
|
||||
📁 **2-trigger-mapping** - User psychology and decisions
|
||||
📁 **3-prd-platform** - Product requirements
|
||||
📁 **4-ux-design** - User experience design
|
||||
📁 **5-design-system** - Visual language and components
|
||||
📁 **6-design-deliveries** - Handoff specifications
|
||||
📁 **7-testing** - Validation and iteration
|
||||
📁 **8-ongoing-development** - Evolution and support
|
||||
|
||||
---
|
||||
|
||||
## Resources
|
||||
|
||||
🎓 **WDS Course:** Module 02 - Installation & Setup
|
||||
https://github.com/whiteport-collective/whiteport-design-studio
|
||||
|
||||
📝 **Lesson 01 Checklist:** Git Setup Quick Reference
|
||||
[Link to lesson-01-git-setup/01-quick-checklist.md]
|
||||
|
||||
📝 **Lesson 02 Checklist:** IDE Installation Quick Reference
|
||||
[Link to lesson-02-ide-installation/02-quick-checklist.md]
|
||||
|
||||
📝 **Lesson 03 Checklist:** Repository Cloning Quick Reference
|
||||
[Link to lesson-03-git-cloning/03-quick-checklist.md]
|
||||
|
||||
📝 **Lesson 04 Checklist:** WDS Initialization Quick Reference
|
||||
[Link to lesson-04-wds-initialization/04-quick-checklist.md]
|
||||
|
||||
📥 **Download Cursor:** https://cursor.sh
|
||||
📥 **Download VS Code:** https://code.visualstudio.com
|
||||
📥 **GitHub:** https://github.com
|
||||
|
||||
💬 **WDS Community:** [Discord invite link]
|
||||
📖 **GitHub Discussions:** Ask questions, share your setup
|
||||
https://github.com/whiteport-collective/whiteport-design-studio/discussions
|
||||
|
||||
---
|
||||
|
||||
## Common Questions
|
||||
|
||||
**Q: Do I need to know how to code?**
|
||||
A: No! You're setting up a workspace, not learning to code.
|
||||
|
||||
**Q: What if I make a mistake?**
|
||||
A: GitHub is your time machine - you can always go back. And Mimir is always available to help.
|
||||
|
||||
**Q: Do I need to manually install Git?**
|
||||
A: Nope! Modern IDEs auto-install Git when you need it.
|
||||
|
||||
**Q: Can I use VS Code instead of Cursor?**
|
||||
A: Absolutely! Both work great. Cursor is optimized for AI work, but VS Code is excellent too.
|
||||
|
||||
**Q: What if I get stuck?**
|
||||
A: Type `@wds-mimir [your question]` in your AI chat. He's always there to help.
|
||||
|
||||
**Q: Single repo or separate specs repo?**
|
||||
A: Most beginners should use single repo. It's simpler and you can always split later.
|
||||
|
||||
---
|
||||
|
||||
## Next Steps
|
||||
|
||||
1. ✅ Complete the 4-lesson setup (follow along with this video!)
|
||||
2. ✅ Activate Mimir and have your first conversation
|
||||
3. ✅ Check your setup is complete
|
||||
4. ✅ Start Module 03: Create Project Brief
|
||||
5. ✅ Join the WDS community
|
||||
|
||||
---
|
||||
|
||||
## The Power of Belief
|
||||
|
||||
**"You can do this. I believe in you."** - Mimir
|
||||
|
||||
This isn't empty encouragement. It's based on truth:
|
||||
|
||||
- You just proved you can learn technical tools
|
||||
- You just set up a professional development environment
|
||||
- You just organized a complete methodology workspace
|
||||
- If you can do this, you can master WDS
|
||||
|
||||
**You're not a beginner anymore. You're a designer with a professional setup.**
|
||||
|
||||
---
|
||||
|
||||
## About Module 02
|
||||
|
||||
**Target Audience:** Complete beginners to GitHub/Git/IDEs
|
||||
**Time Required:** 45-60 minutes total
|
||||
**Difficulty:** Beginner (everything explained simply)
|
||||
**Format:** Dual learning paths (quick checklists + full lessons)
|
||||
|
||||
**What You'll Have After:**
|
||||
- ✅ GitHub account and repository
|
||||
- ✅ Professional IDE installed
|
||||
- ✅ Project cloned locally
|
||||
- ✅ WDS integrated in workspace
|
||||
- ✅ 8-phase docs structure created
|
||||
- ✅ Mimir activated and ready
|
||||
|
||||
---
|
||||
|
||||
## About Whiteport Design Studio (WDS)
|
||||
|
||||
Whiteport Design Studio is a comprehensive methodology that transforms designers from tool users into indispensable linchpins - the person who walks into chaos and creates order.
|
||||
|
||||
WDS isn't about learning new design tools. It's about becoming the strategic mind that connects business goals, user psychology, and technical constraints into coherent, implementable specifications.
|
||||
|
||||
**In the AI era, this is your superpower.**
|
||||
|
||||
---
|
||||
|
||||
## About Mimir
|
||||
|
||||
Mimir is your WDS orchestrator - a wise advisor who:
|
||||
- Assesses your skill level and adapts to you
|
||||
- Checks your environment and guides setup
|
||||
- Answers questions with patience and wisdom
|
||||
- Connects you with specialist agents when needed
|
||||
- Provides encouragement and support
|
||||
|
||||
**Invoke him anytime:** `@wds-mimir [your question]`
|
||||
|
||||
He's named after the Norse god of wisdom and knowledge - the advisor who sees patterns others miss. That's exactly what he does for you.
|
||||
|
||||
---
|
||||
|
||||
## Credits
|
||||
|
||||
**Methodology:** Whiteport Design Studio
|
||||
**Training Course:** From Designer to Linchpin
|
||||
**Orchestrator:** Mimir (WDS Guide)
|
||||
**Community:** BMad Method + Whiteport Collective
|
||||
|
||||
---
|
||||
|
||||
## Tags
|
||||
|
||||
#WebDesign #DesignSystem #GitHub #GitSetup #IDESetup #Cursor #VSCode #DesignerTools #WDS #WhiteportDesignStudio #DesignMethodology #BeginnerFriendly #TutorialSeries #DesignWorkflow #ProfessionalSetup #Mimir #DesignCourse #LearnDesign #GitHubForDesigners #DesignSpecifications
|
||||
|
||||
---
|
||||
|
||||
## Comments Pinned
|
||||
|
||||
**First time setting up GitHub?** Drop a comment below! We're here to help. Every expert was once exactly where you are now. You've got this! 🌊
|
||||
|
||||
**Just completed setup?** Celebrate with us! What was the most surprising part? What felt easier than you expected?
|
||||
|
||||
**Stuck on something?** Describe your issue and we'll help troubleshoot. Remember: `@wds-mimir` is also always available in your IDE!
|
||||
|
||||
---
|
||||
|
||||
**Ready to start? Let's get you set up! Press play and follow along. ▶️**
|
||||
|
||||
Loading…
Reference in New Issue