Austism Rocks and Rolls: A Website Redesign Project
Redesigning and improving the website's user experience and accessibility.
Date
Aug-Dec 2024
Role
Web Designer
Company
Austism: Rocks and Rolls
At-a-Glance
During a four-month stint as UX/Web Designer for Autism Rocks and Rolls in 2024, I spearheaded a comprehensive website redesign. Through iterative wireframing and testing, I developed an accessible, multi-platform design system. Collaborating closely with co-founders, fundraisers, and the PMs, we launched a revamped site that attracted over 5k+ new users.
Problem
Autism Rocks and Rolls needs a more accessible, user-friendly site to effectively communicate its mission of autism awareness and empowerment across all platforms while accommodating diverse user needs and abilities.
Solution
The redesigned Autism Rocks and Rolls platform offers a seamless experience across all major platforms, catering to both new and existing users. Through multiple rounds of wireframing and testing, we enhanced accessibility and introduced improved features. The upgraded site now provides a more intuitive user experience, enabling the organization to reach a broader audience and better serve its supporters. This comprehensive overhaul ensures that Autism Rocks and Rolls can more effectively communicate its mission and engage with its community online.
Let's get some background on what Autism Rocks and Rolls is

The Challenge
State of the original website and some of the main pain points

Our Key objective for this project was to
Enhance accessibility to WCAG 2.0 standards
Increase user engagement
Create a more intuitive information architecture
Initial Data provided
The site was managed using these two platforms

For our primary stakeholders, Bitbucket and Airtable were challenging due to their technical nature. Bitbucket's complex interface and Git-based workflow were confusing. Airtable's database structure, while more user-friendly than traditional spreadsheets, still requires some technical understanding to set up and use effectively.
Analyzing similar websites
We analyzed several comparable services to identify best practices and innovative features that could be incorporated into our redesign.

Process
After conducting comprehensive user research and competitive analysis, we crafted a website design that aligned closely with user mindsets and motivations. Through iterative testing with five participants, we gathered valuable feedback and refined the design accordingly. This user-centric approach resulted in a significant increase in user satisfaction and overall experience.
Ideation and Design Process
To understand the entire structure of our platform we conducted thorough research into the information architecture to understand what exactly we were dealing with.

This gave us valuable insights on how we can improve content organization and hierarchy, navigation structure, and content gaps or redundancies to inform our design decisions and improve overall user experience.
Some of the WCAG 2.0 rules we integrated

We also integrated

This enabled tracking user behavior, identifying navigation issues, measuring engagement metrics, and monitoring page performance. This data helped us make informed design decisions and validate improvements in user experience.
Feedback we received from our prototypes

Testinomials from the Stakeholders
Future Implementations
As part of our redesign plan, we're providing website management training to stakeholders and co-founders. Additionally, we're developing an easy-to-use Framer template that will allow them to maintain and update independently, ensuring long-term sustainability of the platform.