Sue Ryder

Charity begins at home - making localisation work for a national charity

Sue Ryder is a leading provider of palliative care that seeks to improve the quality of life for people requiring complex care. They operate in 13 care centres and over 300 charity shops across the UK, staffed by some 9000 volunteers. The charity offers individuals and their families’ choice and control over the care that they receive – even in the face of life challenging illnesses. Following a competitive pitch process, we were appointed to create a new digital visual language, as well as a new website and digital strategy inline with their new brand. The site is built on Sitecore 6.5 and uses the DMS as it personalises content based on user location, driving users to engage with their local care centers whilst encouraging them to make a difference by supporting the charity.

Research & Discovery

For this site we went through an extensive requirements gathering phase. We spent a lot of time considering and designing journeys for a number of different users. For this, as with all projects, we adopted a user centered design philosophy. Broadly speaking this was split into two distinct parts prior to any design working taking place.

  1. Research
  2. Persona development

The research phase comprised surveys, focus group workshops, user testing and interviews with users to understand their frustrations, wants, needs and desires. We then translated this knowledge into key user personas for a project. Creating personas to use throughout the project’s life cycle and beyond meant that we could test out ideas, thoughts and decisions as they arose. We are not the audience; we can only assume what a user thinks. Therefore personas are crucial to our user centered approach meaning that each time a designer or developer makes a decision they can ‘validate’ it against the persona because it’s not practical to speak to users every time a decision is made. The personas then go on to inform the information architecture, content strategy, prototyping, visual design, development and testing phases of the project.

personas

Following on from the creation of our personas, we began to develop those personas further by expanding them into mental models of their journeys both on and offline to identify opportunities for innovation to feed into the overall digital strategy. The models were also used to guide the creation of the site map and wireframes by referencing them to see what sort of content users required to complete specific tasks.

 

shopper_model

 

Detailed, annotated wireframes were produced for both the desktop and mobile versions of the site which became the blueprint for the components that we would create later on in the process and detailed key functionality.

 

wireframe

 

One of the key learnings of our discovery phase was that users relate and feel closer to individual care centers rather than the charity as a whole – more on that later.

Creating a Visual Language

From a visual design perspective, Sue Ryder has just gone through an extensive re-branding exercise and out job was to bring that alive online. Working closely with the brand agency, we translated the offline guidelines online and then developed them further with additional iconography and more.

iconography

This allowed us to create a detailed style guide and visual language document as we went through the design process. With large projects such as this that are split into multiple phases these documents prove an invaluable resource for making sure that, as is key in user centered design, buttons, headings, links, etc. are all consistent throughout the site. This also means we check that each module or component works independently e.g. does the navigation act & feel like navigation: is this form clearly labeled? Is the body copy large enough to read?

 

visual-language

typography

The visual language meant we were able to quickly identify shared components that could be easily translated into the CMS and be worked together to create a range of templates without them all having to be designed individually.

 

template-gallery

In essence, we use user centered design to create digital products that are intuitive and delightful for users without them having to change their behaviour or break their mental models in order to understand how to use it.

Technology & Features

The new website is built upon the award-winning, enterprise-level Sitecore CMS platform. Alongside Sitecore, there are multiple systems and applications integrated with the Sue Ryder website. The data from users who sign up or donate is passed to the Care CRM; the site is integrated with a postcode look up service to serve relevant data based on location. SagePay and Rapidata are used to process one-off and direct debit transactions respectively.

 

Screen Shot 2013-09-23 at 11.55.32

Cybertill, an EPoS and commerce system is used to power the shop section of the site. iTrent, a workforce management system is used to manage job applications and vacancies. Additional bespoke .net applications were created to help manage volunteering applications and crucially, the large range of events that Sue Ryder run or attend each year.

Component Based Approach

We developed Sitecore using a component based approach which means that Sue Ryder are in total control of the layout of their pages (using pre-defined components), making the site a content management dream.

drag-n-drop

Forms can also be easily added without any technical intervention needed using Sitecore’s powerful form builder tool.

Going Mobile

We have developed a mobile site that also personalizes content based on location. All of the site components have mobile optimised versions that are handled by Sitecore and populated by the main content database. Content can be different between the mobile and desktop sites, catering for different user journeys. This provides a robust mobile solution that can be easily updated by Sue Ryder’s content editors whilst delivering a first class user experience.

iphone_new

Geolocation

As we mentioned earlier from our research we learned that a potential supporter is more likely to get give their support if they can see the benefits to their local community. With that in mind the new Sue Ryder site delivers localised content (in both desktop and mobile versions) at all points of the user journey. Using the GeoLocation API we can identify a users location and serve them content appropriate to them. A user can change their location if they wish, but generally they will see news, events, shops, fundraising content that is relevant to the care centre near them that they already have a relationship with rather than national content. This takes place on the homepage and throughout the site in various areas, including an aggregated ‘local homepage’ for each care centre.

location



The Results

  • Vastly improved workflow and content management
  • Increase in online donations
  • Increase in event registrations
  • Much improved look and feel
  • Large percentage of users, using the Geolocation functionality
  • Fully optimised mobile site