nhsuk / nhsuk-service-manual-community-backlog

This is a place for digital teams in the NHS to work together and develop the NHS digital service manual.
https://service-manual.nhs.uk/community-and-contribution
62 stars 5 forks source link

Stop users in a journey to tell them important information #241

Open GrilloPress opened 4 years ago

GrilloPress commented 4 years ago

What

Pattern in use by several services in the NHS, and many more outside, to interrupt a journey or transaction to tell users something important or helpful

Why

In use by:

As well as non-NHS services like Passport, Verify etc.

Anything else

Increased the number of successful transactions for NHS 111 Online by 10%. Significantly improved conversation rate and comprehension for Choose if data from your health records can be used for research and planning, NHS App and NHS login

Examples:

NHS 111 online

image

NHS login

image

Choose if data from your health records can be used for research and planning

image

NHS App

image

GrilloPress commented 4 years ago

Stop users to tell them important information

Use this pattern to stop users in a journey to tell them important information before continuing

When to use this pattern

In a transactional journey when you need to tell them something important.

Use this pattern when:

If you need users to understand two or three things. Try providing information just ahead of when a user needs it or use several pages in a row.

When not to use this pattern

Do not use this pattern:

How to use this pattern

Research

The “Choose if data from your health records can be used for research and planning“ team found that:

111 Online team found that users were more likely to complete a transaction when told that more questions meant a less serious diagnosis.

111 Online saw a 10% increase in completed journeys after using a page to interrupt users.

Outside of the NHS:

GrilloPress commented 4 years ago

Other links

https://github.com/alphagov/govuk-design-system-backlog/issues/27

chrimesdev commented 4 years ago

The recent 'Ask for a coronavirus test' service has this interruption page in the middle of a transactional journey. I need to find out what user testing has been done on this page.

Screenshot 2020-05-22 at 10 12 07
henocookie commented 4 years ago

Whilst conducting usability testing on the sign up to be contacted for coronavirus vaccine studies service, which uses an experimental stop users in a journey to tell them important information pattern, one user made the following comment when asked why they quickly moved onto the next screen:

It's just giving me a flavour of what questions are coming

but appreciated that the design gave them a preview of the questions to come

Permission to contact - Health questions interruption

henocookie commented 4 years ago

@GrilloPress I just wondered if there was a hypothesis for the example of this pattern in the NHS App, which uses a different blue to the NHS blue?

GrilloPress commented 4 years ago

Two reasons for a different blue.

The mechanism works by being different. With the NHS blue being used for the navbar and any other website etc. you’ve come from, using the same blue. So it’s a case of standing out and we don’t really do that by using the same blue or a very similar one.

The NHS App blue was an improvement on contrast as well. So the default NHS blue does not have enough contrast for smaller fonts in white.

So we tweaked it to have a much stronger contrast. We also used a blue that rendered on what we’d call nhs grade monitors. So things like an old monitor your GP receptionist would use, rather than just the latest iPhones etc.

Ultimately, whatever exact shade is chosen it must:

  1. Be visually distinct from any other blue used. As the mechanism relies on it being very different
  2. Be a good enough contrast with small white text
  3. Work on a range of quality monitors and devices found in use in the NHS
BrieWhyatt commented 4 years ago

Screenshot 2020-08-21 at 12 51 23

We recently tested a version of the interrupt card pattern that featured a small checkbox to give the users an opportunity to see less of the interrupt screen. This was due to feedback from the app that suggested users were inconvenienced by being interrupted too often if they were frequent users of the third party services within the app.

However, the recent research (23/08/2020) showed that changing the pattern was not necessary for now because:

  1. No users checked the box without being prompted, they intuitively clicked continue as the fasted route to get past the page.
  2. Most users could not articulate the purpose of the basic interrupt screen (no checkbox), suggesting that they don't understand what they would be opting to see less of.
henocookie commented 2 years ago

