Traverse UI Redesign

Company

Northwoods (2023–2024)

My role

Senior Product Designer

Team members

Senior Product Designer, Front-End Development Team

Timeline

5 months for design, 5 months for development

Background

Within about a month of starting at Northwoods, I was tasked with leading up a total UI redesign of Traverse, our flagship product. Traverse is a SaaS solution for human services agencies that provides document management, forms management, and mobility. With about 140 unique pages, it’s an expansive tool for two designers to totally overhaul in less than 5 months, so I took a personal interest in organizing our approach and getting the right stakeholder buy-in along the way.

Goals

Modernize an entire product without disorienting users

Get stakeholder buy-in

Create a brand-new design system

Challenges

Aggressive timeline

Large footprint
(140 unique pages)

Limited design support
(2 part-time designers)

Before

After

“Cleaner looking. Brighter and easier to navigate.”

— Traverse user

Early explorations

Using FigJam, I mapped out a timeline for the project with our chief product officer based on the key dates he felt were important. To kick things off, I wanted to make sure that the other designer and I had some space to consider multiple visual paths before socializing and getting feedback from outside voices. We considered color palettes, determined where to draw the line in terms of scope, and explored what type of emotions the visuals of Traverse should evoke through inspiration and mood boards.

Expanded execution

Once we had a general visual direction in place, it was time to create more key pages. This was the next step towards building a design system that would work for the whole product, and it presented more complex layout and interaction considerations.

Before

After

Design system

As we made more page templates, we started compiling a design system to document all our decisions and fill in any gaps. The other designer and I collaborated on what standards we wanted to implement for everything from content patterns and iconography to modal and navigation designs.

Our front-end development team was also instrumental in rolling out our design decisions across any pages that weren’t fully accounted for with designs. They made suggestions and spotted inconsistencies across the board that really elevated the final outcome of this work.

Release

From sharing the what and why behind a UI redesign with our executive leadership team through supporting the launch, I had a key role in creating slides and presenting them. I represented the design side of this work on 4 internal webinars and two customer webinars—one of which was our most well-attended product webinar to date with over 300 attendees.

More work

KeyBank Account Originations

Passion Projects

Caseworker Mobile App

Logo Design

Chase Authentication Experience

Seasonal Campaigns