My NCS
Skills: Accessibility | Agile | Content Development | Figma Prototyping | Journey mapping | Research | SEO | Strategic thinking | UX writing
A new website where users can browse NCS experiences and book a place.
NCS experiences help young people to grow their strengths, build confidence, and meet new people. ‘My NCS’ is a new website where users can browse those experiences, book a place, and find all the info they need about their trip.
I was brought onto the project as a copywriter but my role soon expanded into content design.
Project Overview
The Problem
The current booking process lacks clarity and transparency.
Imagine a teenager in Hull wants to book a place on an NCS experience. Currently, they have to go to the NCS website, fill in an online form with their details, and tick a box as to which type of experience they’re interested in doing. NCS then passes all that info onto a provider in Hull, who’ll contact the teenager.
At no point can the teenager browse the experiences and choose the one they’d like to go on.
The Goal
The goal is to create a new booking platform where users can browse the experiences and book a place.
The project KPIs were:
No reduction in the percentage of users who complete their registration (compared to the current process — which is an online form users fill out to let NCS know they’d like to go on an experience).
No need for Ingeus (the delivery partner) to require any extra resources (compared to the current process).
The Outcome
This project has not yet gone live, so I can’t report the outcomes.
On a personal level, an outcome I’m proud of is that I championed content design within this government arms-length body, and that people within the organisation now understand the importance of accessibility and user-focused content.
My approach: Finding ways to boost collaboration
When I joined the project, work was happening in silos. Copy, design, and build were all starting at the same time and there was little communication going on.
Copy was expected to be in a Google doc. Design jpgs were somewhere on the server. Tech flows were only visible to the developers. And the project manager was trying to juggle it all.
So I suggested moving the project into Figma.
This meant we’d be able to design in context, view the copy and design all in one place, collaborate more easily, and create prototypes to share with stakeholders. Plus, the project manager could breathe a sigh of relief!
Project constraints
The project had been in the planning for over a year before I joined the project, and certain decisions were fixed:
The main site needed to be behind a login.
Users needed to share a bit of personal data when registering for an account. (The previous registration process asked users for the same data.)
There was no scope to do user research or test prototypes.
Research
There wasn’t the scope to do primary user research, so I set about doing desk research. I spoke with various stakeholders within the organisation and looked at blogs written by teenagers who’d gone on NCS. Here are some of the insights I gained:
User groups. There are two target groups for My NCS:
Young people. 16 and 17-year-olds across England are eligible to go on NCS. People up to the age of 24 are also eligible if they have an education, health, and care (ECH) plan, are moving towards leaving the care of their local authority, or are receiving statutory support.
Parents, guardians and carers.
Routes to the website. Users could arrive at the My NCS website through several routes:
Social media
Word of mouth
School newsletters
The main NCS website
Searching online
Messaging from Ingues (the delivery partner)
Names. On the previous booking system, young people frequently didn’t enter their ‘real’ name.
Clarity. On the previous booking system, many users revisited the experience page when filling out which type of experience they wanted to book (presumably to double-check which type of experience they wanted to book).
Emotions. Teenagers often felt anxious or worried before going on their NCS experience.
User Stories
Based on the insights gained from my (limited) research, I set about creating user stories and acceptance criteria.
User Journeys
Combined with the user stories, mapping user journeys helped me identify content that was needed — but which was missing from the original copy brief. New content included:
Landing page. Because the main content will be behind a login, I realised we need a landing page because many users arriving at the My NCS site won’t know anything about what NCS experiences entail. Content on the landing page encourages users to create an account so that they can browse the experiences and book a place.
Reviews. Because some of the teenage users will be nervous or worried about going on an NCS experience, sharing reviews from people who’ve done NCS is one way to help ease their worries.
Price and bursary information. Because price is important to users, it needed to be more upfront in the journey (compared to the previous booking system).
Extra content pages. Because users would have questions about things like accommodation, activities, food, and travel, I added extra content pages for each of these topic (rather than having one lengthy FAQ page).
Initial user journey map
Language
There were a few aspects to consider when it came to language:
The language on the landing and login pages needs to speak to both audiences. (They’ll be directed to a version of the homepage where the language is tailored to them).
Use simple and inclusive language.
Keep SEO in mind (for pages not behind the login). Using Google Trends and Keyword Planner, I defined the main keyword as ‘NCS 2024’.
Maintain the NCS tone of voice. The tone is all about ‘doing’. Examples of brand statements include: Boost your confidence. Grow your strengths. Build your independence.
My approach: Being ambitious
Some stakeholders wanted to continue with ‘business as usual’ — doing things the same way as they’d been done before. But I saw the opportunity to create content which was more accessible, inclusive, and more user-friendly. The process wasn’t always easy, and the end result isn’t perfect, but it is a step in the right direction.
Creation
I followed these four principles:
Improve accessibility
Work how users want to work
Provide safety
Create clarity
A note on art direction
The art direction — including colours and fonts — follow that of the main NCS brand.
1. Improve Accessibility
To improve accessibility, I focused on various areas including:
Readability
Clear form labels, links, and buttons
Similar-looking elements function similarly
Readability
Not using all-caps
The brand typeface, Microgramma, is used in all caps across the main NCS website. I raised the issue that all caps isn’t great for readability, and the team agreed to allow lowercase on My NCS.
Using the brand typeface sparingly
The Microgramma typeface is not the most legible, so we agreed to use it only in headlines and buttons.
Left-aligned text
Text on the main NCS website is usually centre-aligned, but I raised the fact that left-aligned text is easier to read.
Other readability considerations
Contrast ratio. As per WCAG AAA recommendations, all text has a minimum contrast ratio of 7:1.
Structured headings. Content across the My NCS website is clearly structured with relevant headings.
The My NCS landing page.
Clear labels, links, and buttons
The previous booking system used dropdowns, and the designer on this project initially used these.
I suggested changing these to buttons as it means fewer clicks for users and provides greater clarity as they can see all options up front.
The original page by the designer is on the left — with a dropdown, unclear link, and a lot of text. The page after my revisions is on the right. It has clear headings, a choice of two buttons, clear links, and a lot less text on the page.
2. Work How Users Want To Work
Research showed that young people frequently didn’t enter their ‘real’ name during the registration process. Rather than this being seen as a ‘problem’, I saw it as an opportunity to create a sense of inclusivity and be welcoming for all teenagers including those who are trans.
Name fields
Rather than having the standard ‘First Name, Last Name’ form fields, I simplified this to one field: ‘Your Name’.
The descriptive text reads: ‘This could be your birth name, a nickname, or a chosen name — whichever you prefer’.
The first step in the registration process where young people enter their name.
3. Provide Safety
To increase the sense of safety, I reduced the possibility of frustration and confusion by providing users with feedback. I also created content to ease user worries, and used language to communicate that NCS is an inclusive and caring space.
Giving feedback
Whenever users selected an option, their choice was acknowledged in the headline of the next frame.
For example, if the person chooses to create an account as a young person, the headline on the next frame says ‘Creating an account as a young person’.
Once the user selects which type of account they want to create, the next frame mentions that account in the headline.
Acknowledging emotions
Young people could be anxious, shy, fearful, worried, excited, or feel a mix of emotions when thinking about doing NCS.
Their parents, guardians and carers could be concerned about the wellbeing of their teen.
Hearing from other people often eases fears or worries, so I added review sections to the homepages.
The homepage for parents, guardians and carers, with a review section.
The homepage for young people, with a review section.
Using inclusive language
A couple of examples of inclusive language:
Description text that acknowledges young users who don’t have a fixed address and those who split their time between more than one address.
Description text that acknowledges young users who are homeschooled or not attending school
Examples of descriptive text using inclusive language.
4. Create Clarity
Creating clarity leads to a better user experience.
Providing information upfront
If users have to hunt for the information they want or need it can trigger feelings of frustration or of not being deserving. Plus, it could also result in people not finding the info and then missing out on doing NCS.
On the previous booking system, the information about bursaries was hard to find. So, on this new website, information about bursaries now features clearly on:
The landing page
The homepage
The basket (before ‘checkout’)
The website menu
Information about bursaries is clearly featured on the ‘basket’ page.
Bursaries are clearly listed on the menu.
Explaining why information is being asked for
Date of birth
When asking young people for their date of birth, the body copy explains why that information is being asked for: ‘NCS experiences are designed for 16 and 17 year olds, which is why we need to know your date of birth.’
When asking for the young person’s date of birth the description text explains why they are being asked for that information.
Clear error messages
It can be frustrating for users to receive an error message. To provide clarity for the user, all error messages follow these rules:
Explain why there’s an error (without blaming the user)
Let the user know what they need to do
Provide a link so the user can contact customer support.
An example error message
Consistent product pages
The hundreds of NCS experiences are all run by different partners. Although NCS asks these partners to provide specific information, the reality is that the experience descriptions vary widely from partner to partner.
To provide greater clarity for users, I created a template to give the experience descriptions greater consistency.
Future Iterations and Testing
I moved on from NCS before the project went live, but I gave my recommendations for testing to inform future iterations. It would be valuable to do usability studies and research the impact of having content behind a login.
Outcomes and Learnings
As the project is not yet live, I don’t have data on how it met its KPIs.
The KPIs were not very ambitious, and I hope that future iterations are designed with the intention of increasing bookings (rather than maintaining the status quo).
My personal learning — which was more of a reminder than a new learning — was about how important it is to include content design from the beginning of the project. User needs can then be considered even in the early planning stages, which leads to a better product and more success for the organisation. This project would have benefitted from user research and usability studies, but with the constraints of the project I had to be pragmatic about what was possible.