WayfindAI

An AI life-navigation OS for students — quiz-based skill assessment, RPG-style skill-tree roadmaps, and live gamified progress tracking that turns any student's goals into a personalized career path .

Comment

Inspiration

Most roadmap and career-guidance tools assume every student is the same — same stream, same goals, same milestones. We wanted to build something that adapts to any student (engineering, medical, law, commerce, arts, school-level) the same way a fitness app adapts to any body type: by first understanding the person, then generating a path just for them. We were also inspired by how addictive progress feels in Duolingo and GitHub's contribution graph, and thought: why not bring that same dopamine loop to career planning?

What it does

WayfindAI profiles a student through an adaptive onboarding flow and a skill/interest quiz, then uses AI to:

  1. Determine the student's current skill level (Beginner/Intermediate/Advanced) and ideal domains.
  2. Generate a personalized, RPG(Role-Playing Game)-style skill-tree roadmap (locked → unlocked → mastered nodes, boss missions).
  3. Build a daily AI Life Planner with interactive, clickable tasks broken down into sub-topics matched to the student's actual stated skills.
  4. Run "boss battle" and "diagnostic assessment" game simulations to measure real performance.
  5. Calculate a live Career Readiness Score from that simulator performance, plus AI-generated, reality-based improvement suggestions
  6. Track progress in real time with XP, levels, streaks, badges, and modern dashboards (contribution heatmap, skill radar, growth line chart, career-path Sankey diagram, readiness gauge, treemap).

How we built it

  • Frontend: React, TypeScript, Vite, Tailwind CSS, Shadcn/ui, Zustand, Framer Motion, Recharts, React Flow
  • Backend: Java 21, Spring Boot, Spring Security with JWT, Spring Data JPA/Hibernate, Maven
  • Database: PostgreSQL (hosted on Neon)
  • AI Layer: Groq API (Llama models) for the quiz analyzer, roadmap generator, AI Life Planner, AI Mentor Chat, and Career Readiness Engine
  • Deployment: Frontend on Vercel and backend on Render We designed the data model so a single adaptive onboarding flow (board/stream/career goal-aware) feeds every downstream module — quiz, roadmap, planner, and career simulator — so a change in user input always reflects consistently across the app.

Challenges we ran into

  1. Generalizing onboarding: Our first version assumed every user was an engineering student (e.g., always asking for "semester"). We rebuilt it into a dynamic, branching form that adapts its fields based on education stage (10th/12th/UG/PG) and target career (engineering, medicine, law, etc.).
  2. Entity leakage in AI output: Early on, raw JPA entities (User, UserGoal) were being passed directly into AI prompts and responses, so the UI displayed Java toString() dumps instead of clean text — including sensitive fields. We fixed this with strict DTO mapping and banned passing entities into prompts or API responses.
  3. Render loops: The AI Life Planner page had an infinite re-render/loading loop caused by a useEffect keyed on a Zustand object that updated on every fetch. We fixed it with effect dependencies tied to stable primitive IDs, store selectors, and fetch-in-progress guards.
  4. 403 errors on protected routes: Onboarding API calls were being blocked by Spring Security; we had to align JWT handling with the security filter chain and CORS configuration.
  5. Non-functional buttons: "Launch Battle" and "Begin Assessment" weren't wired to their handlers; we traced and connected them to the simulator and quiz engine logic.

Accomplishments that we're proud of

  1. A fully adaptive onboarding flow that works for any student type, not just engineering students
  2. A working RPG(Role-Playing Game)-style skill-tree roadmap with XP, levels, and badges
  3. A Career Readiness Score that is actually derived from live simulator performance (Boss Combat Arena, Diagnostic Assessment Center) rather than static numbers
  4. An interactive AI Life Planner where every task expands into AI-generated sub-topics matched to the student's real skill inputs
  5. A modern, glassmorphic, dark-themed dashboard with real-time analytics graphs

What we learned

  1. Never pass raw backend entities into AI prompts or API responses. We learned this the hard way — clean DTOs are what stand between a polished response and a Java object dump showing up on screen.
  2. React effect dependencies need to be primitive values, not object references. Chasing down an infinite render loop taught us this — get it wrong and you end up debugging the same fetch firing over and over.
  3. One shared, adaptive data model that every feature reads from is key to consistent personalization. Without it, every page starts behaving like its own silo.
  4. Good gamification genuinely changes how engaging a learning tool feels. XP, streaks, and skill trees made a real difference — even to us while testing it.

What's next for WayfindAI

  1. AI Mentor Chat with persistent memory of a student's full journey.
  2. A Failure Recovery Engine that detects when a student is falling behind and re-plans their roadmap.
  3. A Scholarship and University Recommendation Engine.
  4. Public leaderboards and peer accountability groups.
  5. Expanding the skill-tree content library beyond tech/CS into medicine, law, commerce, and the arts.

Built With

Share this project:

Updates