Beesafe - design review and redesign of personal safety app

BeeSafe is a personal and corporate safety platform which provides safety monitoring for individuals and corporate employees.

With palette of their products company aspires to bring the safety of an individual to new level.

Assignment

I was approached by the company with words that their product "doesn't feel right". They asked me to come up with redesign for both of their mobile applications (Android and iOS) which would address visual and functional problems experienced by users.

 

About

The purpose of application is to provide their users with tools to call for help in situation of an emergency. Whether it's a person going home from party late night or an employee patrolling during a work shift.

The design was defined by following set of functionalities that needed to be provided:

Application allows users to call for help both manually - on demand - or automatic without any action taken. It also informs emergency contacts about changes in status - when the person feels unsafe and when they triggers the alarm. During the emergency it provides real time information about the situation. Those includes current position on a map of user in need and allow for sending photos and quick predefined messages.

Additional functionality that needed to be considered in design process consisted of login and registration, management of emergency contacts, handling and grouping of notifications, management of user's account and profile; and lastly - the application's settings.

Your browser doesn't support HTML5 video

Process

In the initial analysis I thoroughly went through current version of application compiling along the way a list of possible pain points. These were later confirmed and completed by usability tests that I ran with randomly selected users (4).
Based on the results from analysis and testing I proceed in suggesting solutions for individual issues. After the discussion with the customer, we'd agreed on the priorities and the first iteration of designing began.

Examples of addressed issues 

  • application navigation - user got frequently lost in application and wasn't able to easily exit certain states due to fluctuating items in the menu - this was addressed by revisiting the user flows in the application and creating a new approach to navigation in the sections of the application
  • registration and login - the number of steps the user needed to take in order to start using the application was lowered; also another option for social login was added
  • setting a timer - the way of how user sets timer which triggers the alaram was optimised for speed giving user presets for most common values
  • notifications - the functionality of providing emergency contacts with vital information about the situation was developed into the greater detail
  • the application was designed individually per each major mobile platform (Android and iOS) making the best use of the native components and following platform specific guidelines to polish the nuances - Material design and Human Interface design guidelines

 

The results of analysis and suggested solutions were turned into the individual screens (more than 80 per platform) and binded into the prototype. This prototype was used for next iteration of usability tests with different 5 users. The final design was adjusted based on the output of that testing and handed to the customer.

Your browser doesn't support HTML5 video

Challenges

One of the challenges I met during this particular design job was of how to elegantly incorporate in the application an adequate amount of friction; since one of the key functionalities was to provide user with ability to alarm contacts and/or authorities in case of an emergency. This action should be both - easily and quickly accessible - taking to consideration that the user could be in a hurry, on a move and have little to no time to read alert dialogs and instructions - but at the same time the user should not be able to trigger alarm by accident.

Previously the application made use of simple button followed with confirmation dialog after which the alarm was triggered. This solution led to too much friction and confusion. 
The new proposed solution consisted of a component with drag and drop feature where user needs to drag button to the specific area for successful alarm trigger. This area is visually distinguished but also distinguished with haptic feedback to allow for triggering alarm without having to look at the screen.

Handover and delivery

  • More than 80 screens were delivered per each platform.
  • Instructions and visuals for how the design should scale across the variety of display dimensions.
  • Prototype of application which was early on used for usability testing and later for better illustration of all different states of the application - crucial for software developers.
  • Three animations for clarifying how application should function, indicate transitions between the states and interact with user.
  • Design support during the development phase in order to answer for additional questions and tweaking of final product.

Personal note:

What I really liked about both the project and the client was that the intention to redesign the application wasn't driven by mere visual aesthetics but also aimed to improve and address the problems in user experience.