UX/UI case study: A step towards making the world safe

6 min readMar 22, 2021

Introduction

My college held a hackathon(A hackathon is an event, where programmers get together for a short period of time to collaborate on a project) for girls. I decided to take part in that. We made a team of four members. So it was time to select the project on which we were going to work. We went through many projects idea like teaching platform, trip planner app, space app. And finally, we got an app idea, on which we all were agreed, that shows the crime rate of an area and also provides the safest root to reach the destination.

Understanding the challenge 💪

There are mainly two problems on which we are working. let's discuss them one by one

Problem -1

Suppose You want to relocate somewhere or want to travel somewhere or you are a parent and you are having to send your child to another city to study. In Any of these situations, what would you do first ❓ Obviously, try to get information about that area in which, you are going to relocate or travel or send your child. How will you do this? maybe searching on the internet or asking any of your relatives who are living in that area. But can’t get significant and reliable information.

Problem-2

Suppose you are alone and want to go somewhere but you don’t know the way to that location so you searched the location on google map and follow the path but you found on which path you are walking(suggested by google map) is deserted, and suddenly some goons started chasing so you got afraid 😨and started running and somehow you reached your location and you swear to never take that root again. But you think in the heart of hearts, somehow, you could know about this before.

Solution 💡

Our primary aim is to stop the crime before it happens.

Our app provides the crime statics of any area you want and also shows you the safest route to reach your destination and you can get the best legal advice from our expert gogo as well.

How it works 🔎

Type a location or address into the app’s search box or choose directly the location from the map. Our app will show you crime incident trends, which are easy-to-read graphs 📊 showing the number of crimes that have occurred in an area over a specific time period. Filters allow you to narrow your crime search by date range and location.

And to find the safest route you can type the address or pick directly from the map, it will show you the safest route and after reaching the location it will ask you to rate the route and to write the experience according to the rating and according to the experience of the person, it will be decided whether a route is safe or not.

You can chat with our expert gogo to get legal advice. You can share 💬 with gogo if You face any crime, it will give you legal advice according to your experience.

Discovery

User Persona and Story Telling 🙎

persona 1 →

Krish 👨

30 yrs, a merchant wants to buy a house online and he has selected a house too but he had no idea about the area.

persona 2 →

Laira 👩

18 yrs, a student she got admission in a B.tech but her family was worried about the area of the college so just to check the area they had to travel of km.

persona 3 →

Susan 👲

32 yrs, a shopkeeper returning home after closing his shop. Some goons attacked him and looted him.

User Flowchart

So far now, I had a vague idea of how the app will function. So before started designing I made a basic flow chart to figure out the path that the user will take throughout the solution.

L0-fi Wireframes

This visual guide represents the skeletal framework of the app. It helped me arrange the interface elements while I focused on the functionality rather than what it looks like. Moreover, the simplicity of wireframes allows me to quickly test ideas without diving into the details.

Visual Research

Inspiration Board

Before getting started with the designing part I create an inspiration board. The purpose is to gather inspiration from the visual world 😍.

Color Palette

Blue color often symbolizes serenity, stability, inspiration, wisdom, or health. It can be a calming color and symbolize reliability. So I used Blue 🔵as a primary color. White, an inherently positive color, is associated with purity, light, goodness, safety, understanding, cleanliness, faith, beginnings, spirituality, possibility, humility, sincerity, protection, and perfection so I used white ⚪️color for the background and for the texts I used black and dark blue color.

Typography

Poppins is one of the newcomers to this long tradition. With support for the Devanagari and Latin writing systems, it is an internationalist take on the genre. It is a well-balanced sans serif typeface superfamily that seems to complement the interface. therefore, I decided to go with just one font family.

Final design

Onboarding Screens

The purpose of the onboarding screen is to direct users through an app interface. I used “Benefits-Oriented” Onboarding. This approach demonstrates the benefits or value the user will get from the app.

User Account

An easy and safe way to register & sign-in using your Email id. with an option to reset the password in case you forget the password.

Crime Rate

It will provide you the option to select a location to see the crime rate of the location. You can write the location in the search bar or use your current location. You can filter for the location and the time range. There is a nav bar at the bottom to navigate through the pages.

Safest route

Here you can write your destination in the search bar or choose one by the map directly. At the bottom, it will show your chosen location and after clicking the “set destination location” you can input your starting location or choose the current location option and after clicking on the start button it will show you the safest route between your starting location and the destination. At the end of the journey, you will be asked to give feedback about the route.