Case Study

Homepage redesign for

a local business.

ClientLocal Business
Timeline2 Weeks
RoleDesign & Dev
Year2026
01Overview

Project Overview

A modern homepage redesign for a local business to improve clarity, mobile UX, and overall brand presence. The client needed a site that felt professional and trustworthy — one that would actually convert visitors into customers instead of bouncing them.

02Challenge

The Problem

The existing website had several critical issues that were actively hurting the business:

Outdated layout that felt stuck in 2015 — no visual hierarchy or clear user flow
Poor mobile experience with broken layouts, tiny tap targets, and horizontal scrolling
Weak messaging that didn't communicate the business's value proposition
Slow performance with an 8-second load time and a Lighthouse score of 42
03Approach

The Solution

I rebuilt the homepage from scratch with a focus on clarity, speed, and conversion:

Clean, editorial UI with intentional whitespace and visual breathing room
Strong typography system using a display serif + clean sans-serif pairing
Clear hero section with a focused headline, supporting copy, and a single strong CTA
Faster load times — brought Lighthouse performance from 42 to 98
Improved information architecture with logical content flow and clear navigation
04Technical

Key Features

React + Tailwind UI

Component-based architecture with utility-first styling for rapid, consistent development.

Responsive Layout

Mobile-first design that adapts fluidly across all breakpoints and devices.

API Routes

Server-side endpoints for form handling, email delivery, and third-party integrations.

Authentication

Secure user authentication flow with protected routes and session management.

Database Integration

Supabase-powered data layer for dynamic content, form submissions, and analytics.

Serverless Functions

Edge-deployed functions on Vercel for fast, scalable backend operations.

05Comparison

Before & After

Drag the slider to compare

After redesign
After
Before redesign
Before
⟨ ⟩
06Stack

Tools Used

ReactNext.jsTailwind CSSSupabaseNode.jsVercelFigmaGitHub
07Links

View the Project

Ready to work together?

Let's build something great.

Have a project in mind? I'd love to hear about it — reach out and let's talk.

Book a Free Consultation→
Folio — 04
Case Study