Kelvin Koh
Kelvin Koh
Healthcare · Responsive Design · Manager, Design
5 years after the release of the first iPhone, the world wide web was still catching up on how to deliver the optimised experiences for both large desktop screens and small handheld devices (bonus fact: the term 'responsive web design' was only coined in 2010). Early limitations in browser technology (famously held back by Microsoft's IE platform), meant that most solutions involved building both a desktop and mobile website while using browser detection to choose the appropriate redirect.
This however, came at a cost: two different experiences to design and two different sets of code to maintain. Given those costs, it was almost an obvious solution to suggest a responsive layout for the NHS Give Blood redesign to what is now a web standard.
In the early days of the mobile internet, the desktop experience (the assumption being the user was either at work or at home), assumed that the user was inexperienced with blood donation and focused on information and education with supporting content. On mobile, it was expected that user would be more action focused, so supporting content was collapsed to avoid distractions (and minimise load).
These days, with a rising percentage of users accessing the web solely via their mobile device, user needs should be assessed more carefully – a user could just as much be searching for information as looking to perform an action – here, proper analytics (where available) would be the best guide to design against.
While selection and booking on desktop should be quite straightforward, booking on mobile would be separated into other screens, focusing the user on one choice at a time.
Timeline views offer a way for regular donors to both keep track of their donation history – often a point of pride – and be reminded about their next appointment. Positive iconography like big YES "ticks" and congratulatory text encourage the user to continue their donations – while putting a more human face on the often clinical process of blood donation.