City Of Chattanooga
Product: Official city website and CMS platform.
Role: Design Strategy, UX, UI, Information architect.
Scope: Responsive Website, CMS component system.
chattanooga.gov
With an outdated and poorly organized citizen facing platform, City of Chattanooga recruited CI&T to devise a modern, mobile-first solution.
Foundations
Through design thinking workshops with key city officials, the CI&T team identified the needs of constituents, city managers and other stakeholders. While the website's visual and technical outdatedness was apparent, I needed to thoroughly understand requirements and opportunities before proposing an effective solution.
Chattanooga’s website before redesign.
RESEARCH
Although CI&T wasn’t responsible for the site’s branding, I led a comparative analysis of U.S. and international municipal websites to engage stakeholders and explore their preferences.
We also conducted interviews to define key requirements and assessed the technical constraints of the chosen CMS.
Research into 311 call data revealed constituents’ interests and relating discoverability issues, helping us prioritize areas for improvement in the redesign.
With stakeholder goals clarified, our product team, including content designers and data analysts indexed thousands of existing pages— to understand content relationships and hierarchy, and ensuring only the essential, up-to-date content was preserved.
Chattanooga’s open data project had a positive impact on the redesign. The large amounts of data collected helped us discover user patterns and interests that affected the site structure. The site itself was later incorporated into the redesign.
Information Architecture
When developing the new IA, I drew from my research into how cities of similar size structure their navigation and content hierarchy.
Stakeholder interviews and data revealed useful insights. For example, users expected to find parking violation payments under "Payments," but since it was one of the most frequently accessed features, we also placed it under “Quick Access” on the homepage.
The resulting sitemap introduced a “flat”, intuitive hierarchy. This not only improved navigation and content discoverability, but also reduced the number of templates and components the city needed to build and maintain.
Section of the site map. The entire sitemap included about 100 pages.
Wireframes
Once the overall structure of the site was defined, I moved on to designing the actual page layouts to accommodate content. Since city content managers would be maintaining the site through a CMS, I focused on simplifying their workflow and uncertainty by reducing the number of page types they needed to choose from.
I defined five core templates that covered around 90% of use cases. This not only streamlined development but also supported flexibility—each template allowed for modular components that could be added, removed, or customized as needed.
Components
With the basic templates defined, I analyzed existing content to identify recurring patterns that informed component design and hierarchy. By combining templates with modular components, we could support a wide range of page variations. To avoid overwhelming content managers, I created a focused subset of templates tailored to the most common page types.
Iteration and Validation
Core templates:
Section Homepage
Section header
Search results
Department home
Article
We tested the wireframes and content structure directly within the CMS, allowing content experts to provide real-time feedback. This collaborative process helped us validate design decisions early and make necessary adjustments on the fly.
Despite delays in receiving branding materials from an external agency, our flexible approach allowed development to move forward as planned. Once those materials arrived, visual design iterations began. I contributed to the first round of refinement before transitioning to other projects.
This approach allowed us to develop content pages aligned with the user needs identified earlier. Using Bootstrap as our CMS enabled rapid, in-browser modeling of pages, making it easy for the product team to test and refine layouts in response to real-time stakeholder feedback.
Impact
The final product successfully meets the diverse needs of Chattanooga’s residents and city officials.
Leveraging the wireframes and information architecture, the city’s design team was able to quickly develop the visual UI and branding. This streamlined approach helped minimize both time and costs in launching the new website.
Improved usability and content discoverability
Streamlined content management
Faster implementation and reduced costs