Day-to-night sky
A WebGL sky behind every page darkens from lavender to indigo as you scroll, and the text over it shifts color to stay readable.
SELECTED WORK / HEALTH & WELLNESS
The Wellness Collective.
Telehealth in eight states · St. Louis area
A moonlit, illustrated website for a therapist-led wellness practice, bringing therapy, intuitive readings, local events and collaborations into one place.
Visit live website (opens in a new tab)Explore the project
- CLIENT
- The Wellness Collective
- INDUSTRY
- Health & wellness
- OUR WORK
- Website design & development
- WEBSITE
- wellnesscollectivehub.com
THE PROJECT
A modern wellness house.
Calm, personal and clear.
The Wellness Collective is the practice of a licensed clinical social worker. It offers telehealth therapy and coaching in eight states, virtual intuitive readings, in-person classes and gatherings around St. Louis, and collaborations such as speaking and training.
We designed and built the site together with River City Digital. It sets the clinical detail people look for before booking, such as licensure, insurance, telehealth states and specialties, next to the reflective and community side of the practice, with “Book a session” in the header on every page.
DESIGN STRATEGY
From day to night,
as you scroll.
We built the identity around the night sky, with a custom set of vector artwork (a crescent emblem, arched portrait frames, lavender washes, a compass rose and a dusk garden footer) that gives the pages a hand-made feel.
The site moves from day to night as you scroll. A WebGL sky behind the content darkens from pale lavender to deep indigo, its stars twinkle faster as you scroll, and a pinned section steps through nine moon phases. The effects scale back on touch devices and for reduced-motion settings.
TYPOGRAPHY
Cormorant Garamond headlines, Jost body text and a handwritten Sacramento accent.
COLOR
Midnight indigo and violet, periwinkle and mist, warm cream and a thread of gold.
ARTWORK
A crescent emblem, arched portrait frames, a compass rose and a dusk garden, drawn as vector art.
HOW IT’S BUILT
Next.js and WebGL,
with the sky loaded last.
The site runs on Next.js 14 with the App Router, styled with Tailwind CSS, with self-hosted fonts. GSAP with ScrollTrigger drives the pinned and scroll-linked scenes, Lenis handles smooth scrolling and Framer Motion the page transitions.
The sky is a Three.js scene rendered with React Three Fiber and loaded after the page itself, so the content arrives first. Booking links go to Calendly, and the collaboration form posts to the site’s own API.
- FRAMEWORK
- Next.js 14 (App Router) and React 18
- STYLING
- Tailwind CSS with a custom palette
- MOTION
- GSAP ScrollTrigger, Lenis and Framer Motion
- 3D
- A lazy-loaded Three.js sky (React Three Fiber)
- BOOKING
- Calendly, plus a collaboration form
- HOSTING
- Prerendered pages through CloudFront
SEARCH, BUILT IN
A practice described
for search and for AI.
People check credentials before they book, so the site describes the practice, its license and where it serves in structured data.
Every page has its own title, meta description and canonical address, plus Open Graph and Twitter card tags with a share image.
Site-wide structured data describes the practice as a medical business linked to its founder, including her license and the eight states the practice serves.
Blog posts carry BlogPosting and breadcrumb markup with publish dates, authorship and cover images.
The services page lists each offering as a Service, with breadcrumb markup.
An XML sitemap covers every page, and robots.txt points crawlers to it.
THE SAME WEBSITE. A SMALLER SCREEN.
PROJECT HIGHLIGHTS
The details
that make it work.
Moon-phase scroll scene
A pinned homepage section fills a moon as you scroll and steps through nine phases, each paired with a short line.
A form that screens bots
The collaboration form collects organization, type, timeframe and audience size, and filters bots with a hidden field and a timing check.
KEEP EXPLORING
Learn more about the services behind our work.
- Service
Web design & software
Custom websites, online stores and software built around your business.
- Service
Custom websites
A website designed and built around your services and your customers.
- Service
Ecommerce stores
Online stores with clear product pages, simple checkout and the integrations you need.
- Service
SEO
Technical fixes, content and local search that help customers find you.
- Service
Google Maps & local SEO
Your Google Business Profile and local listings, set up for nearby customers.
- About us
Client reviews
What clients say about working with our team.
YOUR NEXT WEBSITE
Planning a website
your customers will use?
Let’s talk about your business, your customers and what your website needs to do.