Weave
Weave is a mobile app designed to help opioid users navigate their nearest harm reduction services (HRS) to access the resources they need, including medications, food, and housing.
Overview
Background
220 people in the U.S. died each day from an opioid overdose in 2021. In the era of the Opioid crisis, Pittsburgh is not an exception.
Collaborating with our client Dr. Joudrey from University of Pittsburgh Medical Center, our team aimed to create a mobile app to help individuals dealing with opioid addiction locate nearest services they need.
Task details
Create a simple mobile tool to help individuals dealing with opioid addiction locate and navigate local treatment centers.
Design to cater to the individual needs and values of target users, and provide ratings and recommendations.
Solution
We live, we weave!
On Weave, users can easily navigate the complex system with a simple and intuitive design, strictly created based on the lived experiences of clinicians and survivors.
02/ Problem Space
Context setting
What is Opioid Crisis?
This medical project required extensive preliminary research before we began. Because it was related to drug issues, common sense wasn't enough; it was important to set the context clearly. Here are the important concepts we clarified before starting the main task:
Opioids
are a class of drugs that include heroin, fentanyl, oxycodone, and morphine. Although very useful to treat pain, these drugs can cause physical dependency and addiction.
Harm Reduction
aims to minimize the negative health, social and legal impacts associated with drug use. It focuses on keeping people alive rather then forcing abstinence.
PROBLEM SPACE
What's wrong with the current harm reduction system?
An initial session with our client Dr. Joudrey gave us an overview of the overall landscape.
To better understand the audience, we conducted a literature review, focusing on qualitative data and first hand accounts of people navigating these resources. To synthesize the data we collected, we conducted affinity diagramming. We derived three key insights:
Lack of Real Time Data
Accessing services requires considerable effort and resources. Clients are burdened with searching through multiple websites and visit during working hours.
fear of stigma
Individuals hesitate to utilise available services due to the fear of being stigmatised or penalised. This fear of judgment acts as a significant barrier to seeking help.
Need for holistic support
Individuals need support services such as food, employment and housing which require navigating complex systems to seek out such supports.
problem statement
Through our initial research synthesis, we were able to reframe our problem statement, which specified the necessary features of our final product.
03/ Wireframes
& Client Feedback
competitive analysis & UX Inspiration
Analyzing benchmark points from existing apps
Analyzing benchmark points from existing apps: Because an app for drug use and harm reduction services is such a radical domain, there wasn't a direct competitor in the market. However, our client specifically wanted us to benchmark Yelp and other apps to help us build map and navigation features. We researched the UI/UX of apps including Yelp, Doordash, Airbnb, Yeoti (Korean plastic surgery app), Leafly (cannabis use and education app), Waze (live traffic and navigation app), and Resy (restaurant reservation app).
What is the structure of our app?
After identifying key features we need to include, we created a sitemap and app flow to better visualize the structure of our app.
Initial wireframes
Lo-fi Wireframes
To present our stage on our project and align with our client, we prepared low-fi wireframes based on the app structure. Here are the original slides we shared with our client, Dr. Joudrey. Colors were included to help our client visualize the final UI design.
Client Feedback
Refining wireframes based on feedback
After our wireframe presentation, we received valuable feedback from our client which encouraged us and clarified some points we must improve.
Link to the slide deck
Final wireframe
Refining wireframes based on feedback
Based on feedback from our client's team and the entire class, our team collaborated to improve the main features, categorizations, terminology, and UI of our wireframes. We were able to finalize our wireframe based on this input.
