LearnFlow

LearnFlow is a goal-driven generative UI system that turns scientifically grounded podcast content into actionable, personalized plans. Instead of starting with a chatbot, users begin with a goal like “improve sleep,” “learn neuroscience,” or “increase focus,” and the agent dynamically renders a structured interface around that goal: phased plans, do/don’t lists, study flows, glossary cards, flashcards, check-ins, and progress views. The core innovation is that the UI is not static and not just text output — the agent selects relevant podcast sections, synthesizes grounded insights from indexed transcripts, and transforms them into functional UI components the user can act on immediately.

For the hackathon MVP, LearnFlow focuses on pre-indexed Huberman Lab podcast episodes that are already parsed into sections. A user enters a goal, the system maps that goal to relevant podcast sections, and the agent generates a full plan with timelines, action steps, and supporting learning material. For each section, the interface can render a concise summary, a glossary of difficult concepts, and active-recall flashcards. It also supports lightweight check-ins and a simple progress dashboard so the user can both learn and execute. This makes the experience materially different from a traditional chat app: the user is guided through a live, goal-oriented workflow rather than manually extracting actions from a conversation.

Technically, the system is designed as a web app with a structured agent pipeline: podcast sections are preprocessed and indexed, goal input is sent to an LLM-backed planning endpoint, and the agent returns structured outputs that are rendered into UI modules. The experience is intended to be powered by AG-UI-style structured agent responses over a React/Next.js frontend, with the agent emitting typed UI state rather than plain prose. In practice, this means the model can drive components like plan timelines, flashcard sessions, check-in forms, and progress summaries directly from its output schema. The backend can use a lightweight RAG approach over the parsed podcast content, while the frontend renders the agent’s structured responses as dynamic cards, flows, and dashboards. This gives judges a clear demonstration of working generative UI: the model doesn’t just answer — it actively shapes the interface in response to the user’s goal.

Podcast episode ingestion. Research about technologies.