McMillan Shakespeare Group

Re-design of Salary Packaging Platform

As part of McMillan Shakespeare Group’s digital transformation, Cognizant initiated the re-platforming of the online portal for RemServ — a key brand helping customers manage their salary packaging accounts. Recognising an opportunity to elevate the product’s design and user experience, Cognizant brought me on as a product designer to lead the UX and visual redesign.

Role

Design Lead

Date

09 November 2022

MMSG Cover Image

Bridging the Gap Between Assumptions and Insights

Early in the project, I noticed that user research wasn’t yet embedded in the organisation’s decision-making process. To move forward effectively, I needed a way to quickly gather insights, validate assumptions, and demonstrate the value of user-centred design to key stakeholders.

I brought together colleagues and executives who were closest to the customers day to day experience. Through a series of structured workshops, we surfaced key assumptions, aligned on primary pain points, and defined a clearer understanding of who we were designing for.

MMSG Affinity Mapping MMSG Empathy Mapping MMSG User Workshop

I was fortunate to get access to VWO earlier on in the project. Through VWO, I ran heatmap and clickstream tracking and an in-app feedback survey which collected over 300+ responses from everyday users. I also analysed Google analytics data to help understand red routes and goal completion.

We had to weigh up engineering time and effort and look for quick wins. I got the whole project team together and at a high-level we prioritised what we could tackle within the project timeframe.

Miro Survey Matrix Diagram

I ran a card sorting workshop with key stakeholders and leaned on our research findings to improve terminology and navigation.

Card sort workshop

Look & Feel Consistency

One of the clear needs was to improve the look, feel and consistency – not only to the new platform but also across all other experiences, including the mobile app and website.

Old look and feel Old app before design

Building out a design system

I aimed to set the foundations for other designers moving forward. I created the foundations of a style guide and component library in sketch with an improved focus on accessibility.

Using the new library and style guide, I mocked up early concepts showing how the platform could look.

Dashboard Style 1 Dashboard Style 2 Dashboard Style 3 Dashboard Style 4

With the project timeframe in mind, I was keen to get to work creating low-fidelity prototypes and start testing new concepts.

For speed, I used Whimsical to collaborate and prototype ideas – focusing on functionality and usability. We worked through many iterations of ideas and tested interactive prototypes with users in Invision.

Final Result

Login Screen Dashboard
Dashboard Mobile Dashboard Mobile Dashboard Mobile
Transactions
Transactions Transactions Transactions
Benefits Benefits Benefits Benefits Superanuation FAQs Screen Account Screen Account Screen Address