Mobile App / Full-stack ProductFull-stack Mobile Project

SipSwipe

A full-stack mobile product for swipe-based drink discovery, personal taste profiling, diary logging, community posts, and activity-based stamps.

Details

Surface
Mobile app / Swipe discovery product
Role
Product Designer / Full-stack Builder
Timeline
Portfolio product project
Scope
Swipe UX, Taste Profile, Supabase Auth, Data Persistence, Community Posts, Diary Entries, Activity Stamps
Tools
Expo, React Native, TypeScript, Supabase, PostgreSQL, RLS, React Context, Reanimated

Final UI / Prototype Screens

sipswipe Welcome page
sipswipe Login page
sipswipe Register page
sipswipe Swipe page
sipswipe Swipe detail info
sipswipe Personal info page
sipswipe Activity community page
sipswipe Stamps calendar page

Context

SipSwipe is a mobile product concept for adults of legal drinking age who are new to tasting. The app helps users explore drinks through flavour, vibe, mood, and social context, then turns repeated swipe interactions into a personal taste profile over time.

Problem

  • New drink explorers often lack the vocabulary to describe what they like.
  • Traditional catalogues can feel dense, brand-led, or hard to personalize.
  • Preference signals need to be captured without making the experience feel like a form.
  • A portfolio-ready product needed a real data model, auth flow, persistence layer, and fallback mode.

Design Goal

  • Make discovery feel playful and lightweight through swipe-based interaction.
  • Translate likes, passes, and diary activity into a readable taste profile.
  • Support real persistence with Supabase while keeping local mock mode available.
  • Separate data access from UI state so the product can scale feature by feature.
  • Design community and activity surfaces that extend the product beyond one-time discovery.

Key Features

  • Explore sessions with 8 swipeable drink cards and a Today's Taste Snapshot at completion
  • Taste profile surfaces including Taste Mix, Today's Taste, Liked Bottles, journey, and session counts
  • Sip Diary with one persisted drink log entry per user per date
  • Sip Circle community feed with activities, post creation, search, and sort
  • Sip Stamps earned from local activity questionnaires and saved to Supabase
  • Repository pattern that keeps Supabase calls out of UI components

Outcome / Reflection

SipSwipe helped me connect product design with full-stack implementation. The core challenge was not only making swiping feel fun, but also designing how each interaction becomes useful product data across taste state, diary entries, community activity, and future recommendation logic.

Design Process

1. Product Framing2. Feature Architecture3. Swipe Interaction Design4. Taste Data Model5. Supabase Schema6. Repository Pattern7. Mobile UI Implementation8. Mock Fallback9. Testing