SkillForge

Stop researching. Start learning.

Comment 1

Inspiration

Most people don't quit hobbies because they lack motivation. They quit before they even start.

You decide to learn guitar. You open YouTube. An hour later you've watched three videos about how to practice, read two Reddit threads, and still haven't touched a guitar. That's not a willpower problem. That's a missing-product problem.

I built SkillForge for one specific person: the busy adult who knows exactly what they want to learn, but doesn't have time to figure out where to begin. The internet has infinite content. What it lacks is a clear, structured path through it. SkillForge generates that path in seconds — so you can stop planning and start doing.

What it does

SkillForge is an execution system that forces learning completion.

Not an AI roadmap generator. Not a curriculum tool. A system designed around one insight: people don't quit hobbies because they lack information. They quit because there's no structure forcing them forward.

Type any skill and your weekly hours. Get a phase-locked roadmap in seconds — specific tasks, real YouTube links, resources already picked. Phases unlock only when you complete the previous one. Finish a phase and the AI Skill Coach appears: personalized coaching for your exact milestone, the insight most beginners miss at that step, and a push toward what's next.

26 active users. Real roadmaps being followed. Real tasks being completed. That's not a demo. That's retention.

How Novus shaped the product

Installing Novus was step one. Using it was the real work.

The first version of our analytics was broken — every event was firing, but the visitor ID wasn't persisting, so instrumentation across 20 tracked events produced zero usable data. Novus caught it and generated a fix. I merged it, and for the first time we started seeing real behavior.

Once the data was real, Novus surfaced two problems we wouldn't have found otherwise:

44% of visitors never submitted a skill. 8 out of 18 people landed on the homepage and left without generating a roadmap. Novus identified dead clicks on the input fields — no labels, and parts of the input box weren't responding to clicks. It generated a pull request: visible labels, full clickable area, instrumented submission paths. I reviewed, merged, and watched the conversion signal improve.

Completed tasks were generating rage clicks. Users were clicking "Complete" repeatedly on tasks already marked done — 5 frustration events in 5 seconds. Novus flagged it and generated a fix: disable the button after completion, auto-collapse the card 800ms later. Merged. False-positive frustration signal gone.

This is the loop the product is built on: Novus instruments, detects the friction, generates the fix — I review, merge, and ship. Every product improvement after the first week came from real user behavior, not assumptions. That's not just analytics. That's a product co-pilot.

How we built it

Deliberately lightweight — because I wanted it to feel like a fast, shipped product, not a hackathon prototype.

Frontend: Vanilla HTML5, CSS3, and ES6 JavaScript. No frameworks, no build tools, no dependencies. CSS custom properties for a cohesive dark-mode UI, Orbitron font for a mission-control aesthetic.

AI Engine: Groq API running Llama 4 Scout, generating strictly formatted JSON roadmaps with enforced sequential timelines. A separate coach endpoint generates personalized phase completion messages in under 2 seconds.

Backend: Lightweight Node.js/Express proxy server. The Groq API key lives exclusively in server-side environment variables — users never touch it.

Storage: Supabase for shareable roadmap links. LocalStorage for all user progress — no account required.

Deployment: Render, with continuous deployment from GitHub.

Analytics: Novus.ai for real user behavior tracking — roadmap generation, task completion, phase drop-off, and coach engagement, all instrumented from day one.

Challenges we ran into

The blocking coach: The first version of the AI Coach ran inside the task completion flow. If the API was slow, the phase never unlocked. Users were stuck. I had to fully decouple the coach from the completion logic — task done instantly, phase unlocks instantly, coach fires as a completely non-blocking async call after the animation. Never block the user.

The rigid dot: The core UI has a zig-zag timeline with a progress dot. It tracked the vertical center of each phase card — but when cards expanded and collapsed, the center shifted and the dot jumped rigidly. Fixed by querying the DOM coordinates of the horizontal dash connector instead, so the dot targets a fixed point regardless of card state.

Choppy animations: CSS transitions stuttered whenever the UI shifted mid-animation. I stripped them entirely and built a custom requestAnimationFrame loop with spring physics — stiffness and damping applied to velocity. The dot now glides mid-flight and adjusts dynamically if the UI changes beneath it.

LLM hallucinating timelines: Llama kept outputting "Ongoing" or repeating "Week 1-3" for every phase. Fixed with strict prompt constraints: each phase must start exactly where the previous one ended, adjusted for the user's available hours per week. Forced JSON-only responses to prevent parser failures.

Accomplishments that we're proud of

The AI Coach modal. After completing a phase, a full-screen overlay appears with a glowing border, a pulsing brain icon, and a personalized message written specifically for that skill and phase. It's the moment the product stops feeling like a tool and starts feeling like a companion. Users don't expect it — and that surprise is the whole point.

Shippedness. A full-stack app with a secure backend, shareable links via Supabase, persistent local storage, live analytics, and 26 active users following real roadmaps right now. That's a product, not a demo.

Prompt engineering that actually works. The roadmaps SkillForge generates are genuinely useful — specific tasks, realistic timelines adjusted to your schedule, resources already picked. Getting an LLM to be reliably sequential and practical took serious iteration. The result is something people actually follow.

What we learned

Shipping a product is completely different from writing code.

The AI Coach wasn't in the original plan. I added it because users were completing tasks without any feedback loop, and the Novus data showed them dropping off right after phase completion. One product insight changed the entire experience. That's what real analytics are for — not vanity metrics, but decisions.

The hardest lesson: never block the user. Every async operation, every API call, every animation has to degrade gracefully. The moment your product makes someone wait for something they didn't ask to wait for, you've lost them.

And the most useful reframe: constraints are features. Gating phases sequentially wasn't a technical limitation — it was a product decision backed by behavior data. Users who could jump ahead didn't finish. Users who were gated did.

What's next for SkillForge

Community roadmaps — let users publish their generated paths publicly so beginners can follow proven routes built by people who've already walked them.

Streaks and accountability — daily practice prompts, push notifications, and completion streaks to keep users moving through their path.

Novus-powered timeline adjustments — surface real completion data like "most users take 5 days on Phase 1" and use it to suggest realistic schedule adjustments, not guesses.

Embedded resources — inline YouTube player directly inside task cards. Zero friction, zero context switching.

Built With

Share this project:

Updates