Back to Daily Vibe CodeDay 25 of 30
Chat UI
Intermediate 45minCommunication
The Prompt
Build a chat messaging interface. Features: left sidebar with conversation list showing avatar, name, last message preview, and unread badge, main chat area with message bubbles (sent right, received left), timestamps, message input bar with send button and emoji picker, typing indicator animation, search conversations. Add online/offline status indicators.
What you'll learn
Prompt crafting
Turn a one-line idea into a clear build brief an AI can execute.
Rapid prototyping
Ship a working version in under an hour — speed over polish.
Core UI patterns
Practice the layouts and components every app relies on.
Shipping fast
Build the habit of finishing and sharing what you make.