moveYSplash: Social Platform Prototype System Design

Back to Portfolio

Full-Stack Product Engineering

Designed and built a social media platform prototype with search and content workflows using modern web tooling.

Search Performance Improved by 90%

Why This Project Matters

Demonstrates end-to-end product delivery, responsive UX, and measurable query optimization in a live academic project.

Tech + Architecture Summary

  • Tech: Next.js, TypeScript, Tailwind CSS, Supabase, PostgreSQL
  • Architecture: Next.js UI + app APIs -> Supabase Auth/Postgres -> feed composer + indexed search pipeline.

Impact Metrics

  • Search latency improved by ~90% after SQL query and indexing optimization.
  • Maintained responsive interaction across mobile and desktop breakpoints.
  • Published a live deployment for external technical walk-throughs.

Core Problem

Create a responsive social feed and search experience while keeping query latency low as content volume grows.

High-Level Architecture

mermaid
graph LR
  UI[Next.js UI]-->API[App APIs]
  API-->DB[(Supabase Postgres)]
  API-->Search[Search Pipeline]
  DB-->Feed[Feed Composer]

Production-Grade Capabilities

  • Responsive multi-device UX with authenticated user workflows.
  • SQL-backed persistence with query optimization and indexing strategy.
  • Live deployment availability for external technical validation.

Engineering Decisions

  • Richer feed queries improved relevance but increased SQL complexity, so I introduced indexing and query simplification for faster reads.
  • Client-side interactivity boosts UX, but can increase bundle size; I split heavier views and reused shared components.

Behavioral + Impact Signals

  • Translated academic scope into a production-style deployed artifact.
  • Balanced UX richness with performance constraints using component splitting.
  • Wrote design documentation to communicate architecture and tuning choices.

Quality Guarantees

  • Authenticated users can only modify their own content.
  • Search responses remain consistent with stored content state.
  • Core feed actions remain usable on mobile and desktop breakpoints.

Recent Upgrades

  • Published a live deployment link to make academic project outcomes directly reviewable.
  • Added a dedicated system design doc page to explain architecture and performance decisions.

Outcome Highlights

  • Improved search performance by 90% through query and indexing optimization.
  • Built a responsive UI across desktop and mobile experiences.
  • Used Supabase with SQL-backed storage for reliable content persistence.