Skip to main content

Case study 03 · Healthcare

Avenora Health

A complete website and content management system for multi-specialty hospitals — departments, doctors, appointments and an accessibility panel on every page.

Studio template · 2026

Services

  • UI/UX Design
  • Web Development
  • Custom Software
  • Accessibility
Avenora Health hospital homepage hero: better health begins with better care

Avenora Health is a demonstration brand. Its doctors, contact details and articles are illustrative, and photographs are licensed stock. Each hospital that uses the platform replaces them with its own verified content.

01Overview

Avenora Health is our hospital website platform: an art-directed public site and a full CMS that a hospital’s own staff can run. It is designed to be configured for each hospital — its departments, doctors, facilities, booking rules and brand — rather than rebuilt from scratch.

02Challenge

Hospital websites carry a lot: many departments, dozens of doctors, facilities, diagnostics, patient resources and appointment requests. They are usually hard to update, inconsistent between sections and inaccessible to the patients who need them most. Staff need to change content safely, and patients need to find a specialist quickly.

03Strategy

Build once, configure per hospital. Content is structured — departments, doctors, facilities, diagnostics, articles, FAQs — so pages stay consistent as the hospital grows, and every change goes through draft, preview and publish with revision history.

04UX

A doctor directory with search and filters by department, specialty and language; department pages that link straight to their specialists; and an appointment request form that is always presented as a request, never as a confirmed booking. Patient resources, a searchable FAQ and a feedback form round out the patient journey.

05UI

Calm, trustworthy and modern: a signature animated hero, a restrained palette that hospitals can re-brand from settings, and components that stay consistent across dozens of page types.

06Engineering

Next.js with PostgreSQL through Drizzle ORM — Supabase Postgres in production and an embedded database locally, so the platform runs and tests without external services. Staff sign in with first-party secure sessions (bcrypt, hashed session tokens, httpOnly cookies) and role-based access. Rich text is sanitised on the server, media is managed in a library, and appointments have a status workflow, internal notes, CSV export and an audit log.

07Accessibility

A floating accessibility panel on every public page offers text size, spacing, readable font, high contrast, grayscale, inverted colours, link highlighting, focus highlighting, stopped animations, a larger pointer and a reading guide — remembered between visits and applied before the page paints. Automated axe-core checks run in the end-to-end test suite.

08Technology

  • Next.js
  • React
  • TypeScript
  • PostgreSQL
  • Drizzle ORM
  • Supabase
  • Tailwind CSS
  • Playwright
  • axe-core

09Delivered

Public website
Departments, doctors, facilities, diagnostics, blog and more
CMS
Page editor, collections, media library, users and roles
Appointments
Requests, status workflow, notes and export
Accessibility panel
14 user controls on every page

Have something worth building?

Tell us what you're working on. We'll help turn the idea into a product people can trust.