top of page
About

My Role
Concept I UX Research and Design I UI Design I Prototyping I Created in Figma 

JESTA

is a social app that connects you, the one who needs help, Encountering everyday tasks with people who can provide such assistance.
This app will use The "Wisdom of Crowds." It will save money for its users by avoiding the need to call a professional for every minor problem. It will also allow users to earn money by participating and contributing from their knowledge.

Group 1.png
Group 1.png
Group 1.png

Problem

Nowadays, getting help that doesn't necessarily require to be a professional one, is a challenge.You must ask someone for a "favor" or pay a professional.

 

There is no other simple, convenient and inexpensive solution.

Solution

The JESTA app is intended to solve this problem by creating a community platform that helps its members without the need to ask for a "favor."

The application will allow us to present problems easily and locate community members who can help.

Usability Research

After an additional examination, I found that there are no apps designed for receiving help like in JESTA.
That's why I decided to expand the scope of the research to examine applications that include features and elements in JESTA to get inspiration from them.

To understand the best way to place an order conveniently and use a map and location, Transmit reliability and security to the customer when inviting a stranger or what information is required to feel comfortable.
I examined the Wolt and Ten Bis app services,

I also understood the accurate information I needed to present and the confident and trusting tone of voice of the app by researching the Gett, Uber, and Airbnb apps.

Wolt-app-icon-2019.png
unnamed 1.png
7b985cad660ed20eece3fd4c509f9fb7.png
unnamed (1) 1.png

User Research

To fully understand and define users who they are, their needs, and their frustrations, I have decided to conduct interviews with potential users.

In these interviews, I have tried to specify the main events leading people to get help. I send a survey to potential users to better understand what most users feel about key points in the interface.

Based on those interviews, I have created two types of personas that will represent the app's target users.
A process of Jobs To Be Done helped me characterize the user's operation.

Finally, I concluded the specific goal of the client and the thought processes that would motivate him to use the app.

Asset 1.png

Shachar avivi

Age - 27
Occupation - Programmer
Location - Tel Aviv
Status - Single
Socioeconomic - Middle to low

Bio

Moved to Tel Aviv to live alone three months ago.
Single, loves the life in Tel Aviv and to be independent. 
She has full day work and during evening she also work as
a bartender. Loves to be in the company of people
looking to meet new people in the city.

Asset 4.png

Jonathan Cohen

Age - 26
Occupation - Works in a coffee shop
Location - Tel Aviv
Status - In a relationship
Socioeconomic - Middle to low

Bio

Lives in Tel Aviv with his girlfriend.
During the morning, working in the coffee shop.
like to be active and be in the company of people.
Loves to work with his hands, builds wooden furniture as a hobby. 
Looking for income supplement after work hours.

Goals

- Someone to help her with all the repairs in the apartment
   because she does not have time. 
- Let there be someone to help without her having to ask for a favor. 
- Wants someone to hang the TV on the wall for her.

Frustrations

- Very busy during the day and has a hard time finding time to do
   things she needs in the apartment.
- Tel Aviv is an expensive city, she has a difficult time saving money.
- She lives alone and has no one to ask for help if needed. 
- In general she has a hard time asking people for help.

Her opinion on the app

If there was such an app I would be happy to use it.
I always need help with little things which I do not know how to fix
or do on my own. I do not like to ask favors from people so it sounds to me like a platform that
can solve this problem.  Since I live alone I understand how it could help me on a daily basis.

Asset 3.png
Asset 2.png

Goals

- Would like to make more money
-  Would like to find a job that he will perform with his hands,
   construction, repairs ...
- Renovated his kitchen by himself. 

Frustrations

- Having a hard time finishing the month because of his low salary. 
- Tel Aviv is an expensive city. he has a difficult time
   trying  saving money.
- Can't find an income supplement that is convenient for him.

Frustrations

- Having a hard time finishing the month because of his low salary. 
- Tel Aviv is an expensive city. he has a difficult time
   trying  saving money.
- Can't find an income supplement that is convenient for him.

Asset 3.png
Asset 2.png

User Research Definition

Pain Points:
Emotional: Asking for a favor can be a difficult emotional task for people nowadays.

Availability: passing the emotional barrier, it is still not easy to find such a person to ask for help.

Professional market: Lack of response to minor problems that do not always require a professional.

Inconveniency: Slow response from the professionals, communication Inconveniency, and high prices.

Goals:

Emotional - Asking strangers for help through a designated app will allow users to overcome emotional or personal limitations.

Availability - in the app, users can find plenty of members who can help, each in his field.

Community members - community members, will arrive to help with all kinds of problems, No problem will be left untreated.
The app will present the problem immediately and to numerous community members simultaneously. Such exposure will guarantee a fast response.

Vector.png
Vector4.png
Vector3.png

Value

Get this little help when you just need it, from you’r around
community and professional saving money, time and get help without the embarrassment of asking for a favor,
And for the helper, the ability to help people around them and earn extra money.

Vector3.png
Vector2.png

Main values for the end user:

  • Ask for help

  • Help someone

  • Super helper (Get help from a professional)

  • Automatic payment

  • Compare prices

  • Rating the helper

  • Know the helper

Vector.png

User Flow

To optimize the application's user experience, I have created a fast and accessible route from start to finish.


I flow customized the flow to the user's specific needs, which are getting and giving help as
Simply and easy as possible.

Group 42731d137.png
Group 18565.png

Wireframes

Vector.png
Vector.png
Vector.png

