back home

Studi

an AI tutor that teaches through questions, then builds the learning artifact you need.

live site →GitHub →

Studi keeps the lesson in one conversation. It asks the next useful question, then generates a runnable or interactive Spark when seeing, testing, or manipulating the idea would teach it better than another paragraph.

inside the app

real product screens
Studi tutor home screen with conversation history and a central message composer
the tutorOne focused question at a time, with past lessons close enough to resume without rebuilding the context.
Studi conversation with an inline Code Spark, terminal controls, and test results
inline Code SparkA small runnable workspace appears inside the lesson, with editable code, output, and visible checks in context.
Expanded Studi Code Spark workspace with tutor context, editor, preview, and terminal
expanded workspaceThe same Spark expands into a larger editor and terminal while the conversation that created it stays attached.

why I built this

the problem and the bet

most AI study tools optimize for producing an answer. that is useful when you are stuck on a task, but it is a bad default when the goal is to understand the idea well enough to use it again.

I built Studi around a different loop: start from what the learner already believes, ask one smaller question, introduce a contrast, and only name the concept after they have noticed the pattern themselves.

Sparks are what make that loop more than prompt writing. when words are the wrong medium, the tutor can build a graph, scene, quiz, flash-card deck, or runnable code exercise for that exact moment without sending the learner somewhere else.

what it actually does

the product in practice
  1. 01

    guided discovery, not answer dumping

    Studi asks one focused question at a time, adapts to what you say, and introduces the formal name only after you have found the idea yourself.

  2. 02

    Sparks that fit the learning moment

    When text is not enough, the tutor can build an interactive scene, Desmos graph, quiz, or flash-card deck around the exact concept in the conversation.

  3. 03

    runnable code practice inside the lesson

    Code and Test Sparks turn a concept into a small TypeScript, JavaScript, or Python workspace. You can predict, run, inspect the output, and repair visible failing checks without leaving the thread.

  4. 04

    threads that keep their context

    Each topic keeps its messages, attachments, and generated Sparks together, so you can return to a lesson without rebuilding the context from scratch.

  5. 05

    works from your actual material

    Attach a problem set, lecture slide, or photo of your notes and Studi uses that material as the starting point instead of teaching from a generic prompt.

  6. 06

    built as a real product

    Accounts, plan-based usage, billing state, file storage, and failure recovery are part of the same experience, not a demo layer added around the tutor.

how it's built

the decisions underneath

one Spark tool, not six separate tools

The tutor calls one generic create_spark tool with a Spark type and learning context. A typed skill catalog supplies the right prompt, schema, and validator for scenes, graphs, code, tests, quizzes, and flash cards, so adding a new Spark does not require rewiring the agent.

structured generation before rendering

A separate worker generates strict structured output, then Studi normalizes and validates it against the Spark contract before anything is stored or shown. Generated code never becomes trusted UI just because a model returned it.

sandboxed interactive scenes

Scene Sparks run as compact HTML, CSS, and JavaScript inside a restricted iframe with a CSP and no network access. A small runtime bridge reports readiness, size, interactions, checkpoints, and errors back to Studi without giving the scene access to the app.

isolated code execution with limits

Code and Test Sparks are admitted server-side, checked against plan limits, and run in isolated provider-backed workspaces with bounded files, commands, languages, and timeouts. The learner sees useful output without exposing production infrastructure.

a persistent, streaming tutor

Convex Agent owns the thread, messages, tool calls, and tutor behavior. Replies stream into the same persisted conversation through live subscriptions, while Clerk identity and usage state stay enforced on the backend.

models are infrastructure, not product logic

Tutor replies and Spark workers use task-specific model routes with guarded fallbacks. Providers can change without rewriting the chat UI, artifact contracts, or the teaching flow.

runs on

Next.js 16the App Router gives the tutor a solid application shell while streaming and server boundaries stay close to the feature code.Convexthe database, backend functions, scheduled work, and live subscriptions stay typed end to end in one place.Convex Agentthreads, streaming messages, tutor behavior, and tool calls share one inspectable agent boundary.Clerkauth + billing + subscription state without rebuilding the basics, and it integrates cleanly with Convex.OpenRouterone API for every model, so I can swap or route models without touching product code.Bunone fast tool covers installs, scripts, the runtime, package management, and most of the local development loop.Vitest + Playwrightunit tests for the logic, browser tests for the flows. an AI product needs receipts, not vibes.

hover a tool to see why it is here

seen enough:

back home