Inspiration

Most learning products, such as Brilliant and Duolingo, are structured like courses. They expect learners to create a profile, choose a subject, select a level, and commit to a learning path before they can begin.

But real learning rarely starts with a curriculum. It starts with a question:

  • Why is the sky blue?
  • Why do seasons exist?
  • How do vaccines work?
  • Why do planes fly?

I wanted to create a learning experience that feels as effortless and engaging as scrolling through TikTok or a social-media feed, but where every interaction helps the learner understand something meaningful.

That became Jenius: an AI teacher built around an infinite learning feed.

Rather than asking learners to describe themselves through a lengthy onboarding process, Jenius begins teaching immediately. It gradually learns from what they explore, understand, misunderstand, save, and ask about, then uses those signals to personalise what comes next.

Every lesson begins with a short form video like tiktok, followed by a clear explanation and an interactive challenge that encourages the learner to go deeper.

What it does

Jenius turns complex ideas into short, visual, interactive lessons.

Each concept combines:

  • an original cinematic animation
  • a clear, concise explanation
  • an interactive knowledge check
  • misconception-aware feedback
  • an alternative AI explanation adapted to the learner's difficulty
  • a memorable key takeaway
  • progress and understanding signals

The Discover feed lets learners explore a curated sequence of curiosities. The For You experience is designed to adapt using each learner's interaction history and evolving understanding—without requiring a lengthy profile setup or a fixed curriculum.

When a learner answers incorrectly, Jenius does more than reveal the correct answer. It identifies the likely misconception, presents a targeted explanation, and gives the learner another opportunity to understand the idea.

Learners can also ask Jenius to teach them a new topic, save concepts for later, and continue exploring previously loaded lessons offline through the installable Progressive Web App.

The current release contains ten fully produced science concepts, twenty questions, thirty misconception branches, and a reusable motion system for visual learning.

How we built it

Jenius is a mobile-first Progressive Web App built with React, TypeScript, and Vite.

The learning experience is powered by a deterministic state engine that tracks:

  • lesson progress
  • attempts
  • misconceptions
  • understanding
  • saved concepts
  • review history
  • experience points

I deliberately separated deterministic learning logic from the LLM. The application controls progression, scoring, and learner state reliably, while the OpenAI API provides flexible explanations and generates new learning content.

A Node.js and Express backend exposes dedicated explanation and content-generation endpoints. Firestore is used to cache generated content and manage usage limits, while IndexedDB keeps learner progress available locally and supports offline use.

To keep interactions fast, the application first resolves known lessons and misconceptions deterministically. Generative AI is used when personalisation or new content adds meaningful value.

I built a custom motion engine across several Codex sessions rather than placing videos directly throughout the interface. It synchronises curiosity, misunderstanding, success, completion, and concept animations with the learning state.

A central manifest controls:

  • video trimming
  • playback windows
  • looping
  • crossfades
  • lazy loading
  • poster fallbacks
  • visibility-aware playback
  • reduced-motion behaviour

The final product includes ten original educational cinematics and five reusable interface-motion assets. FFmpeg is used to prepare, inspect, and verify the production media pipeline.

The frontend is deployed on Vercel, while the API backend runs on Google Cloud behind Nginx with HTTPS.

OpenAI Codex and GPT-5.6 were central to the development process. I used GPT-5.6 in Codex to implement the learning architecture, backend integration, mobile refinements, motion system, automated tests, documentation, and release verification.

Codex helped me move quickly across a complex stack while maintaining strict schemas, deterministic behaviour, logical commits, and a comprehensive test suite.

Challenges we ran into

Choosing the right starting concepts

The first challenge was selecting concepts that felt interesting without being too simple or too specialised. The launch catalogue needed to appeal to a broad audience while demonstrating that Jenius could explain ideas from physics, biology, earth science, and health in a consistent format.

Coordinating many moving parts

Jenius combines:

  • video generation
  • frontend orchestration
  • deterministic learning logic
  • personalised LLM explanations
  • database storage
  • local persistence
  • media processing
  • offline support
  • production deployment

