The health crisis caused by the Covid-19 pandemic at the beginning of 2020 has forced people in most countries to review their habits, their daily lives and the way they interact with others. It is necessary to stay at home and limit travel as much as possible in order to reduce interactions with others and thus slow down the spread of the virus. This has direct consequences on our lives, but also on the economy of the country. This project does not claim to boost a country's economy, but just to simplify the travel of people who want to go out for a walk or physical activity (within the limit of one hour and one kilometre around the home). This will allow users to get away from the lockdown and to relax and recharge their batteries to better cope with the situation.
For several weeks now, containment has been in place in most countries around the world. The measures are quite strict and one has to justify each and every trip. Going out for a walk, physical activity or fresh air is one of those reasons. But this outing must be within 1 kilometre of the home, and this for a maximum of one hour. The problem is that it is difficult to know simply how far away you are from your home. So I worked on a solution to solve this problem simply, while proposing a timer that will remind us how much time we have left before we have to go home. The solution appeals to everyone's responsibility to reduce the number of exits and slow down the spread of the virus in cities and rural areas.
I work as product designer on this solo project: the product thinking (prioritize features, choose the strategy and define the scope), the ergonomy ( layout, organization, architecture), the interactions ( animations, transitions and how they influence the experience) and the global visual design of the app.
The aim is to inform the user as simply and intuitively as possible. The plan is that once the solution is installed the user will have no more contact with, and will only receive information at the important moment. The interfaces and steps of use must therefore be minimized and only interact when the distance or time limit is exceeded. The majority of people today own a smartphone. The solution will therefore naturally materialize through a mobile application, it will be quick and easy for them to download and use it. To prototype this application I used the Sketch software.
To implement this solution, I started by establishing personas that correspond to the key users of this solution. With these personas I have established user flows that will correspond to the chronological list of interactions they will have during an walk during the containment. Finally thanks to this, I made a list of essential features that I prioritized and organized to finally establish the first wireframes that draw the first features of the layout. Finally, once the wireframes were well elaborated I was able to build the final interfaces.
The 2 personas are established in the context of the health crisis of 2020 following the spread of the coronavirus. It must then be taken into account that the majority of people are then confined to their homes and must limit outings and travel.
Pascal, 64 years old. He is retired and locked in with his wife and his dog in a country village. His activities are watching the news and walking his dog once a day around his home. He knows his village by heart and rarely changes his walking path, but he has no idea how far he walks. Another problem is that he is too dreamy and gets lost in his thoughts and doesn't see time passing.
Camille, 27 years old. She works in communication. She is locked in with all her family, her 2 parents and her 2 brothers in a house in the city centre. She continues to work for her company by teleworking from her home a good part of the day. Every 2 days, when she finishes her working day, around 6pm she goes running around her house. She was doing it before the health crisis and is therefore a trained and accustomed jogger. She runs while listening to music. She would like to run for more than an hour but she can't. She also ikes to change her route often and doesn't realize how far away from home she is or not.
In relation to time, for Pascal it is essential to be informed of the time before the end so that he can go home in time. Camille wants to know regularly where she is in the remaining time in order to organise her race and her route. As for the distance, Pascal just wants to know if he's going to exceed the distance once he's on his usual path. Camille wants to know where she is in relation to her home, so that she can simply find her way home. So she needs a map. Both personas will need to interact with the app, but not necessarily in the same way or for the same reasons. The opportunities are then different for both, just a sound could remind Pascal to go home. As for Camille, she needs a complete message to inform her exactly where she is and how long she's staying.
Thanks to these user flows and the paint points of the personas we can establish a list of the essential features of the app:
- Onboarding: you define your home adress at the first opening.
- Map: allows the user to visualize where he or she is positioned in his or her neighborhood, in relation to the home.
- Distance from home.
- Remaining time for the walk.
- Notifications, sounds and vibrations: in order to effectively inform the user.
- Define the nature of the notifications: each user does not want to be informed in the same way when he goes out.
- Change his home address: for x reason this can happen
Onboarding will explain how the app works simply and then focus on the home address information.
The home page will be ultra simple, with only a map, the 2 necessary infos (time and distance) and the possibility to access the settings. The map will include 4 infos: the position of the home, the position of the user represented by icons, as well as 2 circles representing the perimeters of distances. One for the user's distance from the home, another symbolizing the limit of 1km not to be crossed.
HOME PAGE & MAP WIREFRAMES
The information modal will present the distance the user is from his home and the time remaining. But also the possible actions related to the countdown, i.e. start and stop the countdown. It will also be possible to access the settings with the settings icon.
INFORMATIONS MODAL WIREFRAMES
Alerts will appear above the info modal when the user has exceeded the time or distance limit.
The settings, only two in number, will be accessible by clicking on the icon. A modal will then open at the bottom and the user will then be able to go and modify his address or notifications.
The first time you use it you have to go through onboarding. It first explains the 2 fundamental principles of the app. Namely the time and the distance to respect. Then you have to fill in the home address, it is not possible to continue if you don't enter it. It is indeed essential for the use of the app (it will also be necessary to authorize the localization of the device during the use of the app).
When you arrive on the app the home page presents your current rental (in your home normally) and offers you to start the 1h countdown (this is the action put forward thanks to the CTA play). Once the countdown has started, you can find out the distance to your home live during your walk. On the map, 2 circles are present:
- the 1st in green (main color) which corresponds to the perimeter of your distance to your home.
- the 2nd in red (colour symbolizing the prohibition) which corresponds to the distance limit that must not be exceeded.
HOME PAGE INTERFACES
During the countdown the user will be able to access the distance to his home (in meters) in the informations modal (the text is in green), if the maximum distance of 1km is exceeded the distance text turns red. Same for the zone that exceeds 1km around the home, to indicate that the user is not in the right place and must turn back. He can also view the remaining time, and right next to the countdown there is a stop button that is placed to stop the countdown when you return home. In the same way as the distance, if the time is up the countdown will turn red. In all cases of exceeding the limit an alert mode appears and the phone starts to vibrate and ring (according to the user defined parameters).
THE INFORMATIONS MODAL
Once during the walk, if the user exceeds the time or distance limit he will be informed by an alert. It will materialize by a pop-up in red on the interface (which attracts attention and warns the user) but above all by an audible alert and a notification that will allow the user to be warned even if he does not have the app in hand. In addition to this audible alert, the phone will start to vibrate (if the user has activated the feature on the device).
ALERTS & NOTIFICATION INTERFACES
As far as time is concerned, the user will also be informed after 30 minutes have elapsed (so that he can turn back) and after 50 and 55 minutes, accompanied by a reminder of the distance the user is home, so that he can hurry if he hasn't arrived home yet (this time information will also be materialized by a pop-up and an alert).
Once the walk is over, you can click the stop button, this will open a confirmation modal presenting the statistics of the exit and asking you to confirm that you want to stop the exit and thus the countdown.
CONFIRMATION MODAL TO STOP THE ACTIVITY
The user can modify the address of his home as well as the nature of his alerts. To do so, he can access the settings by clicking on the corresponding icon. A modal will then open at the bottom of the screen (for more accessibility). Then, there are 3 alert settings:
- Voice alert: a voice informs about the remaining time or the exceeded limit. The goal is that the user does not consult the app, he just receives the time and distance information he needs. Example: "you have exceeded the limit distance of 1km, you have 25 minutes to turn back and go home" or "you have 10 minutes left, hurry home, you are 800m away from home".
- Sound alert: A different sound sounds for each limitation or alert. The user is then invited to consult the notification centre or the app directly to be aware of the instructions.
- No alert: If the user does not wish to receive any sounds or messages. He will just get the notification with the instructions and information to follow.
SETTINGS MENU & ALERTS SETTINGS INTERFACES
For the home address, you just have to click on the field and you will be able to fill in the new address using the keyboard. You just have to validate and that's it.
HOME ADRESS SETTINGS INTERFACES
Main actions flows
This autonomous project allowed me to apply most of my technical skills in product design. Moreover, it was developed quickly and proactively in response to the current crisis context. The app offers the simplest and most intuitive answer and solution to one of the containment issues. All the possible features and actions have been carefully thought and chosen to avoid offering a overloaded platform.
The future of Kilom.
In an institutional framework, the app could take on a different scope, for example by proposing collaboration with the police services that control the streets of cities, so that citizens respect the instructions. The user could, for example, be required to present the app and therefore the corresponding data (time and kilometres) in order to facilitate and make checks more fluid. An account could also be set up, in order to provide each user with the possibility of retrieving his exit history, and why not also a containment note associated with these statistics. With a view to extending the service internationally, the application could also propose to change the distance limit or the exit time in order to meet the requirements of other countries, which are not necessarily the same as here in France.