Transforming Design Concepts with Inflight

Habib Rehman

Database Engineer
Fullstack Engineer
Systems Engineer
Firebase
Next.js
Vue.js

FROM SKETCH TO SUCCESS: TIMEAHEAD's WORK ON INFLIGHT

Platform made for designers inflight.co

We began by analysing the details client provided, engaging in discussions about possible development outcomes and potential edge cases.

5 step process to start a project from scratch
5 step process to start a project from scratch

1. ANALYSIS

We had brain storming sessions. These conversations were more than just meetings—they were creative brainstorming sessions where ideas flowed freely, and every suggestion was welcomed

2. DESIGNING

APPLICATION FLOW

We initially developed a simpler flow within the web app where users can complete their design feedback journey. • Later added plugin support to directly export the Figma designs to the web app on their account.

inflight.co app flow
inflight.co app flow

SYSTEM SEQUENCE DIAGRAM

Inflight.co system sequence diagram
Inflight.co system sequence diagram

DATABASE DOCUMENT MODEL

No SQL DB Model for Inflight.co
No SQL DB Model for Inflight.co

3. IMPLEMENTATION

Started with the development of designs they provided, diving into specifics about how it should be experienced.

Our team engaged in meticulous development, ensuring each iteration was better than the last. We focused on delivering high quality work that real users would love, and we were thrilled to see the positive responses from Kyle.

Working on Inflight.co
Working on Inflight.co

PROJECTS FEED

Each Project's preview slides transition like a deck of cards, slightly visible on the sides. When you swipe, the current slide moves to the back, creating a seamless effect. We used

gsap.com

and other libraries to achieve these animations.

CREATE PROJECT

User could record their video/audio to explain anything they want about the project, all user data and project resources data was stored on our own server and we could present it as we please.

FEEDBACK EXPERTS SELECTION

Users can choose between human experts or AI Critique personas. The AI, designed to give design feedback, improves over time as it processes more data, becoming increasingly accurate.

FIGMA PLUGIN

We developed a plugin that allows users to transfer their Figma designs directly to their

inflight.co

project.

4. TESTING

Cross-Platform Testing

Conducted thorough testing on various operating systems to ensure compatibility.

Device Screen Testing

Tested the web app on multiple screen sizes, including mobile, tablet, and desktop, to verify responsive design.

Browser Compatibility

Performed tests across different browsers, including Chrome, Firefox, and Safari, to ensure consistent design and functionality.

Design Consistency

Ensured that all designs and features displayed as intended across all platforms and browsers.

User Experience Evaluation

Gathered feedback from users during testing phases to identify any issues and make necessary adjustments.

Iterative Testing

Engaged in multiple testing cycles, making improvements based on test results to enhance overall performance and user satisfaction. Feel free to modify or expand on any points as needed!

5. EVALUATION

Proposed enhancements and feature ideas for the Inflight web application.

Iterated through various versions, sculpting a unique user experience.

Transformed Figma designs into a vibrant, interactive platform.

Created a sensory-rich experience, making Inflight a go-to for design feedback.

Delivered a final version of

inflight.co

that users love.

CLIENT FEEDBACK

Highly recommend Habib, working with him is like having a full time CTO on your team. He completed many tough challenges without hesitation, and his quality of work was extremely high. Looking forward to working with him often in the future

Partner With Habib
View Services

More Projects by Habib