Case Study • Portfolio
Unit Savings (Portfolio Demo)
A conceptual residential and commercial service website built to demonstrate a conversion-focused flow, strong component reuse, and production-minded guardrails (demo disclaimers, disabled contact).
Important
This is a portfolio demo. Contact methods and booking flows may be disabled and are not monitored.
Prefer a single entry point? Open the residential landing page (then switch to Commercial from the site navigation).
Highlights
- • Conversion flow: eligibility → pricing → booking gate → quote fallback
- • Clear scope constraints baked into UX (“ground-access only”, cleaning-only)
- • Component reuse: consistent cards/sections with route-aware theming
- • Demo guardrails: visible disclaimers + disabled real phone actions
What I built
- • Residential landing page with clear eligibility constraints (“ground-access only”)
- • Commercial landing page variant with parallel sections and pricing
- • Pricing table + booking gate pattern (terms acknowledgment concept)
- • Custom quote flow for non-standard installs
- • Reusable components (cards, sections, route-aware theme)
Tech
- • Next.js App Router, React, TypeScript
- • Tailwind CSS + theme tokens
- • Vercel deployment + DNS configuration
Security-minded choices
- • Demo mode prevents impersonation risk by disabling “real” contact actions
- • Environment flags used for behavior toggles (no secrets committed)
- • Server-side endpoints can be extended with validation and rate limiting if made live
Tools & workflow
- • GitHub for version control and iteration
- • Vercel for deployment; DNS configured through a registrar
- • ChatGPT used as a coding assistant for refactoring/iteration; final decisions and review were mine
Notes
- • This is a portfolio demo; contact and booking may be disabled.
- • I explored viability and operational constraints, but chose not to launch.