Vibe Coding

This project started as an experiment in how far I could go by combining product thinking, UX strategy, and GenAI-powered execution. I wanted to see if I could take a ride-hailing idea from problem definition to user stories, UX artifacts, high-fidelity designs, and finally a working MVP—using AI as a collaborative partner at every step. I used ChatGPT for research, requirement shaping, flows, and UX decisions, and then shifted into “vibe coding” using Lovable to turn those designs into a functional, real-time prototype backed by Supabase. The goal wasn’t just to design a concept, but to prove how quickly a designer can build a credible MVP when AI accelerates both thinking and building.​

​

The long-term goal is to keep this as a learning lab, where design meets engineering and product thinking guides both.

​

The Problem

Through early exploration (assisted by ChatGPT for research synthesis and competitive analysis), I framed the core problem:​

​

Undelying Goals:

• Reduce friction in booking

• Make driver–rider communication clearer

• Improve sense of control during the ride

• Deliver a clean, calm, reassuring experience
   

GenAI helped accelerate this stage by:

• Summarizing market patterns

• Highlighting UX pain points

• Suggesting personas and opportunity areas

• Helping craft problem statements

​​​​​

Approach

​

Product Management & Requirements (co-created with GenAI)
 

I started by defining the product backbone using ChatGPT as a strategic partner:

• Value proposition

• Core metrics

• MVP scope

• User promises

• Prioritization framework

• Risks and assumptions

• Lean feature set

Instead of spending weeks in requirements writing, GenAI helped compress this into hours.

​

User Stories & Flows (AI-accelerated)

I wrote detailed user stories and asked ChatGPT to refine edge cases and alternate flows.
This created clarity for both UX and development:

• Rider stories

• Driver stories

• Account creation

• Booking, accepting, completing rides

• Payments

• Notifications

• Error states

This became the blueprint for UX and development.

​​

UX Strategy (Designer + GenAI partnership)

I defined UX principles—simplicity, predictability, calmness—and asked AI to help explore:

• Behavioral patterns

• Experience pillars

• Use cases

• Interaction principles
   

AI became a collaborator, not a replacement.

​

Information Architecture (IA)

I mapped the IA manually, but AI helped validate it:

• Rider journey

• Driver journey

• State machine model (requested → accepted → on the way → completed)

• Navigation structure

• Screen-to-screen transitions

 

The IA became the spine of the prototype and MVP.

​

Prototype (Design Phase)

After locking the structure, I built a high-fidelity prototype using lovable.

• Rider onboarding

• Driver onboarding

• Ride booking

• Finding driver

• Driver found → Track ride

• Payment flow

• Driver dashboard

​

GenAI helped in micro-copy, edge-case screens, and alternative layouts.

​

MVP (The “Vibe Coding” Phase)

This was the heart of the experiment.

I wanted to prove that a product designer—augmented by AI—can build a functional MVP with minimal engineering overhead.

​

a. Tools used

• Lovable → vibe coding environment

• Supabase → database + auth + RLS + Realtime

• Edge Functions → booking, accepting, declining

• ChatGPT → backend logic, troubleshooting, APIs, schema design as required

• Next.js frontend (Lovable) → generated + extended

b. What I actually built

Using a hybrid of vibe coding + AI-generated backend logic, I implemented:

• Supabase auth (drivers + riders)

• Role-based profiles and policies

• Real ride creation and storage

• Real-time driver notifications

• Accept/Decline flow

• Rider UI state transitions

• Payments

And still in plan for the following

• Realtime fallback polling

• Edge function debugging

• Error reporting

• Console instrumentation

• Rides state machine

 

This wasn’t just a design—it worked end-to-end.

​

Why this matters as a designer

Building the MVP myself helped me:

• understand constraints

• design with conviction

• test flows instantly

• validate decisions quickly

• refine UX based on actual app behavior

This project became a proof of how AI and vibe coding can expand a designer’s ability to build faster.