NHS login recently completed user research for the Prove Your Identity (PYI) user journey when users set up NHS login. Kirsty Ramsay-Hogan, a User Researcher on the team, shared that during usability testing with a participant using a colour contrast tool, they found:

a sudden interruption box with white text in a blue box (after consistently grey background) causes issues for those with personalised colour contrast tools and affects their ability to read what is on the screen. We should strive to keep our backgrounds as consistent as possible to avoid this occurring.

An example user journey where the interruption screen appears in an NHS login user journey is when a user's information is being checked and could take "up to 2 hours":

Example NHS login user journey flow where an interruption screen appears telling a user they may need to wait up to 2 hours for their information to be checked
GrilloPress commented 2 years ago

We tested less arresting colours or different backgrounds and they didn't work for any user. The affect only works if it is quite different.

Did the User researcher say what issues it caused? Was it that the tool was configured personally and didn't give a good contrast or something else? Or did it cause pain or other issue?

The blue card was tested on 6 different common contrast modes and with numerous rounds in the digital accessibility centre.

The point of an interruption is to interrupt. So as such it should be quite different. Keeping it the same renders it useless as shown by user research.

It might be good to keep it as quite a rarely used thing. In fact, it should be last resort. And a thank you we're checking page might not be such an instance. Though the login team may have initially found it to be needed

henocookie commented 2 years ago

Kirsty Ramsay-Hogan shared notes that were taken from the user research session. It was one user so not a definite finding and worth doing more user testing around.

Some key user quotes and an observation from the user research session:

"ah ok this is the bad bit - the bit where I can't read it"

"That box. I'm not sure what colour it is, but the background and the text are blending in together quite a bit. It's quite glaring."

user has to magnify text to one word per screen to be able to read it

Post-it notes from a NHS login user research session
GrilloPress commented 2 years ago

Be great if they could send across the colour / set up. Might be something the team could tweak in either the colours or implementation

henocookie commented 2 years ago

Be great if they could send across the colour / set up. Might be something the team could tweak in either the colours or implementation

I have asked a Designer in the NHS login team if they are able to jump into this discussion 😄 Awaiting a response

LydiaTeebay commented 2 years ago

Hi, sorry for the delay!!! The pages that were tested that resulted in those comments are similar to that attached. nhs-cid herokuapp com_service-access_v24_service-access-start_service=app6 serviceName=NHS%20app devMode=false lsId=undefined lsAccess=undefined lsStudy=undefined emailAddress=undefined mobileNum= idType=undefined formerror=undefined hi (1) (prototype links: https://nhs-cid.herokuapp.com/service-access/v24/service-access-start?service=app6&serviceName=NHS%20app and https://nhs-cid.herokuapp.com/service-access/v24/service-access-complete?service=app6&serviceName=NHS%20app) We are now going to suggest within NHS login that we avoid changing the background colour as this reverses the settings that users have selected themselves. Suggestion to go with a bold blue outline instead, if there is a user need. We are losing the user need in a lot of places along the P9 journey because we have introduced new "steps pages" that have tested well: nhs-cid herokuapp com_service-access_v24_service-access-steps_1_emailAddress=undefined mobileNum= service=app6 serviceName=NHS%20app idType=undefined hidehead=undefined challenge=undefined lsId=undefined lsAccess=undefined lsStudy=undef (1) (prototype links: https://nhs-cid.herokuapp.com/service-access/v24/service-access-steps_1 https://nhs-cid.herokuapp.com/service-access/v24/service-access-steps_2 https://nhs-cid.herokuapp.com/service-access/v24/service-access-steps_3 https://nhs-cid.herokuapp.com/service-access/v24/service-access-steps_complete)

GrilloPress commented 2 years ago

Step cards seem a more appropriate use case for instructions. It'd be great if you could visualise an example of one with the border. I assume it tracks what 111 ended up with

sarawilcox commented 1 month ago

Related issue: Help users understand they're leaving an NHS service - interstitial page #531