Ben Harvey
Charity Collaboration
National Autistic Society and Barnardos Charity Collaboration web development
The Project
This project was a great initiative to integrate two charities and share confidential data between them. The seamless transition from their websites to a patient portal benefited all stakeholders involved. The main tasks for this were to make both websites more accessible, to make the websites more engaging and to allow more users to refer to the service and therefore get help from the charities.
Services
UX Research
UX Design
Post Release BAU
Production tools
Adobe XD
Adobe Illustrator
Miro
Jira
Lead Time
20 Months Contract
6 Months Research
12 Months Design
4 Months Post Release
Research
Stakeholders gathering
Usability study
Heuristic evaluation
Card sorting
Outcomes
Accessibility features
28% engagement increase
WCAG Brand guidelines
​
Design
Design Architecture
Branding alignment
LO-FI artifacts
Figma prototypes
Process
Role
To engage more users to refer into the NHS via Barnardos and NAS, the process involved thorough research to understand the current referral system and identify barriers, followed by strategic planning to address these gaps. This included defining clear goals, developing targeted outreach and communication strategies, and ensuring alignment between all partners. Implementation focused on enhancing user engagement through training, support, and streamlined referral procedures. Finally, continuous evaluation and feedback mechanisms were established to monitor progress and make necessary adjustments, ensuring a seamless and effective referral process.
UX Designer: Conducting Quantitive and Qualitative research, identifying behavioral user needs, Design on Figma and redeploying the website using HTML and Javascript
User Research
Partnership Approach
-
The Design Team are willing to work in partnership with Alliance partners to create a SystmOne unit that is configured to their needs within the overall confines of SystmOne.
-
The relationship will be based upon mutual respect and collaboration – it is not a supplier / customer relationship.
-
Each partner will need to commit, time, energy and resources to the creation of their unit – it cannot be created without them
-
A clear scope will be agreed upon with each partner and any additions to the scope will have to be impact assessed and specifically agreed.
-
Sign-off will be required at each stage of the build to ensure that the end product is fit for purpose and will be used.
-
NHS, NAS and Barnardos will use the same accessibility features for their websites
​
Accessibility Testing
From heatmaps of current websites, user groups and video recordings analysis of how the users
Accessibility is crucial for ensuring that individuals with visual impairments or colour blindness can effectively perceive website content. To enhance readability, it is recommended to use techniques such as sufficient contrast ratio between text and background colours, taking into account colour blindness considerations, and using a default tone of voice. The Web Content Accessibility Guidelines (WCAG) suggest a minimum contrast ratio of 4.5:1 for normal text and 3:1 for large text (18pt or 14pt bold). Tools like Color Blindness Simulator can help identify how colour combinations appear to different types of colour vision deficiencies.
Ideation
​
Web Design
For the websites of NAS and Barnardos, we prioritise web design and accessibility to ensure that all users can easily navigate and access the information they need. Our team of experts works to create visually appealing designs that are also user-friendly and accessible to individuals with disabilities. We believe that every user deserves an equal opportunity to access the content on our websites, and we strive to make that a reality.
Design
​
Referral in development
Creating a patient data dashboard for the NHS, ensuring compliance with accessibility guidelines outlined by the National Autistic Society (NAS). Key responsibilities included integrating features such as clear navigation, readable text with appropriate font sizes and contrast, keyboard accessibility, and compatibility with assistive technologies. Conducted user testing and gathered feedback to iteratively improve the dashboard's accessibility and usability.
Accessibility
When designing websites for users with ADHD, autism, and digital ineptitude, it's crucial to consider specific accessibility factors to ensure an inclusive and user-friendly experience. Here's an overview of the key considerations, how they align with the Web Content Accessibility Guidelines (WCAG), and how these were factored into the new website design for charities like NAS (National Autistic Society) and Barnardo's.
Key Accessibility Factors
-
Simplicity and Clarity:
-
Why: Users with ADHD and autism often benefit from clear, concise information to avoid cognitive overload and distractions.
-
How: Use straightforward language, avoid jargon, and structure content in a logical, easy-to-follow manner.
-
-
Consistent Navigation:
-
Why: Predictable navigation helps users with autism and digital ineptitude find information quickly without confusion.
-
How: Implement a consistent layout and navigation across all pages.
-
-
Visual Hierarchy:
-
Why: A clear visual hierarchy helps users with ADHD focus on important information.
-
How: Use headings, subheadings, and bullet points to break up text and highlight key points.
-
-
Minimal Distractions:
-
Why: Users with ADHD are easily distracted by animations, auto-playing media, and cluttered interfaces.
-
How: Limit the use of animations, avoid auto-playing videos, and maintain a clean, uncluttered design.
-
-
Accessible Media:
-
Why: Ensuring that all users can access media content is vital, especially for those with various disabilities.
-
How: Provide captions for videos, alt text for images, and transcripts for audio content.
-
-
Keyboard Navigation:
-
Why: Some users with autism and digital ineptitude might rely on keyboard navigation.
-
How: Ensure all interactive elements can be accessed and operated using a keyboard.
-
-
Readable Text:
-
Why: Users with ADHD and digital ineptitude might struggle with reading dense or complex text.
-
How: Use larger fonts, high-contrast text, and avoid long paragraphs.
-
Aligning with WCAG
The Web Content Accessibility Guidelines (WCAG) provide a framework for making web content more accessible. Here’s how the key considerations align with WCAG principles:
-
Perceivable:
-
Text alternatives for non-text content (WCAG 1.1.1).
-
Provide captions and other alternatives for multimedia (WCAG 1.2).
-
Use sufficient contrast to make text readable (WCAG 1.4.3).
-
-
Operable:
-
Make all functionality available from a keyboard (WCAG 2.1.1).
-
Provide users enough time to read and use content (WCAG 2.2.1).
-
Avoid content that may cause seizures (WCAG 2.3.1).
-
-
Understandable:
-
Make text readable and understandable (WCAG 3.1).
-
Make web pages appear and operate in predictable ways (WCAG 3.2).
-
Help users avoid and correct mistakes (WCAG 3.3).
-
-
Robust:
-
Maximize compatibility with current and future user tools (WCAG 4.1).
-
Implementation in the New Website Design
Here’s how these considerations and WCAG guidelines were integrated into the new website design for NAS and Barnardo's:
-
Simplicity and Clarity:
-
Design: The website features a clean layout with straightforward navigation menus and minimalistic design elements.
-
Content: Content is written in plain language, with key information highlighted through the use of headings and bullet points.
-
-
Consistent Navigation:
-
Design: A consistent header, footer, and side navigation bar are present on all pages, ensuring users can easily find their way around the site.
-
-
Visual Hierarchy:
-
Design: The use of distinct headings, subheadings, and sections helps break up content and guide the user’s eye to important information.
-
-
Minimal Distractions:
-
Design: The website avoids auto-playing media and excessive animations. Interactive elements are simple and non-intrusive.
-
-
Accessible Media:
-
Design: All images have descriptive alt text, videos include captions, and audio content comes with transcripts.
-
-
Keyboard Navigation:
-
Design: All interactive elements such as buttons, links, and forms are operable via keyboard, with visible focus indicators.
-
-
Readable Text:
-
Design: Text is presented in a readable font size, with high contrast against the background. Long paragraphs are broken into shorter, manageable chunks.
-
By adhering to these accessibility factors and WCAG guidelines, the new website for NAS and Barnardo's ensures a more inclusive and user-friendly experience for individuals with ADHD, autism, and digital ineptitude.
Recite
From user testing it was clear that some accessibility needs were not met. Therefore I searched around for a toolbar that could cope with the needs of the users. Implementing the Recite function into a website demonstrates a commitment to accessibility and inclusivity. People have different needs and preferences when it comes to consuming digital content. Recite caters to a wide range of users, including those with visual impairments, dyslexia, or other reading difficulties, as well as non-native speakers who may benefit from translation features.
Outcomes
The outcome of redesigning the NAS and Barnardos websites to facilitate direct referrals for children with ADHD and ASD into the NHS resulted in significantly improved access to healthcare services. Key outcomes included:
-
Increased Referral by 40%: There was a noticeable increase in the number of referrals, as the streamlined process made it easier for parents, educators, and healthcare professionals to connect children with the necessary NHS services.
-
Enhanced User Experience: The redesigned websites offered a more user-friendly and intuitive interface, providing clear guidance and resources for parents and referrers, thus reducing confusion and delays.
-
Improved Access to Information: Comprehensive and easily navigable information on ADHD and ASD was made available, helping users to understand the conditions better and the support available.
-
Strengthened Collaboration: Enhanced integration and communication between NAS, Barnardos, and the NHS facilitated more coordinated care and support for children, ensuring a more holistic approach to their needs.
-
Data-Driven Adjustments: The implementation of continuous feedback and monitoring systems allowed for ongoing improvements based on user experience and outcomes, ensuring the process remained effective and responsive to needs.
​
Struggles and Challenges
The redesign of the NAS and Barnardos websites to allow direct referrals into the NHS for children with ADHD and ASD faced several struggles and challenges:
-
Technical Integration: Ensuring seamless integration between the NAS, Barnardos, and NHS systems was technically complex, requiring robust IT infrastructure and compatibility across platforms.
-
Data Privacy and Security: Handling sensitive health information while complying with stringent data protection regulations, such as GDPR, posed significant challenges.
-
User Adoption: Encouraging users to adopt the new referral system involved overcoming resistance to change, especially among those accustomed to the previous processes.
-
Stakeholder Coordination: Aligning the objectives and operations of multiple stakeholders, including different departments within the NHS, NAS, and Barnardos, required extensive coordination and communication.
-
Feedback Implementation: Continuously gathering and implementing feedback for ongoing improvements was challenging, necessitating a flexible and responsive approach to system updates.
-
Cultural and Behavioral Barriers: Addressing cultural and behavioral barriers among users, such as stigma associated with ADHD and ASD, was crucial for ensuring engagement and effective use of the referral system.
Post Launch Evaluation Feedback
​
-
"…it was good again to be able to see the other services that are recording on the patient file and where the child's been in terms of assessment and diagnosis and the time frame for that" ​
-
"It’s been really easy to navigate and access...it’s been really easy to use.”​
-
“It is fit for purpose. What has been delivered is really positive” ​
-
“They did it at the pace and they did it with the understanding that us as a team needed, and they were just really lovely... They were really supportive. It was a good team to work with.”
