Jade Aesthetics

I designed and built the original Jade Aesthetics website on Framer from scratch. Starting with only the existing logo mark, I developed the entire digital design language — jade greens, warm golds, cream backgrounds, and the Dream Avenue serif typeface — to match the warmth and sophistication of the physical space. Every color choice, layout decision, and typographic pairing was made to communicate luxury and clinical trust before a visitor reads a single word.

The V1 site gave Jade Aesthetics a polished digital presence that reflected the quality of the in-person experience. It served its purpose well as a launch platform — establishing the brand online and giving potential clients a clear picture of the services, philosophy, and aesthetic that define the practice.

Framer was the right tool for getting the site live, but as the business grew, the platform became the bottleneck. No semantic HTML meant screen readers and search engines struggled to parse the content. No structured data, no sitemap control, and minimal indexable body copy left Google with almost nothing to work with. For a local medical spa competing in DuPage County on high-intent queries like “Botox Wheaton IL” or “med spa near me,” that invisibility was costing the business real traffic.

The content model was also a constraint. Jade Aesthetics offers dozens of individual treatments across multiple categories — each one deserving its own optimized page. Framer's visual editor wasn't built for content-heavy sites with that many routes. The business needed an architecture that could scale: one service, one page, one entry point from search.

I rebuilt the site from scratch as a Next.js application using the App Router, Tailwind CSS, and server-side rendering throughout. Every page delivers full HTML to the browser — no client-side rendering dependency for content. The architecture was designed SEO-first: unique metadata on every route, JSON-LD structured data (MedicalBusiness, MedicalProcedure, FAQPage schemas), auto-generated sitemaps, and breadcrumb navigation with schema markup.

The site ships over 30 pages: a content-rich homepage, four service category pages, 16 individual treatment pages, product pages for two skincare lines, an about page with team bios, FAQ, financing, blog infrastructure, and a contact page. Every service page follows a consistent template — what the treatment is, who it's for, what to expect, results and recovery, and localized FAQs — giving Google rich, indexable content for each procedure.

I designed Jade Aesthetics' entire digital visual language from scratch. The jade green and warm gold palette, cream backgrounds, Dream Avenue typeface, and the interplay of photography with clean negative space — all of it was developed for V1 to translate the feel of the physical store into a digital experience. The only element I inherited was the logo mark. Everything else was original.

V2 carries that same design language forward, but systematized for scale. What started as page-level decisions in Framer became a component-based design system in Next.js — service cards, FAQ accordions, testimonial carousels, and CTA blocks, all built as reusable pieces with consistent spacing and hierarchy. The visual identity I created on day one now lives in an architecture designed to maintain that consistency across 30+ pages and growing.

Version two was built almost entirely with Claude Code — Anthropic's agentic coding tool. I used it to scaffold the Next.js application, generate the SEO infrastructure, write structured data schemas, build reusable components, and handle the content architecture across 30+ pages. The workflow was collaborative: I directed the design decisions, content strategy, and architecture while Claude handled the implementation at speed. What would have been weeks of templating and content entry compressed into days.

Jade Aesthetics now has a website built to the same standard as the experience inside the treatment rooms. The content architecture gives every procedure its own optimized page — each one a potential entry point from Google for someone searching for that specific treatment in the Wheaton area. The design language I created from day one now lives in a system built to scale with the business, and the server-rendered infrastructure means the site is fast, accessible, and compounding organic traffic over time. Two builds, one vision, zero compromises.