Revert Skateboard Program
October 2022 - November 2022
Role and Responsibilities
Project Manager, Product Owner and UX Designer leading the app and responsive website design from conception to delivery including research, interviews, design, usability studies, accessibility considerations and prototyping.
Project Summary
Revert Skateboard Program is a fictional Kansas-based organization focused on reusing skateboarding supplies. Individuals and organizations can donate and request supplies to use in programs targeting at helping under-served and other disadvantaged populations through skateboarding.
The Challenge
How can we find a use for skateboarders' old equipment? Many skaters discard or keep their equipment because once it's no longer usable to them they are unsure of what to do with it. I wanted to design an experience that will allow skateboarders to donate parts – which can then be requested to use in programs that bring skateboarding as a physical, mental and creative outlet to disadvantaged and under-served communities.
Some skateboarders will give away old boards when they get a new one, but it's unclear if those boards are actually put to use when they're given away. This also doesn't help because the recipient doesn't have the rest of the necessary parts such as the trucks, wheels, bearings and hardware to mount them to the board in order to ride it.
Our users are skateboarders who want to recycle their equipment for future use and individuals, skateboarders or not, that need equipment for physical, mental and creative programs that skateboard parts would be useful in.
User Research
I conducted interviews to understand the users I’m designing for and their desires. All users interviewed were involved in skateboarding in some way - past skaters, family of skaters or current skaters. Many participants had never given away skateboarding supplies and were not in need of receiving supplies, but could see the use of reusing supplies in programs to help underserved populations.
Two user personas were created to help visualize the different use cases of the app.
Ideation
Crazy Eights
I used the Crazy Eights exercise to begin the ideation phase. By drafting screens before beginning digital wireframes, I was able to decide how to structure the website and where to place elements for usability.
Digital Wireframes
Once ideation was complete, I began to create initial designs for for the Revert app. These designs focused on ways to donate and find supplies in a local area.
Low Fidelity Prototype
I created a low-fidelity to utilize in user testing. The flow follows one of two options of finding a place to donate supplies or learning how to request supplies.
Usability Study
I conducted four remote unmoderated usability studies with participants in Kansas on the low-fidelity prototype. Each session was approximately 15 minutes.
It was found that users value the idea of donating both old supplies and money to an organization that will use it for charity programs. Users had trouble with navigation and a few pages being confusing for non-skaters. These challenges were noted and redesigned after the study.
Accessibility Considerations
A higher contrast UI using dark backgrounds and light foreground elements to separate content and improve legibility was implemented. I opted for using accessible gestures and scrolling to include a larger range of options for users.
Mockups
Based on insights from the usability study, I was able to improve navigation and separate pages to make the intent more clear. The donation page was confusing, but now includes a separate page explaining how the money helps.
An issue was raised during user testing about making sure supplies were being used as intended. A form was created for when users are applying for large amounts of supplies.
High-fidelity Prototype
The changes from the feedback of the low-fidelity prototype were used in production of the high-fidelity mockups and prototype.
Sitemap
Once the app design was completed, it was time to create a sitemap for the responsive desktop version. Very few changes were made through the process due to the site being small.
Responsive Designs
The design screens feature similar functionality but scaled to work better with size of mobile, tablet and desktop devices. More information is included as screen size increases.
Takeaways
Revert could be an actual tool that would find use through partnering with skate shops and skateboarders. Users didn't think much about donating used equipment, but after using the app, indicated they could see the impact of a service such as Revert.
Given the ability, some would donate or request supplies to use as a way to help individuals through skateboarding. Further testing is needed to determine functionality of responsive designs and implementation of planned, but unused, features such as downloadable resources and the shop section with Revert branded merchandise.