Work Archive
Web App
Triroute
Your flights. Your data. On a globe.
TypeScriptNext.jsReactTailwind CSSSupabaseZustand
2026-01 – PresentA flight tracking and trip planning platform built on real Amadeus flight data. Plan multi-stop trips on a 3D interactive globe, track costs and flight times, earn travel badges, and compare your stats on a global leaderboard.
Results
12
Badges
Unlockable travel achievements
Live
Real flights
Powered by Amadeus flight API
Global
Rankings
Leaderboard across all users
Features
- →3D interactive globe with live flight arc visualisation via react-globe.gl and Three.js
- →Real flight data from Amadeus API — prices, airlines, durations, layovers
- →Multi-stop trip builder with per-leg cost and duration breakdown
- →Shareable boarding pass cards with trip summary export via html-to-image
- →Trips dashboard with aggregate stats across all saved trips
- →Flight insights page: most frequent routes, monthly activity heatmap
- →12-badge achievement system (First Departure, Globe Trotter, Iron Butt, Around the World, etc.)
- →Global rankings leaderboard — Distance / Countries / Flights
- →Supabase auth + realtime backend
Challenges
- →Rendering smooth 3D flight arcs at scale with react-globe.gl and Three.js without frame drops
- →Amadeus API rate limits and response shape inconsistencies across route types
- →Designing the badge criteria to feel earned without being frustrating to unlock
Story
I kept planning trips across spreadsheets and tab soup — searching Skyscanner, copying prices, doing mental math on layovers. I wanted a single place to build a multi-stop trip with real flight data, see the route on a globe, and know exactly what it costs and how long it takes. That turned into a full platform: real Amadeus API prices, 3D arc rendering, and enough gamification to make obsessive trip planning feel rewarding.
What's Next
- →Carbon footprint tracking per trip
- →Collaborative trip building for group travel
- →Price alerts for saved routes