fllock

Flight Booking App

UI DESIGN

Duration: 2 months

My Role: Site mapping, Visual design, Prototyping

Fllock is a flight booking web app that provides an easy and efficient way to book flights.

The Problem

There are plenty of apps in the market to book flight tickets with so many features cluttered in the same app. Fllock is providing a minimalist and simplest way to book the tickets.

The Goal

A minimalist and easy-to-use app to book flight tickets.

wireframes

I created wireframes based on the user flow, which provides all the information. It presents all the ideas and saves time.

Style guide

The blue color symbolizes trust, authority, and loyalty, and provides calmness. These were our main reasons to pick blue as the brand color.

The font used is Sans-Serif which is readable, builds authority, and is accessible.

Colors

#044BD9

#4474DC

#2E2E2E

#454545

#727272

#FFFFFF

typography

Mock-ups

Log in / Sign up screens

Homescreen

Date selection screens

Available flights screens

Passenger details screens

Checkout & Confirmation

Ticket details & cancellation

Account detail and password reset

Prototype

Check live prototype

CONCLUSION

Takeaway

This was my first full UI project. I learned how to build a sitemap and how to use color psychology in design. I learned how to build wireframes and how to use UI kits. I worked with project managers and the developer team to build the designs. It was a great collaborative experience.

Next steps

This web app has less functionality. A functional flight booking app requires some more features.

Some of the results we found after internal testing of the app are-

It only shows airport codes so it’s hard to tell the location if someone doesn’t know the airport code.

The app doesn’t provide flight layover details on the search results page.

Users can only checkout through credit cards; there are no other options.

It provides a ticket cancellation option but doesn't provide details for the process.

Other projects

UX DESIGN PROJECT

CineSnacks

CineSnacks is a snack ordering app for movie theaters with various options for users to order snacks. It provides users the option to pick up the order or get it delivered inside the theater to their seats…