BeanJam - Airhead

Are you the biggest Airhead on your flight? While you lounge at the gate, test your London Gatwick knowledge and see if you can beat your fellow passengers.

Comment

Inspiration

While waiting at the gate in London Gatwick's North or South terminals, many customers would enjoy some themed entertainment while observing flight traffic and enjoying refreshments. The wide appeal of games like Wordle and 2048 inspired us to create an addictive quiz that passengers can only play against each other at London Gatwick. Airhead will appeal to a range of passengers, from those excited to be taking their first flight, to frequent flyers who want to test their air travel trivia while they wait to board. A web app allows users to play the game while moving in the queue or on a shuttle to the aircraft. A daily leaderboard and real-time scoring would allow school trips, groups of friends or strangers to compete against each other.

What it does

A web page with a daily quiz, themed on London Gatwick’s airlines, current flight data, and air travel news and history. Passengers scan a QR code displayed on posters at their gate, or open a link from the London Gatwick app. A daily leaderboard is created allowing passengers to compete for the highest score. London Gatwick’s airlines will be offered the opportunity to sponsor Airhead, and have information about their unique offerings included in quiz questions and advertisements for products and flights. Trivia about London Gatwick’s progress towards Net Zero in 2030 will be favoured, raising awareness about this among passengers and encouraging airlines to share how they are contributing to this goal. The passenger at the top of the leaderboard each day wins a prize of £10 to spend on refreshments or WiFi during their flight, and a monthly top prize is awarded for an experience in a flight simulator at London Gatwick.

How we built it

We created the structure on Next.js and deployed it on Vercel, with Supabase handling the leaderboard database and GitHub for version control. We wanted a responsive user experience on mobile so we used react to handle the frontend design and used typescript when writing code. Vercel allowed us to handle new versions quickly and also access the application from mobile. At the end of each quiz, the user’s score is sent to Supabase and inserted into the table to compare to other user’s high score.

Challenges we ran into

Adding communication to the Supabase database was a challenge as it was alien to us. We also ran into GitHub version control issues with merging conflicts which we were able to resolve after some trial and error.

Accomplishments that we're proud of

We wanted a frictionless user experience and so we handled most of the app client-side. The user’s score is sent to the server, but a user with poor connection can play the quiz without issue. Additionally, by making the service a web app, users are able to connect and play the game just by scanning a QR code. This eliminates the need for downloading an app or signing in and means the user can start playing the game without issue.

What we learned

We learnt how to handle database communication, how to deploy a web app and learnt a lot about CSS, TypeScript and version control. None of us had used next.js, Supabase or Vercel before we started this project, but we’re now much more confident with these technologies.

What's next for BeanJam - Airhead

We wanted to add real-time flight data which was converted by Gemini into quiz questions. We didn’t get time to add this feature but this would add to the versatility of the app, allowing a different experience each day for the users.

Built With

Share this project:

Updates