Designing a safe, inclusive, and supportive resource hub for parents navigating new autism diagnoses
Designing a safe, inclusive, and supportive resource hub for parents navigating new autism diagnoses
Spectrum.com
Spectrum.com
Spectrum.com
✅ The Challenge
When a child is newly diagnosed with Autism Spectrum Disorder (ASD), the journey for parents can be overwhelming filled with confusion, isolation, and a desperate need for reliable support. But most resources online are either too clinical, not accessible to users with disabilities, or lack emotional warmth and guidance.
Spectrum was born to change that. It’s a digital space where parents of autistic children including those with physical, visual, cognitive, or auditory impairments can learn, connect, and grow, all in a way that respects their diverse needs and lived experiences.
When a child is newly diagnosed with Autism Spectrum Disorder (ASD), the journey for parents can be overwhelming filled with confusion, isolation, and a desperate need for reliable support. But most resources online are either too clinical, not accessible to users with disabilities, or lack emotional warmth and guidance.
Spectrum was born to change that. It’s a digital space where parents of autistic children including those with physical, visual, cognitive, or auditory impairments can learn, connect, and grow, all in a way that respects their diverse needs and lived experiences.
My Role
UI/UX designer
Visual designer
Prototype
Platforms
Web
Year
2024
👩💻 My role
As the sole designer on this project, I led the entire UX process from concept to high-fidelity prototype, including:
Accessibility research and disability modeling
Persona creation and scenario mapping
Paper prototyping and high-fidelity design
UX writing and multi-device design
Usability testing with quantitative and qualitative analysis
As a product designer on the Paysmosmo team, I collaborated with stakeholders to:
Identify and address usability issues within the existing product.
Redesign the user interface for both web and mobile platforms.
Integrate savings and investment features into the new design.
Conduct user testing throughout the development process to ensure a seamless user experience.
🧠 Research & Empathy
I explored both medical and social models of disability, understanding that impairments don’t define limitations environments do.
I also conducted extensive research into assistive technologies, Web Content Accessibility Guidelines (WCAG 2.2), and emotional needs of parents raising autistic children.
As a product designer on the Paysmosmo team, I collaborated with stakeholders to:
Identify and address usability issues within the existing product.
Redesign the user interface for both web and mobile platforms.
Integrate savings and investment features into the new design.
Conduct user testing throughout the development process to ensure a seamless user experience.
🛠️ Problem Statement
How might we design a fully accessible and emotionally supportive digital platform that helps parents of autistic children find resources, community, and guidance?
How might we design a fully accessible and emotionally supportive digital platform that helps parents of autistic children find resources, community, and guidance?
🎯 Target Users
I developed four inclusive personas, all parents of newly diagnosed autistic children, each with unique accessibility needs:
David: Physically impaired (spinal cord injury), uses a keyboard and wheelchair
Sophia: Legally blind, relies on screen readers and braille
Liam: Hard of hearing, uses sign language and captions
Emily: Has dyslexia, prefers audio content and clean typography
These personas guided every design decision, from navigation to content structure to interaction feedback.
As a product designer on the Paysmosmo team, I collaborated with stakeholders to:
Identify and address usability issues within the existing product.
Redesign the user interface for both web and mobile platforms.
Integrate savings and investment features into the new design.
Conduct user testing throughout the development process to ensure a seamless user experience.
🧩 Key Features & Design Highlights
🏠 Accessible Homepage with Structured Navigation
A clear hero section, accessible nav bar, and modular content blocks help reduce cognitive overload. Keyboard-friendly from top to bottom.
📚 Explore Resources with Filters & Categories
Users can search or filter autism-related video resources. Each video includes: Closed captions, Sign language interpretation, Optional audio description and Transcripts.
Users can search or filter autism-related video resources. Each video includes: Closed captions, Sign language interpretation, Optional audio description and Transcripts.
💬 Community Forum
Parents can connect anonymously, share stories, or ask questions.
Features include:
Login to verify authenticity
Trending topics and top discussions
Follow/favourite community contributors
Designed for: Emily (cognitive load reduction) and David (keyboard navigation)
Parents can connect anonymously, share stories, or ask questions.
Features include:
Login to verify authenticity
Trending topics and top discussions
Follow/favourite community contributors
Designed for: Emily (cognitive load reduction) and David (keyboard navigation)
🤖 Autism-Trained Conversational AI
An in-app chatbot allows users to ask questions about autism care, behavioural signs, therapy options, and more — with natural, supportive responses.
Update after testing: Added voice input support for users who prefer or need speech interaction.
An in-app chatbot allows users to ask questions about autism care, behavioural signs, therapy options, and more — with natural, supportive responses.
Update after testing: Added voice input support for users who prefer or need speech interaction.
🎨 Inclusive UI Design
Dark mode: Reduces visual fatigue, especially for older users
Font, Helvetica Neue: Clean, legible, and dyslexia-friendly
Optimised spacing: Line height, paragraph spacing, and contrast tuned for readability (Emily’s use case)
♿ Inclusive by Design: Accessibility Standards Met
♿ Inclusive by Design: Accessibility Standards Met
Each persona’s accessibility needs were mapped to specific WCAG 2.2 guidelines:
Each persona’s accessibility needs were mapped to specific WCAG 2.2 guidelines:
Physical
AAA
David
Full keyboard navigation, focus indicators
Visual
AA
Sophia
Audio descriptions, screen reader support
Hearing
AAA
Liam
Captions + sign language for videos
Cognitive
AA/AAA
Emily
Text spacing, color contrast, descriptive headers
📱 Multi-Device Support
The site is fully responsive across phones, tablets, and desktops.
💡 What I Learned
Accessibility is not an add-on, it must be baked into UX from the start.
Users with impairments want independence, not sympathy.
Emotional design and assistive tech can (and should) coexist.
A parent in distress needs tools that feel clear, warm, and empowering.
Improved Usability: Users reported a more intuitive and seamless experience, particularly with the BNPL process.
Enhanced Accessibility: The responsive design allowed users to interact with the platform effectively across various devices.
Increased Engagement: Integration of financial tools led to higher user engagement and satisfaction.
