TIMELINE:

Approx. 80 Hours

TOOLS:

Figma, Whimsical, Testberry, Notion, Figma Prototyping

MY ROLES:

End-to-end Product Designer

PROJECT TYPE:

Mobile app concept for Android devices.

Project Background

The concept of buddy is based on two non-profit organizations (Yedidim located in Israel and Chaverim which serves the greater New York area) that provide roadside assistance and other non-medical emergency help. In the year 2018 alone Yedidim had a total of 19,565 volunteers helping out in over 141,378 emergencies including 1,110 cases where they rescued children who were accidentally left inside hot vehicles. Additionally, over 6000 hours were logged from the organization's help hotline. Volunteers have helped out in a wide range of cases from helping people swap tires to rescuing school children trapped in elevators.
‍
Currently, those in need would call a service hotline. If the call agents are unable to solve the issue over the phone they add the request to a volunteer WhatsApp group. With the ever-rising surge in assistance requests, these organizations are looking for a way to operate in a more efficient manner.
Please note: The organizations listed above did not actually reach out to me. This project is purely conceptual.

Challenges

Before beginning the research stages of this project I sat down and tried to think of all the challenges that I'd have to deal with when designing the app. Most of the potential challenges were related to a user's interaction with an app in times of emergency, especially when they are feeling most vulnerable.

How can we get users to place their trust in the service and its volunteers?

How can we get users used to relying on an app instead of calling in about their issues?

How can we make the process for requesting assistance as simple and seamless as possible?

What can we do to ensure that users will remain calm during their ordeal?

Research Plan

Understand
‍‍Throughout the design process of this project, I’ll be referring to two organizations.
Chaverim- This is a roadside assistance non-profit currently operating in the North East Coast of the USA, serving the tri-state area.
Yedidim- Is a roadside assistance non-profit currently operating throughout all of Israel.
(Yedidim means acquaintances and Chaverim means friends in Hebrew.)

Research Step 1:
I reached out to multiple people that have used Chaverim in the past to find out what they needed help with and what the process was like.

The purpose of my research was to attempt to understand two things:
‍
USE CASES: What were the most common reasons that people called chaverim? This information will come in handy during the later stages of developing information architecture.
‍
EXPERIENCE: I wanted to try to understand what the experience was like, including what went well and what parts of the processes should have been easier. This was important because I wanted to make sure that the app wouldn't negatively affect the user experience of the service which I believe has been pretty positive even without an app.

Research Step 2:
I reached out to Yedidim & Chaverim volunteers. Although only the users’ app is being designed at this point, it was important to speak to volunteers to find out a bit more about their process so that I could understand what information they were provided within real-time before they went out on a call. Also, it is important to understand what kind of additional information they’d want, and what could make their jobs easier.

Research Results

User Feedback:
Via social media groups, I was able to reach out to 16 people who’ve required Chaverim’s assistance in the past.

Positive Quote:
“When I got stuck in the snow, I called them. A volunteer arrived within fifteen minutes and followed me until I got to clearer streets. I don’t know what I would have done without them”
‍
Negative Quote:
"I got locked out of my office when I accidentally closed the doors with the keys inside and the alarm system armed. I called Chaverim and waited three hours for them to arrive in -20F weather. They kept on telling me that somebody was on the way, but had no way of contacting them."

Insights Gained

‍The overwhelming majority of participants are generally happy with the service that they’ve received.‍

Some participants were unsatisfied by response times, and lack of transparency as to what was going on during the process.

Participants were opened to creating a system with more transparency in regards to volunteer information and response time, including the ability to contact a volunteer.

Participants were split as to whether they thought an app was needed, but they were opened to trying it.

Persona Development

The first step after I completed user research was to create two personas. One to represent a potential user, and the other to represent a volunteer. While I'm only designing the "user" app at this point, I felt that it was important to get into the head of a volunteer to gain the right perspective.‍

Shayna represents the "user". She's a strong willed mom who's always busy and has a lot on her plate.

Isaac represents a volunteer or "buddy". He is a popular guy who's always a pleasure to be around.

User Journey Map

I wanted to further delve into the world of Shayna, so I placed her in a situation where she'd need to use the buddy service. I created a timeline for each step of the process and mapped it out comparing the current method of calling for a volunteer with the new app concept. I gained important insights about the differences between calling for help using a hotline vs. an app which helped greatly later on in the design process.

UI Requirements Document

Using Shayna's experience as a model, I came up with a UI Requirements Document which detailed the pages that would need to be designed, user tasks, high-level requirements, and detailed requirements.

Product Map

Based on the UI Requirements Document as well as the feature prioritization exercise, I developed a product map, to help visualize the different steps in the process. I placed an emphasis on ensuring that the information architecture was clear and understandable.

User Flow

In this first step of the ideation phase, I delved further into the product map and charted a user flow showing all the possible routes a user would be able to take from setting up an account to rating a buddy and donating to the platform. The final prototype of the project will be based on this flow.

