Roaddy - A Roadside service assistance mobile app logo

Roaddy

Roaddy is a roadside assistance app designed to help people anytime, anywhere in case of vehicle breakdown.

roaddy-anim

Project Type

UI/UX & Mobile Development

Industry

Service App

Technology used

Figma, After Effects, Kotlin, Swift

About
The Project

Traveling via bike and visiting new places is fun until your bike breaks down in the middle of nowhere. In such a scenario, you can do one of the two, either try to fix the issue yourself or call for help. Often people need their vehicles to be towed to the nearest repair station. But how would you do that? Searching online may find you some road assistance services, but they may not be beneficial. This is when a road assistance mobile app comes in handy. Feeling stuck and anxious in a situation where your bike breaks down is pretty normal. But instead of worrying or requesting people for help, you can simply use a road assistance app and get professional help immediately.

THE PROJECT

Roadside service assistance mobile app, login screen and homepage

Design Process

Roadside service assistance app design timeline

Research

Using the survey of automobile users, we asked them a few questions regarding their experience when their vehicle breaks down in the middle of nowhere.

star
Problem Statement

Often, people get stuck in case of a vehicular breakdown without assistance and are reluctant to ask strangers for help in unknown places. Thus, they are trapped until they find a mechanic who charges more than usual.

star
Solution Statement

A mobile-based online application to provide hassle-free and real-time service to the user. App to be designed “Keeping budget, waiting time & quality in mind”.

star
Survey

chart
chart
chart
chart
chart
chart
A woman's headshot as one of user of roadside service app

Name :

Deepti Singh

Age :

21

Location :

Delhi, India

Occupation :

Student

Marital status :

Unmarried

Motivations :

  • Good service at budget price.
  • Minimum response time.
  • User friendly application interface.
  • Assistance in secluded areas.

Device usage :

Smart Phone

Laptop

Smart Watch

Interests :

Reading Books | Cooking | Designing Websites

About Me :

I am a graduate student who travels 15-20 km on an average daily as my college is located in the outskirts of a large city.

Frustration / Pain Points :

  • Travel 20+ kms Da ily on secluded roads.
  • Hesitates to ask for help, introvert.
  • Loses keys often.
  • Careless about refueling and servicing.
A Man's headshot as one of user of roadside service app

Name :

Varun Sharma

Age :

32

Location :

Bangalore, India

Occupation :

Corp. Employee

Marital status :

Unmarried

Motivations :

  • Best quality at nominal price.
  • Minimum response time.
  • Service to remote areas.

Device usage :

Smart Phone

Laptop

Smart Watch

Interests :

Swimming | Movies | Coding | Playing Cricket

About Me :

I am a software engineer, working for an IT firm. I have to travel 30-40 kms daily on my two wheeler vehicle and on weekends, i prefer going to unexplored places.

Frustration / Pain Points :

  • Busy schedule, no time for maintenance and servicing of vehicle.
  • Reaching late to meetings.
  • Can’t find quality service at a good price.

star
User Flow

Image showing flow of the user on roadside service app

starWireframe

Low-Fidelity Wireframes

Low-fidelity wireframes showing a rough hand drawn screens of roadside service app

High-Fidelity Wireframes

High-Fidelity Wireframe showing different app screens of roadside service app
Final roadside service app on iPhone 14 Plus

star
Logo Design Concept

Showing logo design concept, as visualized with combination of two entities.

When we say Roadside Assistance, we expect to see a helper in front of us to take us out of the problematic situation. Hence we decided to put a "Mechanic friend" symbol in our logo along with "Location" to indicate that He will come to you no matter where you are stuck.

How the Roaddy name came into existence, which is a combination of Road + Buddy.

The best way to calm someone is to give them support, and who can do it better than your own "Buddy"? Hence we named it "Roaddy" which comes from Road + Buddy & states that Your buddy will always come to you when you get stuck in the middle of the Road.

Road+BuddyRoaddy

star
UI Kit

Typography

Gilroy

H1
24px
H2
18px
H3
16px
H4
10px

Color Palette

#2975BC

#FFFFFF

#F8F8F8

#202020

#929494

Icons

Icons that are used in the making of service app

Illustrations

Illustrations used in the app making
Illustrations used in the app making
Illustrations used in the app making
Illustrations used in the app making

UI Components

UI component showing a nearby service center on the Google Map
UI component showing a nearby service center with address and open times for two wheeler service app
UI component showing a nearby service center for two wheeler service app

star
Visual Design

Screenshots showing many screens of app on different stages

Thank You!

We have converted the wireframes into final screens, and tried to keep the UI simple and intuitive with a user centered approach. The app’s design has simple sign in & verification screens and booking process.