Solar Operations Maturity Institute (SOM Institute) — three website design options

Same content, three different brands. Open each one, scroll it on a phone as well as a desktop, and note which whole design — or which elements — to keep. Every "Take the survey" button opens the v4 survey (a review copy that collects nothing).

Identical in all three: the seven areas, the 0–5 spine and every level title and description; the four stakeholder paths; the partner wording (model by SolrBoost; benchmark run in partnership with the University of Cape Town, TruePoint South Africa and Partnerships for Growth); the model-history page; the privacy note; the survey link.
Different in all three: the brand mark and wordmark, palette, type, layout system, how the survey button stays on screen, and the tone of the copy.

Option 1Meridian

Research-institute, editorial. A serif journal voice on warm paper, deep navy with one solar-amber accent that only ever means "the sun". The mark is a sun-arc: six points from an empty ring at the horizon (level 0) to the amber sun at the meridian (level 5).

  • Landing page written as a long-form argument, section labels riding in a margin column.
  • Model page: a numbered ladder per area with a meridian line through the glyphs; an "index by level" reads the matrix the other way.
  • CTA: slim fixed top bar on desktop; on phones a fixed paper "folio" strip at the bottom edge.

Type: Newsreader + Source Sans 3  ·  Feels like: a university-backed benchmark.

Option 2Grid

Instrument, engineering. Ink on paper with one acid-green accent reserved for the survey. The 7 × 6 maturity matrix is the hero graphic and the organising grid of the whole site; one rule drives every graphic — a level is a fill of level ÷ 5 — so nothing can be mistaken for a score.

  • Model page: the full matrix as a real table with a sticky spine header and a titles-only switch; one block per area on phones.
  • Datasheet-style facts ("the survey, specified"), tabular numerals, a visible 12-column ruler.
  • CTA: a full-height acid rail on the right edge of the desktop frame; a fixed bottom bar on phones.

Type: IBM Plex Sans / Condensed / Mono  ·  Feels like: a measuring instrument.

Option 3Ascent

Warm, human, a movement to join. A dawn palette from night plum to gold, rounded geometry, everything drawn in CSS and SVG. The climb from 0 to 5 is a sunrise: the mark is a six-step staircase under a gold sun, and the page edges, bands and footer rise in the same six steps.

  • Copy addressed to each stakeholder in the second person — owner, provider, PPA parties — in the survey's own words.
  • Model page: each area as six cards on rising pedestals; a downward night-to-gold climb on phones.
  • CTA: a floating dark dock at the bottom of every viewport, with the gold button.

Type: Outfit + Plus Jakarta Sans (the survey's own face)  ·  Feels like: an initiative anyone can join.

Decisions these drafts are waiting on