Designer
FocusFinder-LoadingScreen.jpg

FOCUS FINDER — UX | UI | Logo Design | Branding

An app to find the ideal spot to be productive. Always find a seat to study, work and focus.

 

Focus Finder

UX | UI | Logo Design | Branding

An app to find the ideal spot to be productive. Always find a seat to study, work and focus.


Challenge

Find a solution to the problem of going to a coffee shop and not finding an open seat to work.

Solution

An app that allows the user to see what cafes have seats available and what features each place has to offer.


Prototype

InVision was used to create a prototype of the final 10 screens, checking the user flow of the app. 

 

 

Sketches

Various sketches were explored before finding the best layout.

Wireframes

The final sketches were then converted into wireframes to verify the sizing of the screen assets.


 

UI Kit

After finalizing the wireframes, a calm and clean design direction was chosen. A UI Kit was created before starting on the final design. Soft rounded icons and button states were created to aid the user in navigating the app.


 

Final Design

Ten screens were fully designed to represent the final design of Focus Finder.

 
Main Feed —The main purpose of the app is to find a spot to focus. The app automatically opens to the focus finder feed to show the user which cafes nearby have available seating.

Main Feed

The main purpose of the app is to find a spot to focus. The app automatically opens to the focus finder feed to show the user which cafes nearby have available seating.

Location Profile—Each location has a profile page that describes the number of seats currently available, overall rating and price. The user can also find business features and basic information about the location, such as the address and phone numb…

Location Profile

Each location has a profile page that describes the number of seats currently available, overall rating and price. The user can also find business features and basic information about the location, such as the address and phone number. Tapping the "Favorite" button will add the location to the user's favorites list. Tapping the "Rate" button will allow the user to rate the location.


 
 
Profile—The profile tab provides information about the user as well as shows notifications, past visits to study spots, as well as friends and settings.

Profile

The profile tab provides information about the user as well as shows notifications, past visits to study spots, as well as friends and settings.

History—The history screen lists all locations the user has visited. The app uses a geo locater to place where the user has been as well as keep track of how many people are at a location.

History

The history screen lists all locations the user has visited. The app uses a geo locater to place where the user has been as well as keep track of how many people are at a location.


Filter—The search tab allows the user to filter the search results based on distance, price, as well as technology, seating, food and atmosphere. 

Filter

The search tab allows the user to filter the search results based on distance, price, as well as technology, seating, food and atmosphere. 

Search—The search tab is where the user can type in a specific name for a location, discover a random location or filter his/her search.

Search

The search tab is where the user can type in a specific name for a location, discover a random location or filter his/her search.


Favorites—When the user saves a location as a favorite spot, he/she can quickly access the location through the favorites tab.

Favorites

When the user saves a location as a favorite spot, he/she can quickly access the location through the favorites tab.

Notes—Locations that have been favorited or added to the user's history have note profiles where the user can add brief descriptions about their experience, such as what drink they ordered.

Notes

Locations that have been favorited or added to the user's history have note profiles where the user can add brief descriptions about their experience, such as what drink they ordered.


Loyalty Cards—The card tab allows the user to keep all of their shop loyalty cards in one place. Once the user decides on a location, they can load the location's loyalty card and start collecting points.

Loyalty Cards

The card tab allows the user to keep all of their shop loyalty cards in one place. Once the user decides on a location, they can load the location's loyalty card and start collecting points.

Gift Cards—The card tab also allows users to load gift cards they have received for the coffee and tea shops available on the app. This creates a convenient spot to store all of the beverage gift cards in one location.

Gift Cards

The card tab also allows users to load gift cards they have received for the coffee and tea shops available on the app. This creates a convenient spot to store all of the beverage gift cards in one location.