Salt Lake County was in need of a more modern and user-friendly website to benefit the county's million citizens. People come to SLCo.org to access a plethora of services, ranging from pet adoption to custom map creation. Niftic took a people-first approach in creating a platform that is intuitive and easy to navigate, placing these services front and center.
I built a component library flexible enough for a 100,000+ page experience, but simple enough to give those pages consistency. This consistency gives the site an overall cohesion, helping residents find what they need while fostering a dependability that feels like home.
SLCo.org's 100,000+ pages vary in style and function, creating friction for users.
SLCo.org is an ecosystem with over 40 departments, plus elected official pages that each have their own microsite.
Each microsite had its own design language, adding friction to the experience.
Tests revealed that users were unable to complete simple tasks using the current website.
The redesign focused on a lean content strategy, consistent design language, and a new user experience.
We challenged stakeholders to narrow down the content on their sites and ditch least-visited pages so users can find what they need.
We created a set of templated pages, along with a modular library of stackable components flexible enough for all use cases.
We examined every aspect of the site, from information architecture to visual design, and asked what wasn’t working– and why– from a user standpoint.
Parts of SLCo.org have not been updated for 15 years, and that fact alone called for a refresh. Immediately, potential improvements jumped out at us in terms of how to bring the site up to current aesthetic and user experience standards.
But before delving in and proposing changes, our strategist ran several design thinking exercises to gather an extensive understanding of users, county stakeholders, and the landscape in which the new SLCo.org would thrive.
We aimed to create a consistent structure to empower not only users, but also the employees of Salt Lake County who would be uploading content to the site. The base of this structure are a set of templated pages.
Once we setted on the templated pages we would use to build out each site, it was time to actually build out sites!
Using our first iteration of components, I built out wireframes for Criminal Justice Services, Parks & Recreation, and the Treasurer. The Elected Officials were excited at the prospect of a refresh, and were filled with ideas on how to improve their web presence.
With these wireframes we confirmed the robustness of the design system; the existing content fit easily into the new pages.
While creating wireframes I started to think of the structure of each page and the pieces that would fit together to make them.
The system had to be the foundation of pages that are easy to understand to visitors, but also easy for designers and Salt Lake County's development team to implement.
With this in mind, I devised a system of reusable, modular components that could be stacked upon one another to make up each page– eliminating extra steps for design and development and giving pages a cohesiveness the former ones lacked.
One of my favorite parts of the design system is how cards are organized. Cards are held by "Racks", and "Stacks" are groups of "Racks".
This organizational structure is a perfect visual representation of the scalability and modularity we threaded through our design process.
Cards are are gateways to inner pages within the site. All cards are 4-columns wide, fitting neatly into rows of 3.
Racks are groups of cards that share a similar quality, like Services or Resources.
Stacks are groups of Racks that pertain to a certain topic, like a Department or How To.
Currently, the Mayor, Treasurer, Assessor, Surveyor, and Animals & Pets Department sites are live. Salt Lake County's development team is working hard to ensure a smooth rollout.
