Syntellis Design System Case Study

 
 

INTRO

Syntellis makes the Axiom Platform — performance management solutions for data & analytics. This includes 3 suites of 18 products for healthcare, higher-ed, and financial institutions.

Syntellis came to our team in 2020, having just rebranded (formerly Kaufman Hall), and facing experience and usability challenges.

We evolved existing brand elements into a lighter and more flexible design language, optimized for interfaces. We developed a full design system to normalize usage in multiple apps across the platform: functional Figma components allowed the product team to implement quickly, expand consistently, and save weeks off the schedule.

CHALLENGE

The UI no longer felt modern. Axiom products look and feel was perceived to be dated, which did not inspire confidence. Tech and design debt accumulated over the years, so that with 18 products, navigation patterns had evolved in varying ways.

Even with tech-savvy users, the tools had a steep learning curve. Simple reports were just as hard to make as a complex ones. The platform didn’t offer any of the ease-of-use that people expected from modern app experiences.

Another issue was that due to the data-intensive nature of the product, the legacy app required users to step out of the web app and launch a customized Excel client, putting a serious damper on consistency and continuity of the experience.

design debt.png

Design debt

PROCESS

Research

Our design team included a project manager, 2 researchers, 1 interaction designer, myself as creative director, and one other visual designer.

Research addressed 27 users across a variety of roles and responsibilities. Some were internal domain experts, others client customers.

Through this process, we defined a series of personas to help visualize our motivations and directions.

Both a digital mailer and a print poster were created to evangelize the personas within the Syntellis organization.

PERSONAS

  • Financial Strategist

  • System Wizard

  • Data Mechanic

  • Information Maven

  • Business Owner

  • Budget Wrangler

Axiom Personas Single Pg 14x8.5 2020-10-01.png
 

Early concepts

Frame 24.png
 

Addressing Filtering and pathfinding issues

Frame 8.png
 

Comp examples

Frame 41.png
Frame 42.png
 

Design System

Frame 40.png
Frame 51.png
Frame 53.png
Frame 52.png

RESULTS / LESSONS LEARNED

  • Resonance testing participants universally appreciated the new design and would elect to use it over the current Axiom design.

  • The new design allowed participants to imagine an experience that was “clear” with an increased sense of reliability and opportunity.

  • The new navigation increased participant ability to locate expected paths to data, with visual language remaining consistent and recognizable across the system.

  • While no participant would take issue with the existing design, nothing in the current design improved or clarified data and workflow.

  • Participants could universally navigate through the prototype but were not always observant of changes in contextual options.

  • There is space to evolve features like Filter and Comments so that they are more widely adopted and enhance work processes.

  • The components were created before Figma released variants—including these would have created efficiencies.

syntellis des eval.png
Frame 102.png