Figma Demo of the Webpage
Website Home Page
Figma Demo of the Main Page
Website Main Page
Figma Demo of the Main Page Extended
Website Main Page Extended
Figma Demo of the Website Extended
Figma Demo of the Website Extended

YouTrack - Track Flights whenever you want, wherever you want!

Check out the Figma demo (if the demo appears too large on the screen then click options -> fit-scale down to fit and press the search and dropdown buttons for the full experience of the prototype)

Check out the YouTrack video

Check out the code on Github for the actual website

What YouTrack is all about

YouTrack is an online website created for the purpose of tracking flights. Flying is one of the most common forms of travel and it comes as no surprise that roughly 115,000 commercial flights are operated worldwide every single day. Trying to keep up with one flight amongst hundreds of thousands of flights can be incredibly challenging, which is why we came up with an idea for a website that will serve as a guide for those wanting to keep up with active, previous, and future flights. Whether it be checking up on a loved one on a flight or tracking your own, YouTrack is the absolute best option for your flight tracking needs.

How YouTrack will make your life easier:

Have you ever wanted to track a flight on any flight tracking website and have been bombarded with extremely detailed and specific questions? Questions like: Exact time of departures or arrival, specific airline codes, gate numbers, and specific airport names are not always known to those who aren't keeping up with specific flights which is why YouTrack only requires you to enter the departure airport as well as the arrival airport and returns all the flights that match those categories. We hope that you will be able to track down exact flights from the list of matched flights.

Our work

We came up with the idea of building a flight-tracking website spontaneously and decided that we would have two aspects to this project. The first is the project itself and the second is a prototype/demo which shows tracked flights from one specific destination to another (Regina International Airport, Regina, Saskatchewan, Canada to Toronto Pearson International Airport, Toronto, Ontario, Canada).

Website itself -> Website was built using HTML, CSS, JS, React and data was obtained using aviationstack (limited to 100 requests/month) and air-port-codes APIs.
Demo -> The demo/prototype of YouTrack was built entirely on Figma. The working drop-down menus and the basic (yet aesthetic) user interface is the perfect representation of what YouTrack is all about -- simple yet effective.

Challenges that we ran into

Coming up with an idea that would challenge our thinking while not being overly difficult
Executing YouTrack
Familiarizing ourselves with Figma to come up with a pleasing UI prototype design
Executing YouTrack within the time frame of the hackathon

Accomplishments that we are proud of
Coming up with a great idea and then executing that idea to the best of our abilities
Putting in an immense amount of effort over a very short period of time to come up with an idea that could be groundbreaking
Managing our time to cover all the different aspects of this project

What we learned

A time constraint forces us to work harder and be more productive
With the advancement of technology, there are always new ways to make our lives easier
If a task is focused on for long enough -- it can be completed surprisingly quickly no matter how difficult it may seem.

What's next for YouTrack

Expand our website into including all different kinds of airports including regional and domestic airports.
Get constructive criticism from users and improve our website to benefit everyone, this includes but is not limited to the user interface, website support and accessibility, performance and more.
YouTrack could grow into something more than a hackathon project with the right attention.