TimeMyGate

Inspiration

Everyone has a story of either sprinting through the terminal or sitting at the gate for way too long, wondering why they left so early. Most tools focus on the flight (status, delays, gate changes), but not on the everyday decision that actually stresses people out: when to leave home or work so they can clear traffic, check-in, security, and still feel calm at the gate. TimeMyGate was inspired by that gap and by our own experiences of guessing “is this enough buffer or not?” before every flight.

What it does

TimeMyGate is a focused web app for departures from home or work to the airport gate. A traveler:

Chooses a sample flight from ORD for today.
Picks where they are leaving from, how they travel (car, taxi, rideshare, or transit), and whether they have checked bags or priority security.
Selects a simple risk preference, from “cut it closer” to “very safe.”

The app then gives a clear recommendation:

A single “Leave at HH:MM” time.
A human-readable breakdown of the trip as a timeline: leaving home, arriving at the curb, finishing check-in, clearing security, reaching the gate, and boarding.
A simple risk indicator that reflects how much buffer there is before boarding.

There is also an interactive layer: if the user taps “I’m here now” on a step or uses a “Running late or stuck?” panel, TimeMyGate adjusts the rest of the plan while keeping the flight schedule fixed. Even though all numbers are mocked, the experience feels like a real “pre-flight companion” rather than just a static calculator.

How we built it

We built TimeMyGate as a small, focused web application using Next.js with TypeScript. For the interface, we relied on shadcn/ui and Tailwind CSS to keep the design consistent and easy to maintain, and Framer Motion for light animations that make the timeline feel alive without being distracting.

All data is local and deterministic. We defined:

A handful of realistic sample flights from ORD.
A small set of origins such as “Home,” “Office,” and “Hotel,” each with a plausible address.
Simple profiles for typical travel, check-in, security, and walking times, plus a small set of risk presets.

On top of that, we wrote pure TypeScript helpers that take a chosen flight and a set of options and return a recommendation object and a structured list of trip steps. The logic combines the mocked durations and risk presets into a coherent schedule, but stays intentionally simple and rule-based for the hackathon.

Challenges we ran into

One major challenge was recalculation without confusion. Early versions made the mistake of shifting the whole schedule when the user said “I am here now,” which could accidentally make it look like the flight itself had moved. We had to rethink the model so that the flight’s departure and boarding times are always treated as fixed, and only the traveler’s timeline and buffer adjust around them.

Another challenge was finding the right level of realism. If the app is too honest, it will happily tell someone “you are definitely too late,” which is realistic but risky during a live demo. If it is too fake, it feels like a toy. We had to find a middle ground for the hackathon: mocked but believable times, and a “demo-friendly” behavior that still shows recalculation working without producing overly harsh states.

We also had to keep the UI simple while representing a lot of factors: modes of travel, baggage, security type, domestic versus international, and risk preferences. The main difficulty was hiding that complexity behind a small set of controls and one central answer, so the app still feels calm and approachable.

Accomplishments that we’re proud of

We are proud that TimeMyGate feels like a complete end-to-end experience and not just a disconnected prototype. A user can go from “I have this specific flight” to “I know exactly when to leave” and then watch that plan play out on a timeline.

We are also happy with the way the timeline works as both explanation and control. It explains the plan in plain language and also lets you interact with it by marking where you are, which immediately updates the rest of the trip.

Another accomplishment is the separation between product logic and UI. The core planner is expressed as a small set of pure functions that sit underneath Next.js and shadcn. That structure would make it relatively straightforward to reuse this logic in a mobile app, an API, or an airline integration in the future.

What we learned

We learned the value of distinguishing between a target behavior and an actual outcome. Risk presets express what kind of buffer a traveler wants in theory, while the plan shows what buffer they actually get given their choices. Keeping those as separate concepts made the messaging on the result screen much clearer.

Another lesson was that UX is a narrative. Thinking of the product as a story with a beginning (setting up the trip), middle (seeing and following the plan), and end (completing the trip and “Have a nice flight”) helped us decide which features to prioritize and which to cut for this version.

What’s next for TimeMyGate

If we continue this project, the next steps would focus on real-world data and personalization:

Integrating live flight status and gate changes so the plan can react to delays or last-minute shifts.
Layering in traffic estimates and airport-specific patterns for security and check-in times.
Allowing light tracking in the airport using location signals and occasional check-ins, so the app can learn real travel times over many trips.
Building user profiles that learn how each traveler behaves, such as how early they usually arrive, how fast they walk, and how risk-tolerant they are.

We would also extend the scope from departures to arrivals and connections: helping people decide whether a connection is realistic, when a ride should leave to pick them up, and how much buffer they need between flights. In the long run, the same core idea (turning a fixed departure time into a personalized “leave now” plan) could support airlines, mobility apps, and travel platforms that want to reduce stress before every flight.