Contact · soon
All work
04 / Sample sites · three industries

Websites for Any Business

A bakery, a renovation contractor, and a physical therapy clinic: three fictional businesses, three sample sites, each with its own look, voice, and job to do.

Client
Sample work · the businesses are fictional
Role
Design and engineering
Year
2026
Status
Samples
Live
Samples, not deployed
kettleandcrumb.examplefieldstonereno.exampletidewellpt.example
Sample site for Kettle & Crumb, a fictional bakery, headed Bread worth getting up for.Sample site for Fieldstone Renovation Co., a fictional contractor, headed One crew. One price. No surprises.Sample site for Tidewell Physical Therapy, a fictional clinic, headed Move freely again.
3industries, each with its own type, color, and voice
0automated WCAG 2.2 AA violations, checked with axe-core at phone and desktop sizes
0 KBof JavaScript needed to render any of them
6layouts designed and checked: each site on a phone and on a desktop

The brief

Why it needed to exist.

Not every client needs a research platform. Most need a website that feels like their business, works on every phone, and turns a visit into an order, a call, or a booking. These samples show that range in three very different industries.

The production

What we built.

Most businesses don't need a research platform. They need a site that looks as considered as their work, reads well on a phone, and makes the next step obvious: order, call, book, or ask for a quote.

These three samples show the range. Each starts from what its customers need to do. The bakery leads with today's bake and pickup, the contractor with a short estimate form and a plain process, and the clinic with open appointment times and what to expect at a first visit. The businesses are fictional; the standards are the same ones behind every other production on this page.

  1. 01Three identities, no template

    A soft serif and warm paper for the bakery, a condensed grotesk and a blueprint grid for the contractor, and a calm teal palette with an italic serif for the clinic. Nothing is shared but the standards.

  2. 02The next step, up front

    Order for pickup, request a site visit, or book an evaluation: each page opens on the one action that business needs most.

  3. 03Built for the phone

    Every layout was designed and checked at phone and desktop sizes, with nothing scrolling sideways on a phone.

  4. 04Accessible from the start

    Each page passed an automated WCAG 2.2 AA audit with axe-core at both sizes, with zero violations, after the contrast on a few small accent labels was raised. Form fields are real, labeled controls.

  5. 05Light by default

    Semantic HTML, hand-written CSS, and illustrations drawn in SVG. No page needs JavaScript to render.

Under the hood

How it’s made.

  • PagesSemantic HTML and hand-written CSS, one file per site, with no framework
  • TypeFraunces, Instrument Sans, Archivo, JetBrains Mono, Figtree, and Instrument Serif from Google Fonts
  • ArtThe loaf, the blueprint elevation, and the range-of-motion dial, drawn in inline SVG
  • QualityPlaywright renders at phone and desktop sizes; axe-core audits against WCAG 2.2 AA

Stack: Semantic HTML · Hand-written CSS · Inline SVG · Playwright + axe-core

Stills

From the set.

Tidewell Physical Therapy sample: conditions treated and what happens at a first visit
Tidewell Physical Therapy: what it treats, and what a first visit looks like.
Kettle & Crumb sample: the daily board of breads, pastry, and lunch
Kettle & Crumb: the daily board.
Fieldstone Renovation sample: six services in a grid
Fieldstone Renovation: every room in the house.
Kettle & Crumb sample on a phone
Fieldstone Renovation sample on a phone
Tidewell Physical Therapy sample on a phone
Next productionALSRFC Alumni