Apex Build
Full multi-page marketing website for a fictional Texas-based general contracting company, built with a bilingual UX targeting the Austin construction market.
Evergreen Custom Homes
Seattle's Premier Home Builder
Multi-page luxury homebuilder site with a vertical scroll-snap hero carousel, word-by-word scroll animations, touch-friendly project gallery, scroll-triggered navbar, and an Instagram-style social feed — built with zero UI libraries.
Responsive Design
evergreen-custom-homes-7i12zzus0-omar-bahenas-projects.vercel.app
Mobile
375px viewport
Full-screen hero carousel
Vertical scroll-snap between hero slides with smooth transitions — no carousel library
Scroll-triggered sticky nav
Navbar hides on scroll-down, reappears on scroll-up with a sleek opacity transition
Horizontal drag carousel
Touch-friendly project gallery you can swipe through natively on any device
Optimized for mobile-first
Fast load times with Next.js image optimization and responsive layouts at every breakpoint
About
Evergreen Custom Homes builds with care and precision, crafting homes that feel timeless from day one. With 150+ remodels and numerous custom builds, they're Seattle's trusted construction partner. The website was designed to match that level of craft — a cinematic scroll experience, a swipeable project gallery, and a social-first layout that pulls visitors into the brand story, all built to reflect the quality they deliver on every home.
Highlights
Scroll-Snap Hero Carousel
Full-viewport vertical scroll-snap between hero slides — each section locks into place with smooth native CSS transitions, no Swiper or Slick needed.
Word-by-Word Scroll Animations
Headlines animate in one word at a time as they enter the viewport, powered by IntersectionObserver — cinematic feel with zero animation libraries.
Horizontal Swipe Gallery
Touch-and-drag project carousel lets visitors swipe through completed homes on any device — built with pointer events and CSS scroll-snap, no Embla or Flickity.
Scroll-Triggered Sticky Navbar
The navigation bar hides on scroll-down and reappears on scroll-up with a smooth opacity transition, keeping the hero content uninterrupted.
Instagram-Style Social Grid
A masonry-style social feed pulls followers into the brand story — with hover overlays and a clean grid that adapts from 1 to 3 columns responsively.
Category Filter System
Clients can filter projects by type — New Construction, Remodels, ADUs — with animated tab transitions that swap content without a full page reload.
Not sure where to start?
Other Projects
Pro Match Paints
7-page automotive paint marketing site with HLS.js video gallery, lightbox with keyboard nav, requestAnimationFrame infinite brand carousel, custom scroll animation hook, session-aware splash screen, page transition system, and three JSON-LD schemas — zero UI libraries or animation frameworks.
Verdant
Full-featured e-commerce frontend covering browse → filter → cart → checkout → confirmation — slide-over cart drawer with localStorage persistence, click-to-zoom gallery, Intersection Observer scroll animations, dual-context state (CartContext + UIContext), and a custom Tailwind 4 design system — no component libraries.