Task Flows

Next, I charted three specific tasks that I felt users would take most often. I chose each of these tasks based on the information that I gathered during the research phase.

Branding

Name:
The name buddy was chosen for this project to help keep it more approachable. People usually refer to a friend or acquaintance as a buddy, and usually feel comfortable to call them to ask for help. This service offers "pretty much anything you'd ask your buddy to help you out with".

Logo:
The lowercase b is meant to look like a location pin because there is always somebody willing to help wherever you may be on the map.

Colors:
When I first started working on this project, I envisioned the colors of the buddy app to be primary colors such as red, orange, or yellow, which are associated with warning or emergency. After completing my research, I decided that it was most important that users remain calm and trust the service. based on that I decided that the colors of the brand would be varying shades of blue which evoke feelings of calmness, trust, and professionalism.

Typography:
The "b" in buddy was purposely kept lower case in an attempt to keep inline with the key guideline of keeping the product approachable. 'Rubik' was chosen as the font because it is soft, yet professional looking.

Wireframes

Using the site map and user flow as guidance, I created low fidelity wireframes. I then went ahead and used the Figma prototyping app to conduct basic usability testing and tested the basic interactions which would help to ensure that there were no pressing issues that had to be changed before continuing to the next step.

UI Design

Pulling it all together I worked on developing and finding the perfect design. I did the best that I could to keep the UI as simple and straightforward as possible. Keeping in line with the brand, the UI sports various shades of blues and grays. Rubik is also the primary font in the design. This UI kit served as the design system which was used for the prototype.

Prototype

After adjusting some of the UI of the wireframes I began to design the prototype which would be used for usability testing and later handed off to the engineering team for development. In order to enhance the interface and experience, I followed the guidelines that I had set up in the UI kit. Due to time constraints, I was only able to complete a few flows, but I was able to cover most of the app. In this prototype, users can set up an account, request assistance, rate their buddy, and donate. They also have the ability to view their account history and add an additional donation.

The prototype was originally posted using Invision but was switched to Figma prototyping as it is easier to make minor iterations using that platform. Furthermore, Figma's smart animate feature enables the app to look even more realistic.

View Enlarged Prototype

Usability Testing

Usability testing was divided into six tasks to gauge how potential users would perform when completing them. Each task is followed by four simple open questions. The test results were recorded using the Useberry Platform.

TASKS:
Task 1. Navigate the "Sign-up Flow".
Task 2. Navigate the " Request Assistance Flow".
Task 3. Navigate to "Volunteer Details Page".
Task 4. Navigate the "Cancel Session Flow"
Task 5. Navigate the "Donation Flow" and leave a donation.
Task 6. Access the "Profile Page" to view Session History.

UNDERSTAND:
Were the participants able to complete the entire task?
Where did the participants seem to experience the most difficulties?
How long did it take to complete each task?

QUESTIONS:
1. Please rate the level of difficulty of the task from 1-5.
2. How did you feel while completing the task?
3. What stood out to you the most?
4. What change would you implement and why?

KEY FINDINGS:
Overall, participants felt that the interface was simple, straightforward, and easy to use. Participants were able to get through the request flow quickly which was important. However, they did discover some issues with continuity. For example, users are currently unable to change details of their request without canceling it which is a major pain point. The design definitely met its first round of usability test goals, but further iterations need to be made.

CONCERNS:
Because buddy provides services to those who need emergency assistance, it is safe to assume that the actual users would be under much stress. While the app designed proved to be easy to use in non-stressful environments, the usability testing that was carried out took place under ordinary stress levels.

Next Steps

Iteration: I need to return and iterate the interface based on feedback and testing results. This includes: Adjusting the microcopy to a more uniform language across the platform, creating a menu option for accidents and vehicle break downs (so that users can simply select choices instead of typing their issue), and reviewing the interface to find solutions for all continuity issues.

Testing: Once the major adjustments and iterations are complete, I'd conduct an additional round of testing, this time placing an emphasis on stress to see how well participants perform.

Additional Design- DIY: I'd like to go ahead and begin designing the "do it yourself" section which provides instruction for anybody that would like to attempt to solve an issue on their own. Further down the line, I'd also like to create an app for buddy volunteers, as well as a dispatchers dashboard.

Final Thoughts

Working on this project was stimulating because I was constantly thinking about how to combine simplicity with trustworthiness. At times I found myself treading the lines and making sure that its simplicity would not have a negative effect on user experience. My research on the topic inspired me to learn more about simplicity in UX design. I enjoyed working on this project especially since it was all about doing good for others. My greatest takeaway was the importance of conducting user testing in the right settings because the results may differ drastically depending on the circumstances.

View More of My Work

Buddy

Project Background

Challenges

Research Plan

Research Results

Insights Gained

Persona Development

User Journey Map

UI Requirements Document

Product Map

User Flow

Task Flows

Branding

Wireframes

UI Design

Prototype

Usability Testing

Next Steps

Final Thoughts