Successful UI prototype design and comprehensive design system for this SaaS web app, adhering to the existing brand guidelines. The project included redesigning the existing SaaS webapp to create a more cohesive interface design that did not interrupt existing users’ workflows.

CHALLENGES

  • A dense volume of information is presented to users in a widescreen format.

  • Required to use established industry colour scheme (DDMRP primary colours).

  • Changes to the UI or functionality must not inconvenience power-users.

UI Interface Design – Before and After

BeforeAfter

SERVICES

  • UX research into the existing product usage and complexity.

  • UX testing through focus groups on how power users use and work on the existing system.

  • UI design, including microcopy, icon set creation and chart design.

  • A comprehensive design system, including documentation for ongoing use in all areas of the system.

Graphs and Colours – Before and After

BeforeAfter

RESULTS

  • Logical and consistent header and footer navigation creates more space for important information.

  • Using neutral colours and white space for the interface elements creates a more relaxed experience.

  • Implementation of the design system required did not require drastic backend changes.

Column Panel UI Designs – Before and After

BeforeAfter