A website with a mobile app that allows users to stream, save and search for videos on DIY projects.
Sole UX Researcher / UX Designer responsible for user research & testing,
wireframing, and low/high fidelity prototypes
December 2021 - January 2022
Adobe XD, Figma
Users did not have a way to share instructional and professional videos on a platform dedicated to learning new skills. This was the second project in my Google UX professional certificate.
Create a responsive website that allows users to find, save, and share instructional content while verifying the quality of content creators
User research was conducted through the use of general surveys that were given to a variety of participants of varying ages, ethnicities, gender identities and ability levels. This increased diversity during the testing phase and allowed me to minimize the occurrence of edge cases while designing the app.
After conducting user research it was clear that existing user pain points revolved around accessibility and quality of videos on traditional streaming sites such as Youtube. Users were frustrated to waste time browsing through unvetted content creators before they found something helpful.
After analyzing and synthesizing the results of the user survey I was able to gain 3 main insights.
Current sites provide users with difficult navigation and confusing pathways making it hard to move through the user flow.
open-upload sites do not verify the quality of their content creators, and often are cluttered with unhelpful videos and unmonitored chat forums.
Saving videos can sometimes be difficult on other sites which can be hard for users who need to return to a project after initiallyviewing the video
Creating user personas allowed me to imagine how different types of users would navigate the app. It was especially important for me to think about the situation in which the users would be using the app since location and context would greatly change the needs that users would have. For example, a user would be looking for a much different experience if they were actively working on a project and needed the videos for reverence versus if they were looking for new inspiration while sitting at home.
Creating a user journey map allowed me to think more about the context of when and how a user would want to use the app. This made it easier for me to identify pain points that could occur in different use cases. The main opportunities that I discovered through this process were creating shortcuts to the saved videos section, quick rewind/fast forward buttons, and making all CTA buttons large and easy to use for people who are actively working while watching the video.
For this project I was designing a responsive web app using a top-down approach, so I started with wireframes for the desktop version and then created ideas for the mobile platform based on the final layouts on desktop.
During the ideation phase, I came up with the following solutions to user pain points that I had Identified through user research:
Click here to view the wireframes for desktop platforms
.png)
After turning the digital wireframes into a low-fidelity prototype by connecting the screens I conducted a usability study with 5 participants. Participants were selected from a diverse group of ages, ethnicities, and ability levels to ensure the results would aid the overall accessibility of the site. During the study participants were asked to complete a series of tasks, and then were asked about the difficulties they had while completing each task. The participants used both desktop and mobile versions of the site during the study.
Users could not follow a creator from their profile page, only from their videos.
Users struggled to edit their preferred categories from the home screen.
Some navigational buttons are unclear and the users did not understand their purpose right away.
After conducting usability studies with my designs, I took user feedback into consideration and refined my original designs. By listening to users and making changes, my designs became more accessible to a wider audience. The main changes I made to my designs are as follows:
Click here to view the high-fidelity prototype for desktop platforms
Similarly to other projects that I have completed, this design project was shaped greatly by user testing. Creating a strong foundational understanding of the user and their needs by building empathy and doing research up front helped streamline the rest of the process and make sure that all user needs were fulfilled by my designs.
There are loads of design tools and software out there, and making the decision on which one to use is not always easy. For this project I wanted to push myself out of my comfort zone a bit and try something new, and I am very glad that I did. Working in Adobe after drawing up some ideas in Figma really showed me what other design tools had to offer, and made me feel comfortable picking up new software quickly.
Just because I am the only designer working on this project does not mean that I have to do it in isolation. Using my network I was able to reach out to other designers and colleagues to ask for feedback on my designs, and it gave me important insights that shaped the final product. Asking for feedback from other designers greatly helped me improve my designs
and approach problems with a different perspective even when I wasn’t required to.
Reach out about opportunities or just to say hi!
