← ALL WORKSHOPS
DAY_01
Planning & Development Workflow
Turning a problem into a structured development plan before writing code.
Day 01 is about understanding the system before asking AI to build it. You will read a set of requirements, work out how the application should behave, and produce a plan you can actually build against.
What you will learn
- Understand and translate requirements into functionality
- Plan how application components interact
- Break a project into features and responsibilities
- Design an effective user interface and user flow
- Decide what belongs on the frontend and what belongs on the backend
- Use AI strategically during planning, not just during coding
STAGE 01
Understand the Requirements
Before development begins, your team identifies what is actually being asked for.
Who will use the application
What users need to accomplish
What information must be stored
What actions users can perform
How the different parts of the application should interact
The goal is to understand the system before asking AI to build it.
STAGE 02
Plan with Excalidraw
Create a simple functional diagram showing how the application works. This is a practical guide, not formal architecture documentation.
Main pages
User actions
Navigation
Authentication
Data storage
Important connections between components
>User → Sign In → Application → User Action → Firebase → Stored Data
You should be able to answer: when a user performs an action, what happens next?
STAGE 03
Design with Variant
Explore the visual design and user experience of your application.
Navigation
Layout
Responsiveness
Consistency
Accessibility
Usability
Excalidraw = How it works
Variant = How it looks and feels
Handouts
The full written material for this workshop, to read along or take away.
Handouts for this day are not published yet.
Tools used on this day
// KEY PRINCIPLE
Understand the system before you ask AI to build it.