Diana Alayon

HelpDrone - UX Case

Screen Shot 2020-04-08 at 6.25.51 PM.png

Where volunteer Drone Pilots and First Responders join forces.

HELPDRONE

Colombia is using drones to fight COVID-19. I’m a proud Colombian helping improve this platform.

 
 

I’m redesigning an app that connects volunteers with first responders when there is an emergency near their location. They will be the bird’s-eye view improving the team’s ability to pinpoint disasters and victims.


Timeline:
4 week, team project.
My Role: UX, Visual, Usability Testing, UX Writing, Localization.
Deliverables: High Fidelity Prototypes, Product Mockups, UX Research Report, Translation from Spanish to English.

 

The problem

When there is an emergency, first responders can benefit from the use of drones to collect data, assess the damage, rescue, and access to difficult places. Until now, there is no easy connection between them and the Drone pilots community.

 

The opportunity

To connect the worldwide Drone Pilots community with the right authorities and ensure that maximum people benefit from their drone services.

 

The solution

Screen Shot 2020-04-07 at 4.33.59 PM.png

Register. It’s free.

Do you have a drone and wish to volunteer? Create an account and be a DroneHero in your community.

Are you The Firefighters, The Police, The Coast Guard, The Red Cross, or any local government? Create an account and get support from our DroneHeroes community.

Screen Shot 2020-04-08 at 11.01.14 PM.png

Send Emergency Alerts.

As a Local government and first responder, you have the ability to send alerts to the DroneHeroes community during an emergency.

You will be ask to provide information such as name of entity, emergency type, location of the event, and the technical requirements - if any - of the drones.

Screen Shot 2020-04-07 at 11.00.11 PM.png

Find DroneHeroes closest to your emergency.

Only the DroneHeroes that show available in their status and are close to the location of the emergency will get the alert.

Details of the emergency will be shared only with drone pilots accepted by the first responders to help.

Screen+Shot+2020-04-08+at+9.57.09+AM.jpg

Connect with volunteer DroneHeroes.

As a Local Government and First Responder, you will see a list of DroneHeroes available to help. You can select as many as you need to better assist your emergency.

By doing so, the exact location of the emergency will be shared with the DroneHeroes. Start communicating in real-time, without leaving the app.

 

The research

This work have been done 100% remotely. By asking why you’re redesigning your app? to identify the rationale behind the changes. In this case, they realized their product was not user-centered and they were putting lots of features based on technical affordances, not user needs.

For the user research, the product owner, developers team and marketing team were involved and asked to record themselves using the app while completing specific tasks provided. A survey with general-open-ended questions and more specific-close questions related to features was conducted.

 
 
Picture1.png

Ideation

With the help of story boards, sketches and low-fidelity prototypes, we redefine the user flow and started to consider new use cases as well as legal and technical constraints.

 

Before and after

The version 1.0 of the app was ready to be launched when I joined the team. Design recommendations as well as new features are being made for the next version.

 
sign_up.png

Allowing social media logins.

I love sign up forms, no one said ever. Providing users with these options will simplify their lives.

In testing sessions, users expected a more standard sign-up screen as they are used to with other apps.

register_form.png

Breaking long forms into several steps.

The form is quite long as there is specific information we need to request from the volunteers, in order to align to the Local Governments safety policies.

Instead of making it short, we divided it into categories. The users perceived it as less complex and simple.

register_form_gov.png
create_emergency.png

Using icons to communicate meaning.

Critical actions take place for the users here. The First Responders are telling the Drone Pilots what type of emergency is, where is happening, and what type of drone would be more useful to assess the situation.

During usability testing sessions, users remembered better the actions associated to an icon.

list_of_emergencies.png

Reducing cognitive load.

Showing the list of emergencies in a card-list sort of way, instead of hidden functionalities, provide a much simpler experience.

The time it takes users to scan and act on the information the list provides improved.

profile_dronehero.png

Making a desirable profile.

A functional design was already in place but we needed it to appeal to users in the long-term. After all, we are inspiring all drone pilots to be DroneHeroes.

Setting the status to “Available” on “Not available” is critic to receive notifications of emergencies, and, therefore, be able to help. We are highlighting this feature.

share_info.png

Interacting, without leaving the app.

SUGGESTED FEATURE

In the original product concept as well as in the version 1.0, the process ends with getting the contact information of the volunteers, on the First Responders end, and having access to all details related to the emergency, on the volunteers end.

Communication is expected to happen via phone call, MSM, and WhatsApp. I will elaborate more on this later on.

 

The style guideline

Screen Shot 2020-04-13 at 4.27.59 PM.png
Screen Shot 2020-04-13 at 4.28.26 PM.png
 

My take aways from this project working remote

Thank God for Figma. And MS Teams. It’s been an amazing tool to collaborate with developers as well as the product owner. As I created mockups, collect user feedback, and revise their designs, I was able to share designs with them in real time. We were able to comment and point at things that needed to be reviewed as they happened.

What to fix now and what can wait

Seems very obvious, right? It is not. This remote job has been at fast-paced and it’s easy to get overwhelmed and feel like there is just too much to finish. Separating tasks into important versus urgent is key. I could only do that by being on the same page with the developers.

3 hours time zone difference

It’s been a bit challenging to sync with the team in the mornings but there is nothing more motivating than the smell of coffee and talking ux. The team I work with is very energetic, supportive, and respectful of each other.

When in doubt, over-communicate

It is not only good but necessary to over-communicate when you are a designer. Specially working remote. As this is a re-design work, I have to understand their product, why is made the way it is, and what are the goals in a short-long term.