Interactive self serve quiz

Planning for your retirement can be tricky. There’s a lot to consider, and the information you need will differ depending on your age and individual financial circumstances. Working with Media Super, we created the Retirement Toolkit: an interactive self serve quiz that helps Media Super members locate the most relevant retirement planning information for their lifestyle, age, and intended superannuation needs.

A simple but effective user flow

In designing the Toolkit, we first set about identifying common themes and stages in retirement planning. Since many of the actions involved in retirement planning are age-dependent, we decided to split our intended audience into four key segments: over retirement age, close to retirement age, under retirement age, and under 18. This segmentation allowed us to easily identify the specific information topics that would be relevant to each of these groups, and use those as the basis of the tool’s user flow.

To develop the user flow, we outlined a questionnaire that would be used to achieve this segmentation of users. The first question would of course need to identify the user’s age, but beyond that, there were a number of other demographic factors that would determine the types of actions and resources available to them. These included questions about their intended retirement timeline, their marital or de facto status, whether they owned property, and whether they currently make additional contributions to their super. The answers to these questions would determine the content they would ultimately be presented with.

Action-oriented content

To ensure that the content presented at the end of the quiz was providing true value to the user, we opted for an action-oriented approach to content design. Each content section includes a brief summary of the relevant topic, including links to further reading on the Media Super website, or to alternative sources of reputable information, such as the Australian Taxation Office. At the close of each section, the user is presented with a ‘To do’ item, which identifies opportunities for them to take action with their own super.

To make things easier to understand, we opted to group the content into lifestage milestones, focused on the period leading up to retirement, what happens during retirement, and other financial considerations to keep in mind. Each milestone was assigned a colour, which visually grouped the information and helped the user orient themselves to the time period in which each action would become relevant.

Creating context through illustration

To further contextualise the information and actions, we created a series of custom illustrations representing key concepts in the page content. This decision reflected insights from a recent content testing project, where users had expressed a preference for infographics to accompany information-dense pages. Not only did these illustrations add visual interest, they also helped to explain and summarise the information points in a visually engaging way. By presenting complex information alongside bright, simple illustration, the cognitive load on the user is reduced, making the content more digestible.

Dynamic page creation through Vue.js

We developed the Media Super website using Vue.js, and decided to use this same framework for the Toolkit application due to its built-in flexibility for implementing animation and state management.

Each user segment has its own results page, and for each content block within those pages, there are a variety of possible results based on the user’s responses to the questionnaire. The user’s responses are passed through the URL as parameters, and the content blocks are either hidden or shown accordingly. We used Twig templates to verify URL parameters, with the response content being managed by Craft CMS.

Flexible content management over time

The questionnaire was hardcoded to ensure that the user flow remained accurate over time and no new variables were introduced. The results pages are content manageable at a content block-level, to provide Media Super with the flexibility to update the content in line with changes to super legislation.

Sharing and saving results

Because the results content is personalised to the user, the results pages are not indexed and cannot be accessed without first completing the questionnaire. To provide users with the ability to easily share or print their results, we created a series of share CTA buttons. The ‘Email’ button dynamically generates a shareable link, while the ‘Copy link’ button copies the URL to the clipboard. We also designed a custom design treatment for a printable version of the page, altering image size and alignment, removing hyperlinks (which provide no value in print form) and removing background colours to improve legibility and save the user valuable printer ink.

The Retirement Toolkit provides Media Super members with a simple way of finding the most relevant retirement planning information for their life situation. The new content delivers on the outcomes of recent content testing activities, aligning with user expectations and preferences. The Toolkit also allows members to self-educate before contacting Media Super, reducing the workload of internal teams and allowing for more productive member conversations.