SamanthaPortfolio.
Design Direction + Build Specification — The Treatment
The Team
Jona
Vision + Direction
Build Brief Author
Prototype (vibe code)
Final reviewer
Ricky
Developer
Implements from Build Brief
Builds component by component
Flags before deviating
Samantha
Client + Owner
Delivers references + content
Two approval touchpoints
Inherits clean codebase
⚡ Prototype Step
Between Figma frames and Build Brief, Jona vibe-codes a working prototype.
This becomes Ricky's primary reference — not just annotated screens.
Tools: Lovable, Figma Make, Claude. Interaction intent lives in the prototype, not in notes.
4-Week Timeline
01
Week One
Direction
Samantha delivers — 5–10 references, content inventory, any existing brand assets
Jona produces — visual direction deck, moodboard alignment
Ricky briefed — tech stack confirmed, guardrails agreed
↳ Samantha: references + content by Day 2
02
Week Two
Design
Jona builds — Figma frames, all core pages + states, annotated
Prototype begins — vibe code draft, interaction logic roughed out
Round 1 review — Samantha gives direction feedback
↳ Direction locked end of Week 2. No structural changes after.
03
Week Three
Build
Jona delivers — Build Brief: component logic, design tokens, interaction intent, dev notes
Handoff session — live walkthrough with Ricky before any code is written
Ricky builds — component by component, from Build Brief + prototype
↳ Ricky flags deviation before implementing, not after
04
Week Four
Launch
Refinement pass — one round of adjustments on the live build
Final QA — responsive check, edge cases, clean code audit
Samantha approves — final sign-off before live
↳ Site live. Samantha inherits clean, documented codebase.
Ricky's Guardrails
01
Build Brief before code. Nothing gets built before the handoff session is done. No early starts.
02
Component by component. Each component reviewed before the next begins.
03
Flag before deviating. If the Brief doesn't work technically, raise it — don't solve it unilaterally.
04
Design system is locked. Tokens (colours, type, spacing) not modified without Jona's sign-off.
05
Code is Samantha's. Documented, clean, no proprietary dependencies she can't access later.
What We Need From Samantha
→
By Day 2, Week 1: 5–10 visual references — films, sites, artworks, anything that feels right.
→
By Day 2, Week 1: Content inventory — all projects, series, and materials to be archived.
→
By Day 2, Week 1: Any existing brand assets — logos, typefaces, colour, if applicable.
→
End of Week 2: Direction feedback — Round 1 approval or adjustments before direction locks.
→
End of Week 4: Final sign-off before launch.
Investment
Engagement
The Treatment
Design Direction + Build Spec
Prototype + Handoff Included
Payment
50 / 50
50% on signing to begin
50% on delivery before launch