No. 10 · Veterinary clinic
Northpaw Animal Hospital
A vet clinic website that starts by asking "What brings you in today?" and gives each answer its own next step, including an emergency check.
- Classification
- Independent concept
- Business
- Northpaw Animal Hospital (fictional)
- Project type
- Single-page website concept
- Year
- 2026
- Type
- Nunito
The brief
The brief
Design a website for a neighborhood veterinary hospital. Visitors arrive with very different needs, from a routine vaccine to a pet that might be seriously ill. The site has to sort them quickly, make emergency information impossible to miss, and keep hours and booking simple.
Goals
- 01Get each visitor to the right next step in one tap
- 02Make emergency and after-hours information visible on every screen
- 03Show whether the clinic is open right now
- 04Make booking feel calm and clear
On every screen
Designed for phones first
The work
The approach
A vet clinic’s visitors are rarely browsing. They have a reason, and sometimes it’s frightening. So the page leads with a question, “What brings you in today?”, and five large choices. Each one shows what that visit involves, what to bring and the right button.
Teal and mint feel clinical but kind. Tangerine is kept for one job only: emergencies. Nunito’s rounded shapes make the whole site feel friendly without looking childish.
Decisions worth noting
- Emergencies are never more than a glance away. A tangerine bar above the header carries the daytime and after-hours numbers on every screen.
- “It might be urgent” is a real option. It opens a short checklist of warning signs. Tick any of them and the page tells you to call now, or gives the after-hours clinic’s number if the hospital is closed.
- Open or closed, right now. The header works out the status from the hours table and says when the clinic opens next.
- No double entry. Choosing “Book a wellness exam” fills in that reason on the form.
How it’s built
One static page. The chooser uses real radio buttons and the checklist uses real checkboxes, so both work with a keyboard and a screen reader. A few lines of JavaScript handle the panels, the checklist answer and the opening hours.
What would change for a real client
The clinic’s real hours, doctors and services, the actual nearby emergency hospital, and a link to their practice-management booking system.
What’s on the site
Features actually built
- Emergency bar with daytime and after-hours numbers above the header
- "What brings you in today?" chooser with five visit types and tailored next steps
- Red-flag checklist that tells you whether to call now or book a same-day visit
- Live open/closed status worked out from the hours table
- Booking buttons that fill in the visit reason on the form
- Appointment request form (demonstration only, nothing is sent)
Palette
- Teal
#0B6E69 - Mint
#E3F4EF - Tangerine
#F28C28 - Deep green
#12302E