Skip to content

Latest commit

 

History

History
32 lines (22 loc) · 2.61 KB

File metadata and controls

32 lines (22 loc) · 2.61 KB

Design Context

Users

  • Primary: Citizens checking what their council discussed — typically after a meeting, on phone or desktop
  • Secondary: Municipal staff (clerks, elected officials) managing transcriptions, minutes, and decisions — mostly desktop during work hours
  • Both audiences need to find information fast with minimal friction

Brand Personality

Cool, trustworthy, open.

OpenCouncil treats civic data with the craft and clarity of a modern product — not the dryness of a government portal or the urgency of an activist campaign. It earns trust through transparency (open-source, GPL v3) and through design that feels considered, not performative.

Aesthetic Direction

  • Visual tone: Clean, confident, warm. Modern efficiency with civic warmth — closer to Linear or Vercel than to a municipality website
  • About/sales page: Rich motion, visual storytelling, personality. This is the expressive surface
  • Product (app): Calmer, more utilitarian. Information-dense screens should feel effortless, not flashy. Motion is purposeful (feedback, orientation), not decorative
  • Anti-references: Activist sites (urgent, loud, cause-driven), bureaucratic portals (gray, dense, lifeless), flashy startup dashboards (gratuitous gradients, dark mode gamer aesthetics)
  • Theme: Light mode primary. Dark mode supported but not the default
  • Corners: Sharp (radius: 0rem) — intentional, gives a clean editorial feel
  • No colors to avoid, but orange (#FC550A) is the signature — use it for action and emphasis, not everywhere

Design Principles

  1. Clarity over cleverness — Every element should make information easier to find. If a design choice doesn't help the user, remove it. Dense data (transcripts, subjects, speaker contributions) needs breathing room and clear hierarchy.

  2. Warmth without noise — The interface should feel welcoming and human, not clinical. Use the orange accent, rounded avatars, and micro-interactions to add warmth — but never at the cost of readability or speed.

  3. Two speeds — The about/sales page can be expressive (motion, storytelling, visual richness). The product UI should be calm and utilitarian. Know which mode you're in.

  4. Mobile-real — Citizens check meetings on their phone after the fact. Mobile isn't a scaled-down desktop — it's the primary context. Design for thumb reach, scanning, and intermittent attention.

  5. Transparency as aesthetic — OpenCouncil's mission is openness. The design should reflect that: visible structure, honest hierarchy, no hidden complexity. The interface should feel like it has nothing to hide.