Design prototype · phase 1 · September 2026

WhatToSee, Colchester prototype

The best possible version of WhatToSee, shown through one town. Proves the model, not the database: one entity, four ways to discover it, and a route that keeps working once you're actually standing in Colchester.

The route, every visit follows it
Discover
"What could we do?" Search, AI search, social, editorial, listicles.
Decide
"What should we do?" Browse, filter by audience, time, price, weather.
Go
"Where is it, how do I get there?" Map, directions, walking time.
Discover again
"We're here now, what else is nearby?" Loops straight back to Discover.
↻ one connected product, not two separate websites

Two routes in, one database underneath

Route A

Build the audience

Found before you leave the house: things to do in Colchester, what's on this weekend, best soft plays, free things to do. Editorial energy, big photography, strong headlines. Premium and trustworthy, not BuzzFeed-branded, just BuzzFeed-clickable.

Route B

The digital town kiosk

Found once you're already in Colchester: QR codes on car parks, the station, shopfronts. Search "menswear," get distance and directions in seconds. Mobile-first, fast, no editorial clutter until the task is solved.

Search / AI / Social Editorial (Best / New / What's On) Discover a place Map / plan
Visit Colchester Scan a QR Search nearby Directions More discovery Return to WhatToSee

What's built in this pass

Per the pattern-system rule for new site design: show one strong, complete direction before building the rest, not a shopping list of components. This is that one page, done properly, plus the plan for what follows it.

00
National homepage
The front door: what WhatToSee is, the town picker (Colchester live, others coming soon), how-it-works, the map/kiosk explainer, and a light-touch "for councils" band, since that's the real buyer
Built View →
01
Colchester homepage
Search-led hero, quick discovery tiles, What's On, New, the big map, Best of Colchester editorial, audience row, Explore Everything. Now with real Colchester photography (Adam's, 9 images) in place of placeholders on the most visible slots
Built View →
02
Large map experience
Full-screen list/map mode, category filters, near-me. Given councils buy the map, this is arguably the most important page still missing
Next
03
Category page
e.g. Activities & Entertainment, the subcategories underneath Do
Next
04
Audience page
e.g. Families, the same database queried a different way
Next
05
Listicle template
"17 Brilliant Things to Do With Kids", show-all-on-map
Next
06
Individual place page
Hero, key facts strip, directions, things nearby
Next
07
Digital kiosk / QR journey
"You're in Colchester, what are you looking for?" → menswear → directions
Next
08
Council pitch page (proposed, not started)
A dedicated B2B page for council decision-makers, separate from the consumer homepage band above. Flagged 11 Sep, not yet agreed as a real page vs staying a homepage section
Open

Art direction, decided for this pass

Nothing in the fleet's Design Bank fits a consumer local-discovery product, it's all B2B finance (navy/gold, serif-on-sans, distressed or advisory audiences). This needed its own direction rather than a forced reuse.

Type: Space Grotesk (display, editorial headlines, big listicle numerals) on Inter (body, UI, map results). Deliberately not the fleet's usual serif-on-sans, this is consumer media, not advisory trust.

Colour: warm paper white, near-black ink. Coral as the one loud accent (search CTA, "Go", editorial highlights), gold for freshness (New tags), teal for utility (map, kiosk). Wider hue set (plum, rose) used only functionally, for map-pin category coding, never as brand colour.

Mechanics reused from proven fleet learning: search-bar-as-the-actual-hero-CTA (Age Space's mechanic, matches the brief's "utility must dominate"), a non-card editorial fact strip for place pages (the HMRC Fact Treatment C finding: label column, tinted background, left accent border, no floating card), asymmetric/oversized editorial cards instead of a sterile equal grid (explicit finding from the Design Bank review, and the brief's own instruction).

Avoided on purpose: gradients, excessive pills, icon-above-heading card grids, equal-size cards throughout, generic SaaS rhythm, tourism-board or council-website register.

Five-second test, run against the homepage

Per the brief's own final test. Loosely self-assessed, not a real usability test yet.

Scenario 1 (Google search, "things to do with kids this weekend"): lands mid-funnel on a listicle or category page, not this homepage, not tested yet, queued with page 05.

Scenario 2 (no fixed plan): homepage's quick-discovery tiles and Best of Colchester should pull someone in within the first scroll. Feels right on this build, worth a real look on a phone before calling it done.

Scenario 3 (QR scan, search "menswear"): this is the kiosk journey, not built yet, page 07.

Scenario 4 (reading a listicle, wants it on a map): the homepage's map section proves the mechanic exists, the listicle template itself (page 05) is what needs the "show all on map" handoff, not built yet.

Scenario 5 (arrived for one thing, tempted to stay): What's On, New and the map sit directly under the fold on the homepage. Real test only works once a real place page (page 06) exists to arrive from.