The Pathfactory content activation platform is a web app that hosts and delivers marketing content powered by an intelligent engine which delivers valuable insights about consumer engagement and buyer readiness.
The look and feel of the UI was several years out of date and required a visual refresh to match the rebrand that Pathfactory had done earlier that year. This was a great opportunity to rethink the platform using new visual trends, improved information hierarachy, and a new holistic view of the navigation.
The new UI design system must be clear, modern, and fast - all while preserving the basic navigation structure of the app. Conveying a sense of clarity and ease of use on first glance makes a critical first impression on prospective customers and first-time users.
The original UI.
To create a new visual system, I combined needs of the existing information architecture with solutions from functional and highly effective web apps. Some examples of webapps we looked at: Intercom, Atlassian Confluence & Jira, Shopify, Drift, and Facebook.
I also referenced principles from design systems like Airbnb's Visual Design Language, Google's Material Design, and Shopify Polaris.
The new UI system is designed around a simpler information hierarachy, which was constructed through card sorting and feature analysis. Previously buried features placed in a 'junk drawer' menu now have a home in a configuration section, while other account- and admin-level settings live in a profile icon.
We also reduced visual clutter in order to focus the user on what's important. We accomplished this by removing borders, flattening visual elements, and hiding unnecessary options.
The redesigned nav preserves the 2-tier menu system.
Hovering over the nav bar shows labels. The side panel can be hidden.
Configurations are now tucked into its own dedicated menu.
Pathanalytics is an analytics feature sold separately from the main product. A different colour in the nav bar orients the user in this distinct feature. Other features can be added to the product offering in a similar manner.