Journey

Turn your goals into a road trip.

Comment

💡 Inspiration

We wanted to reimagine productivity using algorithms not just to track time, but to visualize progress intelligently. Journey transforms your focus into movement, using algorithmic route generation to simulate a real drive between cities. It’s productivity, powered by computation and creativity.

⚙️ What it does

Journey gamifies focus through algorithms. Each task completion triggers a route-following algorithm that moves a car along a map the longer you focus, the farther you travel. The app transforms abstract productivity into a visual journey, powered by algorithms that calculate distance, timing, and progression.

🧠 How we built it

  • Route Algorithm: Custom interpolation algorithm calculates intermediate points between cities for smooth path animation.
  • Animation Algorithm: Built a linear interpolation (LERP) system to simulate car motion along the route.
  • Frontend: React + TypeScript with Mapbox GL JS and Framer Motion for UI logic and animations.
  • Backend: Node.js + Express, integrating OpenAI API for personalized task generation.
  • 3D Visualization: Three.js powers the car model movement, syncing with algorithmic route data in real time.

🚧 Challenges we ran into

  • Designing a motion algorithm that feels real while maintaining performance.
  • Syncing route algorithms with user input and map updates.
  • Balancing real-time rendering and state updates without frame drops.
  • Translating abstract productivity metrics into visually meaningful movement.

🏆 Accomplishments that we're proud of

  • Developed multiple algorithms to simulate travel, acceleration, and user progress.
  • Built a seamless integration between 3D animation, AI, and mapping APIs.
  • Created a system that transforms focus time into an interactive journey.
  • Designed an intuitive UI that brings algorithmic motion to life.

📚 What we learned

  • Applying algorithms for motion interpolation, path optimization, and state synchronization in React.
  • Efficient data handling between Mapbox, Three.js, and Node.js.
  • The importance of balancing algorithmic complexity with visual simplicity.
  • How AI and algorithms can collaborate to make self-improvement engaging.

🚀 What’s next for Journey

  • Smarter pathfinding algorithms to simulate realistic multi-city trips.
  • Machine-learning models to personalize difficulty and focus pacing.
  • Real-time productivity clustering algorithms to compare user progress globally.
  • Expansion into mobile platforms with persistent cloud syncing.
Share this project:

Updates