Case Study 03 / 04

State of Michigan

A foundation for the state to stand on.

The state ran like an IT shop, no design in the room. I built the foundation from zero. Twenty agencies, one system, no guardrails to start.

Areas of Expertise

Creative Leadership Design Systems
Scroll
Aerial view of a Michigan lakeshore, forest meeting open water
01

Challenge

The state of Michigan didn’t have a design system, and there was no one in the room to ask the hard questions, or know how to execute one at scale.

Developers were making ad hoc calls, and that misalignment led to poor performing agency websites and frustrated users. One agency had uploaded a polka dot pattern as a header background, a small symptom of a much bigger problem.

Interacting online with the state you live in is essential. Twenty agencies, DNR, Secretary of State, and more, were all building on their own, with no shared grid and no shared sense of what good looked like. The job was scoped for twelve months. Nineteen months later, the work was still landing, so it kept going.

A team gathered for an all-hands presentation in a brick loft office
A designer presenting to the team at an all-hands in a brick loft office
Adirondack chairs in dune grass, the Marquette lighthouse across the bay
Michigan DNR aerial of a wooded lake at sunrise
Aerial view of a river winding through Michigan forest at sunrise
02

The Solution

The work started with an audit, agency by agency, figuring out what existed, what worked, and what every team actually needed day to day.

That groundwork is the part of the job nobody sees, but it’s the part that decides everything after.

From there came the foundation itself. Homepage layouts, hero lockups, and components, built piece by piece and tested until the system could scale across every agency without breaking. The site ran on Sitecore, built by a vendor, and staying close to their implementation meant the components held up in practice, not just in Sketch.

That meant managing up and down at the same time, up to a senior developer and the leadership overseeing DTMB, and down to the vendor to make sure the details were right. Most of the design work happened solo, with help along the way when it mattered.

Documentation stayed light because the timeline didn’t allow for more, so a different kind of safety net took its place. Every agency got a library of placeholder graphics and content options, so a team without a strong image could still put together a page that looked intentional.

The state had a website for every agency, but no shared design language to unite them.

Michigan.gov Health & Human Services department homepage
Michigan DNR event listing page with filters and date range picker
Attorney General contact information directory page

Here’s what that foundation looked like, piece by piece.

Inside the file

Built In Sketch

03

The Results

Agencies used to make decisions alone, with no one checking whether any of it added up to something coherent.

Now they build on one foundation, and can still make it their own.

That’s what unlocked the scale. Every agency customizes within the system, DNR, Secretary of State, all twenty, without needing a designer in the room every time. Current traffic reports put the portal at 20 million visitors, and the work was named the top U.S. state for overall digital government experience, first in the nation, by the Center for Digital Government.

Four years later, twenty agencies are still building on that foundation, and residents interacting with the state they live in are getting a better experience because of it.

No system, no one asking the hard questions. Now the state has both.

Figma Documentation 01 / 14