The problem

The early years child development training was originally designed for users to complete their learning experience via a set of linear steps starting at module 1 and concluding with module 9.

Based on usage statistics and direct user feedback it was determined that this may be a barrier for some time-poor users. Additionally, it may also limit more experienced users who may be deterred from using the training if they felt the content of the earlier modules was too basic for their needs.

After an initial audit of the service, it was determined that in the first instance, the current user journey could be updated with no immediate impact on the user experience. The only changes required would be minor content edits and there would be no need for changes to current functionality.

Although the non-linear approach was now in place a challenge was identified around how the non-linear user experience could be better supported and enhanced further.

Our approach

Following the initial audit outlined above, an ideation exercise was carried out to consider future options for further enhancing and supporting the nonlinear user journey.

The ideas generated focused on addressing the following:

  • “How might we further support users who are completing the training via a non-linear path?”
  • “How might we highlight the non-linear pathway to increase engagement with later modules?”

Our suggested solutions were centred around 3 core values:

  • ensuring users would not miss important content
  • ensuring users would have a clearer understanding of their progress across multiple modules
  • ensuring it would be clear to users that they could complete the modules in any order

Several ideas were generated to enhance the user experience including:

  • adding a new question when users register for the service to assess how long a user has worked in the early years sector. This would allow content to be suggested based on a user's current level of experience
  • removing the numbers from the module titles so that users were not under the impression that they needed to be completed in a set order
  • an in-depth content review to remove any direct references to connected content
  • introducing a visual mechanism within a page to allow the content team to highlight a concise reference to a concept from a previous module
  • adding a recap section to the summary page to cover common concepts raised in a previous module
  • to provide the user with an indicator of their progress through a module prior to accessing it
  • provide suggestions for starting a new module when completing the current one
  • provide a suitability indicator based on the user's current level of experience

The initial set of ideas was then refined based on:

  • the wider impact on existing content
  • how they aligned to the services KPIs of engagement, retention, and confidence

Our solution

The in-depth content review was carried out as a separate piece of work.

After some further refinement and a playback to the team, 4 ideas were voted to be taken through to user research.

  1. a module progress indicator built into the module cards element on the ‘My Modules’ screen
  2. a recap panel in the module summary page
  3. a mechanism for recapping on earlier “key” concepts within the content
  4. an area for suggested modules at the end of the certificate page

The ideas that were not taken through were ruled out due to the following factors:

  • The impact on the existing content and the amount of rewriting that may block the delivery of future module releases
  • the initial way module content had been structured meant that it was too difficult to match content based on a user's specific experience levels

The module progress indicator

The indicator is designed to allow the user to view their current progress in any module that they have started without having to go into the module itself. The initial design concepts proposed:

  • an indicator as a percentage
  • a visual progress bar made from two GDS (Government Design System) colours
  • a sentence to indicate the number of pages remaining

Example image showing version taken forward for user research

Example image showing version taken forward for user research

User research outcomes

  • overall, we saw a positive response to the idea with most users indicating they found it to be useful
  • most users said they liked the use of the percentage value to indicate progress
  • users mentioned that it would allow them to make an informed decision about whether they would have time to complete a module or not
  • some users said they felt jarred by the number of pages remaining

Based on these outcomes it was decided that the next steps would include further refinement of the design based on the feedback prior to a build stage.

Final refined version

Example image showing the final refined versions of the card containing a progress bar

The final refined version of the progress bar included several changes and improvements based on further research and user feedback:

  • the card would have two states:
  • firstly, when the user has more than 20 pages remaining the information below the bar will state the number of pages they have read
  • secondly, when the user has 20 or fewer pages remaining, the information below the bar will state the number of pages they have left to complete
  • the card has a hover state that includes a more accessible colour combination based on the GDS button behaviour
  • a circle has been added to the bar to give a clearer visual reference on the user's progress and improve accessibility
  • the percentage statement uses a heavier font weight to give it clearer visual prevalence

Recap panel

Example image showing the recap panel design that was taken through user research

The recap panel appears within the module summary screen. It highlights common concepts that are covered in greater detail within a previous module. The panel allows users to be better informed and if necessary, review the earlier content before proceeding.

User research outcomes

  • overall users responded positively to the idea of the recap panel
  • most users understood its purpose

Although users responded positively, following testing it was felt that the idea of taking users away from their current point in the journey might be a barrier to their progress and that other solutions being tested would be more beneficial. The idea was therefore deprioritised and added to the ideas log to be potentially revisited.

Earlier “Key” concepts mechanism

The idea behind the new mechanism was to allow the content design team to have a method to recap on an earlier concept as it was being covered in the current content. This would ensure that a user who had missed this concept by skipping earlier modules would still be able to understand the reference.

The design to be taken forward for user research showed:

  • how the concept would sit within the main body of the page
  • an icon associated with an idea
  • a coloured line that would be different to the standard GDS blockquote but would indicate a similar purpose.

Example image showing version taken forward for user research

Example image showing the design for the key concepts idea to be taken through user research

User research outcomes

  • participants responded positively to the key concepts, even though they were not aware they were concepts from previous modules.

It was agreed that the concept could be taken forward for refinement and that the content team could establish a set of guidance for usage.

Refined version

Example image showing the refined design for the key concepts following user research

The refined version to be taken through to development incorporated the following changes:

  • a variation of the GDS details component to include a colour that reflects the training environment
  • the ability to collapse and expand the content as required
  • removal of the pre-fix term “Key concept:”
  • removal of the icon due to the possibility of users misunderstanding its meaning
  • a content rule to include no more than two paragraphs when using the prompt

Suggested modules

The suggested modules functionality is designed to be presented to a user as they complete a module. This would highlight to the user a suggestion of which module they may wish to start next and drive the continuation of the user journey.

The design that was taken through user research provided 3 suggested modules at the foot of the certificate page. In addition, it trialled the idea of removing the number prefix from the module title.

Example image showing version taken forward for user research

Example image showing version of suggested other modules taken forward for user research

User research outcomes

  • participants responded positively to certificates page.
  • the majority said they would use the suggested modules at the bottom of the page
  • some participants expressed confusion over the lack of module numbers

Refined version

Example image showing the refined version of suggested other modules

The refined version to be taken through to development incorporated the following changes:

  • both modules in progress and modules available to start can be shown at the foot of the page
  • the modules in progress would include the card progress bar
  • the module number prefix would still be included
  • modules would follow sequentially based on which modules the user had completed to date
  • if no modules were in progress the associated title would not be shown
  • if there were no available modules the associated title would not be shown
  • the green button with the option to view all modules would be moved to the bottom of the screen below the suggestions

Next steps

Engagement with users who are following a non-linear user journey through the training will be monitored and measured via analytics and database statistics against the current data.