angle-downangle-leftangle-rightangle-upfacebookinstagramlinkedinTagtwitteryoutube-play
Skip to main content

A Digital Experience to Match a City's Vision

The San Francisco Planning Department is responsible for the long-term vision and livability of San Francisco. When their dated web design didn’t match their visionary charge, they came to Chapter Three for help.

San Francisco Planning white logo
Laptop and mobile device of SF Planning redesign

More Than Just A Refresh

In discovery, we unearthed that the existing content model wasn’t providing enough structure to allow their message to shine. Between multiple inconsistent menus, in-body links, and poor search, content was virtually impossible to find.

    We identified these goals

    • Clarify the purpose of the department
      Explain what the department does to better the city and its residents.
    • Put actionable content first
      Decrease the amount of policy documents, and describe content in the way the public interacts with it in real life.
    • Simplify access to information
      Transparency is the focus. Make it easy to get accurate information up on the site quickly in a readily findable way.
    Picture of City Hall of San Francisco
    Aerial picture of Downtown San Francisco

    Through the Fog

    In collaborative workshops, we started seeing patterns. We inventoried of all existing content, re-organized it in a card sort, validated it against real personas, and dissected it with page tables.  With our brains fully wrapped around what the public needed, we visualized our solution with in-browser wireframes.

    Extending the brand for web

    Meanwhile, we explored what a digital representation of the Planning Department brand could look like. With only a stylized print report document to work off of, we produced multiple directions using the established and typography from the document. We avoided re-inventing the wheel by weaving in font styles and sizes from the US Web Design Standards. We iterated and tweaked designs with the Planning Department team until we got the look-and-feel just right.

    3 desktop layouts for SF Planning Department redesign

    Zeroing in on Launch

    The Planning Department gathered content while the site was coded. Our iterative development and early content entry made it possible to tailor to the Planning Department’s needs. We also trained the Department's tech lead so the client can do what they need at the drop of a hat.

    Mobile design for SF Planning

    “Chapter Three is a fun team who guided us through a complex process and produced a beautiful new design and strategy that our residents will love.”

    Martin Thibodeau
    IS Business Analyst | SF Planning Department

    Related Content

    How Can We Help With
    Your Next Project?