This website was created for Autism Rocks and Rolls during a one-month stint as User Experience Lead as part of the IU Corps START Fall 2024 Project, 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.
Team
Duration
1 Month
November 2024
Tools
Figma
FigJam
Tech Stack
Next.JS
React
Founded by Sam Mitchell, a 20-year-old entrepreneur and advocate, Autism Rocks and Rolls, Inc. is a nonprofit dedicated to raising awareness and empowering autistic individuals. Sam’s mission is to break the stigma around autism, celebrating that people are differently-abled, not disabled. His nonprofit offers public speaking, podcast coaching, podcast editing, sponsorships, ad space, merchandise, public speaking, educational supplements, guest appearances, and guest space on his podcast to spread this powerful message.
The platform faced accessibility, content management, and user experience challenges, making navigation difficult. Non-technical stakeholders struggled with content updates. The project aimed to create a responsible website by enhancing accessibility, streamlining content management, upgrading UX, and integrating Google Analytics for data-driven insights.
Key Objectives
Enhance accessibility to WCAG 2.0 standards
This upgrade improves navigation, readability, and usability for all users, including those with disabilities.
Increase user engagement
We introduced dynamic content and interactive features to enhance user engagement.
Intuitive information architecture
Clear pathways ensure users can find information quickly and effortlessly
We developed a responsible website with enhanced accessibility, a user-friendly content management system, and an improved user experience. The new design ensures seamless navigation, empowers non-technical stakeholders to manage content easily, and integrates Google Analytics for data-driven decision-making.
Airtable and Bitbucket was challenging for primary stakeholders due to their technical expertise to manage the website.
Online tool for storing, sharing, and managing code projects
Bitbucket's complex interface and Git-based workflow were confusing.
Cloud tool for creating custom databases and spreadsheets
Airtable's database structure, while more user-friendly than traditional spreadsheets, still requires some technical understanding to set up and use effectively.
Auditing Current Website
We conducted a comprehensive audit to assess the website’s accessibility, content management, user experience, and analytics integration. Insights from this evaluation guided improvements to align with project objectives and enhance overall usability.
Analyzing similar websites
We analyzed several comparable services to identify best practices and innovative features that could be incorporated into our redesign.
User Testing
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 10+ participants, we gathered valuable feedback and refined the design accordingly. This user-centric approach significantly increased user satisfaction and overall experience.
Ideation
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
Optimized the placement of widgets to enhance user experiences and accessiblity
Intuitive icons, improved event visibility with location/price indicators, and organized service categories with consistent styling
Implemented consistent brand colors and optimized widget layouts to enhance content visibility
Consistent card-based layouts and replacing basic links with organized categories
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.
Color Palette
#
00A357
#
FFFFFF
#
000000
Typography
