Fixin

Fixin is the new food delivery app that stands out from the competition. This new delivery app concept is both modern and informative with a dark mode that won’t strain your eyes when you’re checking where your delivery driver is late at night.

This project was inspired by the Adobe Creative Challenge where we were given the task of designing the user interface and experience for a food delivery app.

Project Type
Mock Application

My Role
Designer

Tools Used
Adobe XD
Adobe Illustrator
Adobe After Effects

Years
2019

The Home Screen

User research revealed that users tend to leave the home screen within 30 seconds of opening the app. I had to find a way to keep them engaged longer.

To keep users engaged while on the home screen, I featured a section for promotions running at the time.

I also added a Favorites section as a way for users to quickly and easily view the food and restaurants they visit most often.

Fixin Home Screen Mockup | Toby Everett Portfolio

Search

Users need a way to search for specific types of food in their area as well as filter for different price ranges and dietary options. Users can easily search for food and filter results. They can also easily see which filters they have applied.

Fixin Search and Filter Mockup | Toby Everett Portfolio

Orders

Users need a place to view past and current orders. They also need a way to view the progress of their order and the details of the driver that will be delivering the order.

Users are able to view order status, receipts and report an issue all in one screen.

Fixin Order Mockup | Toby Everett Portfolio

Users can also view a map of the route the delivery driver is on and the details of the vehicle they are in to keep the user safe.

Fixin Map Mockup | Toby Everett Portfolio

Fixin in Action

Design

Logo

When deciding on a logo for Fixin I knew it needed to be both modern and convey the brand's goal. This led me to use the Avenir typeface for the letters in the logo due to its geometric, sans-serif design. The green color was chosen to indicate the food aspect of the brand along with the color contrasting well on the dark UI. To convey the brand's goal of people eating together, I created a table from the X with the lowercase I's creating people.

Fixin Logo | Toby Everett Portfolio

Color Palette

I decided on a dark UI so the app would not be hard on users' eyes. When deciding on a text heading color, I chose the green from the logo to create consistency.

#9EC224

#5A5A5A

#454545

#000000

Typography

I chose Avenir as the typeface for Fixin due to its geometric, modern type and its readability at all sizes.

Fixin Typography | Toby Everett Portfolio

Icons

Fixin Icons | Toby Everett Portfolio

Concepts

Fixin Logo Concepts | Toby Everett Portfolio

Final Thoughts

Fixin was a fun experience that provided a creative outlet for me and forced me to think of how a food delivery app could be made more useful for the user. The end product gives users the ability to quickly order food and safely see who has their order. Designing this concept helped me build my UI design skills in Adobe XD. The process also challenged me to think about the best way to show users their favorite orders and see where their food was during the delivery process.