Making all these parts feel like one responsive consumer product was significantly harder than building each component independently.

Building within a short timeframe

The project went from an initial idea on Saturday afternoon to a production deployment by Tuesday.

Building an MVP of this scale in roughly three days required prioritisation, extensive use of Codex, and several workflows in parallel.

Balancing generative AI with reliable learning

A fully generative learning flow can become inconsistent. Explanations may be excellent, but progression, assessment, and learner state require predictable behaviour.

I solved this by combining a deterministic learning engine with generative explanations. AI provides flexibility where it adds value, while the application remains responsible for learning state and progression.

Making misconceptions useful

A wrong answer should not simply produce a red cross. It should reveal why the learner answered that way.

I created explicit misconception branches for every incorrect answer. Jenius can therefore respond to the learner's reasoning rather than only showing the correct response.

Making animation part of learning

First animations behaved like videos embedded inside cards. They competed with the text and often lasted too long.

I developed a reusable motion engine, inspected clips frame by frame, tightened playback windows, and separated short interface transitions from longer educational cinematics. Motion now acts as punctuation in the learning journey rather than decoration.

Delivering a polished mobile experience

Building a feed that works across mobile browsers, installed PWA mode, safe areas, dynamic viewport heights, offline states, and hardware-decoded video required extensive testing.

I used codex to refine the application around one primary scrolling surface, lazy media loading, poster fallbacks, visibility-aware playback, reduced-motion support, and responsive layouts across common phone sizes.

Explaining science visually

A beautiful animation is not automatically an educational animation. Several early generations looked impressive but did not communicate the underlying mechanism clearly.

I repeatedly simplified each scene until one cause-and-effect relationship was unmistakable—for example, showing moist air rising over a mountain, raining, and descending as dry air to form a desert.

Accomplishments that we're proud of

  • Built a complete AI native learning experience from concept to production.
  • Created ten original educational concept cinematics.
  • Designed twenty questions and thirty misconception-aware learning branches.
  • Built an adaptive understanding model instead of relying on a static onboarding profile.
  • Developed a reusable motion engine with trimming, looping, crossfades, poster fallbacks, and reduced-motion support.
  • Combined deterministic learning logic with OpenAI-generated explanations.
  • Delivered an installable, offline-capable Progressive Web App.
  • Built a production backend with Firestore caching and usage controls.
  • Added comprehensive frontend, backend, content, motion, and build verification.
  • Shipped the complete live experience at jns.fun.

What we learned

I learned that generating an explanation is only a small part of building an AI teacher.

The harder questions are:

  • What should this learner explore next?
  • What do they genuinely understand?
  • What misconception led to an incorrect answer?
  • When should AI generate something new, and when should deterministic resolver remain in control?

The strongest experience came from combining both approaches. And the latency benefit from a deterministic resolver is critical in providing fast UX for users. I also learned that personalisation does not need to begin with a questionnaire. A system can learn naturally through interaction. Every concept explored, answer submitted, misconception revealed, and topic saved can become part of an evolving understanding model.

Finally, learned that motion is most effective when it clarifies a concept or reinforces a learning moment. Short, carefully timed animation can make an abstract idea memorable.

What's next for Jenius: Infinite learning

The current release proves the experience with ten fully produced lessons. The next step is to make the feed truly infinite and deeply personal.

As learners continue using Jenius, the For You feed will increasingly reflect:

  • what they already understand
  • where misconceptions remain
  • which subjects spark their curiosity
  • which explanations work best for them
  • what concept would be most valuable to learn next

Future versions will expand into:

  • richer long term understanding graphs
  • partnerships with universities, schools, and coaching centres
  • multilingual lessons
  • additional scientific and cultural subjects
  • voice led learning
  • collaborative curiosity collections
  • teacher and classroom tools

The long-term vision is simple:

An AI teacher that learns how you learn and offers seemingly infinite content keeping learners engaged.

Built With

Share this project:

Updates