The wireframes were designed in a process involving many drafts until the current phase. And they support the values ​​of the application.

The options were based on the concept of the application, usability study, and additional new features adapted.

Splash

Splash Screen.png

Welcome to

Welcome intro.png

Sign up

Welcome.png

Profile

edit User Profile.png
edit User Profile2.png
edit User Profile3.png
edit User Profile4.png
Vector.png
Vector.png
Vector.png

Home Page

Vector.png
Home Page.png
Call for Help.png
Call for Help5.png
Call for Help8.png
Home Page-3.png
Home Pag.png
Home Pa.png
Home .png
Vector.png

Payment

Vector.png
Payment-2.png
Payment-1.png
Payment.png

Rating, Finish

Vector.png
Home PageR.png
Home PageR2.png
Vector.png

Give help

Home Page.png
Home Page11.png
Home Page12.png
Vector.png
Vector.png

User Interface Design

The final UI design of JESTA aims to give the app a pleasant and modern look and a professional, reliable feeling.

The design is bright and inviting, with a gradient of bright colors and various transparent and rounded shapes.
The color palette consists of whites and transition shades of green and pink.

The overall design was created to give the user a clear and satisfying experience while navigating the app.

Rectangle.png

Design System

Style Guide

​

Colors​

Primary colors

Green

#35C0B6

Pink

#FD468D

Rectangle 4685.png

Green gradient

#35C0B6/#35C08E

Rectangle 4685.png

Pink gradient

#FD468D/#FF424E

Rectangle 4685.png

Yellow gradient

#FDB52F/#FD792F

almost whigt

#FCFCFC

Secondary colors

Darkness

#1E1E1E

Dark gray

#616672

Metal

#717784

Gray

#BCC1CB

Medium

#E7E9EE

Light

#F1F3F5

Lightness#F8F8F8

Typography

Poppins

Styles.png

Icons

Group 18564.png

Layout, Components and Variants

Grid System

iPhone 11/X - 375X812 Pixels

Gutter - 20
Margin  - 14
Columns - 4

Components

All components, layouts

and margins are following

the rules of 4.

D.JPG
Q.JPG
SS.JPG
s.JPG
Capture.JPG
ZZ.JPG
XA.JPG
ZZZXA.JPG
Captursse.JPG
×’×›×’.JPG
Capturde.JPG

Screens

from Wireframes to Design

Group 1.png

1. Sign up & Sign in Screens

The signing up process is easy and requires only a few details such as the Personal details, bio and things you can help with. These steps can also be skipped, and the information can be changed anytime by editing the personal profile.

Home Page p1.png
Home Page p2.png
Welcome p3.png
edit User Profile.png
edit User Profile-1.png
Group 1.png

2. Choose the things you can help with

User qualifications. On this screen the user will present his areas of expertise. 
The user will be able to observe options in

his surroundings. 
This screen shows a variety of expertise available in user surroundings so it was important for me to create clear and simple icons to allow fast recognition of each

area of expertise.
This page appears right after creation of user profile.

edit User Profile.png
edit User Profile-3.png
Group 1.png

3. Home

The home screen offers a simple choice. 
Asking for or giving help. 
The two options are presented differently. Asking for help option is graphically presented as a large rounded button. It's central position attracts users attention, allowing the user to ask for help in an easy and simple way. 

​

The second option, giving help is graphically presented as rounded button position down screen. 
Above this button an eye catching presentation of the number of people around who are currently in need of help. This presentation is giving an incentive to push the button.

Home Page.png
Call for Help.png
Call for Help-1.png
Call for Help-2.png
Home Page.png
Home Page-2.png
Group 1.png

4. Choosing help

Selecting helper screen is simple and clear designed to emphasize the important parameters for the user to choose from to get to the best decision. 
Each profile of user who is offering help can be further explored to get more information on this user. 
I chose to design the loading bar in a unique form which connect with general app language. 
More over, after selecting hepler user and it's arrival approval a location and ETA will be visible on the map with communication options as well.

Home Page-1.png
Home Page-3.png
Home Page.png
Home Page-4.png
Home Page-5.png
Home Page-6.png
Group 1.png

5. Payment

Payments screen is combined of several stages. 
Stage one allows you to see and approve helper arrival. 
In the second stage user can confirm getting help needed plus adding a tip, or alert on any problem which will be examined before payment confirmation. 
Payment is done automatically using predefined accounts details saved to the app. 
This method making sure receiving payment. 

Payment-4.png
Payment-1.png
Payment-2.png
Payment-3.png
Payment.png
Group 1.png

6. Rating, Finish

After payment the user will get the rating screen, which is a star rating pop up and written review on the helper. 
This activity is highly important for the function of the app because the user will get other users ratings and reviews to consider before choosing helper.

Home Page.png
Home Page-1.png
Home Page-2.png
Group 1.png

7. Give help

This screen conveniently presents help needed in helper current area. 
The urgent cases will show up on the list and the helper could scroll down to view all help needed. 
The helper will be exposed only to user who are asking help in is field of expertise as were field in the app. This method used as a filter to ensure that help requests will arrive only to helper who can handle it.

 

Each help request is clearly presenting the help needed so helper could easily choose between them. More over each help request could be clicked to expand allowing helper to get more elaborate details on help needed. 
Through this request a direct connection can be formed between users, allowing further information exchange, like video and photos.

Home Page.png
Home Page-1.png
iPhone XR Mockup_.jpg

Thank you for scrolling!

bottom of page