SkyHigh

TechLabs Düsseldorf
4 min readSep 19, 2023

This project was carried out as part of the TechLabs “Digital Shaper Program” in Düsseldorf (Summer Term 2023).

The Problem:

Our theme revolved around transportation and mobility. We identified that travelling abroad for regular people can be less flexible as we would want it to be. Airlines have their own rules and regulations on time and date and additional costs or penalties can make the whole process a challenge. And we are not even talking about cancelled or delayed flights because the airline did not fill it’s seats on time.

On the other hand, people flying private planes have more flexibility in their travel. Some perks would be separate and quicker entrance in the airport, freedom of destination and dates and time as well as less crowded planes and the possibility to travel with more luggage.

The Solution:

Our solution is an online platform where a potential traveler who wants a simpler mode of travelling can browse and book for available discounted private planes or propose a route and share the flight cost with other persons also willing to take control of their travel.

Our approach is inspired by Airbnb and Uber, who are both giants in the sharing economy as well as industry disruptors helping people to get more from their respective industries.

Technology Used:

Next.js for building full-stack web applications with React components on the server as well as the client

TailwindCSS for quick inline styling of the UI

DaisyUI components

Framer Motion animations

NextAuth/Auth.js with Oauth provider Auth0 for authentication

SQLite database using better-sqlite3

Project Planning Process:

Step 1: During the ideation process we defined a User persona profile of our ideal customer and how our solution helps solve his problem.

Step 2: We started working on the Customer Journey of our User persona and how he uses/navigates our solution (online platform) to solve his current problem.

Step 3: Once we had a clear idea of the ideal customer and his journey on the to be created website, we started to work on mockups and planned our online-platform always having in mind to create an easy-to-use product.

We took inspiration from already existing and successful brands serving similar needs from other sectors.

After identifying fundamental components supporting our project, we started planning the design and how we are going to merge them to our solution to provide the best possible user experience and fit modern standards.

Through some designs and iterations, we developed a low fidelity design using Figma and once satisfied with the design, we pushed it to a more close to final design.

Step 4: We worked on the components that make out our intended solution and the data that would be required and their relationships to each other. For this we developed a database schema to represent our proposed database layout as well as the required components.

Step 5: Once we had come past the design freeze, we started coding according to the initial plan.

Project Description:

With efficiency and rapidity in mind, we started the project using NextJs as our framework for its quick and efficient out of the box server side rendering, easy routing and flexibility in customisation. With the same logic, Tailwind CSS was added as a main building block for the UI with its utility-first approach, easiness to maintain and improved responsiveness. For the database, we opted for SQLite for its simplicity as well as ease of setup and distribution.

We divided the team in front-end and back-end based on the learning tracks and strengths of the team members. This approach enabled us to efficiently work on both route at the same time. We kept the team up-to-date asynchronously using a slack channel. Additionally we held weekly meet-ups to discuss ongoing work and challenges. For versioning, we used GitHub and elected two team members to review and merge commits in order to maintain an optimised workflow and always keep the master branch in an operational state.

The front-end-team based its work on the Figma file and the back-end-team worked according to the defined database schema, both of which were reiterated upon as needed.

We also prioritised the different components of the platform in terms of how important they were in our user journey and categorised them in three categories as essential, nice-to-have, and further development.

Unresolved Project Challenges:

Wow-features such as QR-code to easily share a proposed flight, interactive map, user comments and payment integration were not implemented due to lack of time.

Planning:

User Journey:

Database Schema planning:

Figma Design:

GitHub repository: https://github.com/philippe2023/skyhigh

Website: https://skyhigh.fly.dev

The Team:

Jean Philippe Auguste: Web Development (Full Stack)

Sven Diederichs: Web Development (Backend)

Henning Michel: Web Development (Frontend)

--

--