Project Info
Inspiration
💡 Fable began with a simple question: What if a story could adapt to your state of mind? As our team explored EEG technology, we became excited about the idea of measuring brain waves and uncovering hidden patterns of thought. What if a narrative could respond to your level of focus and relaxation—your shifting mental state? With EEG headsets reading brain activity, Fable dynamically shapes its plot, characters, sound effects, and visuals, crafting a living, breathing story that unfolds uniquely for you. This isn’t just storytelling—it’s an experience powered by your mind.
What it does
🔮 Fable reads your brainwaves to craft a living story that responds to your every thought. As your mental state shifts, the plot dynamically evolves—changing tone, pacing, or twists to reflect how you feel. Simultaneously, the visuals adapt to match the unfolding narrative, immersing you in a real-time, brain-driven adventure where each scene is shaped by your mind. Even the moving gradient color background gradually fades and shifts, mirroring your inner state and heightening the immersive feel of your journey.
How we built it
🧱 We built Fable by combining a Muse 2 EEG headset with a dynamic storytelling pipeline, powered by a Python FastAPI backend and a Next.js frontend styled with Tailwind CSS. The headset reads beta, alpha, theta, and gamma wave patterns—interpreted as relaxed, neutral, or focused states—using Mind Monitor and streams this data in real time through OCS. Our main story loop runs every 30 seconds, checking the user’s current state and using the OpenAI API to generate story scripts (and corresponding sound effect prompts) based on those EEG readings. We map each state to a specific narrative direction—for neutral, we steer the story toward fresh discoveries; for focused, we introduce more details or challenges; and for relaxed, we invite ease and wonder. To enhance immersion, we integrated 3.js and GLSL shaders to create an EEG-based dynamic gradient background that shifts in real time with the user’s mind state. We then feed both the text-to-speech lines and OpenAI-generated SFX prompts into ElevenLabs (streamed via WebSocket), allowing us to seamlessly produce both TTS dialogue and ambient sound effects. Finally, we bring the story to life visually with the Luma Labs API. Throughout this process, we employ a multithreading approach to process text, voice, and video asynchronously, ensuring smooth, parallel generation of each element.
Challenges we ran into
🚧 We faced several hurdles bringing Fable to life. Hooking up OpenAI’s story generation so that each paragraph was generated sentence by sentence required careful orchestration within our webapp. Integrating ElevenLabs’ text-to-speech to ensure that audio and subtitles streamed seamlessly in real time was another challenge. Working around lengthy inference times on video generation models forced us to asynchronously and concurrently queue and segment videos to keep up with the script and audio. Our hacking led us to benchmark at least 10 different video generation APIs against each other for speed, including text-to-image and image-to-video generation. We also developed our own text-to-image and image-to-text pipeline to improve efficiency and control over the entire process.
Accomplishments we're proud of
🏆 We’re proud of creating a seamless, real-time storytelling platform that translates brainwave data into dynamically shifting narratives, audio, and visuals. By integrating multiple APIs—Muse for EEG, OpenAI for generative text, ElevenLabs for audio, and Luma Labs for visuals—we managed to build an immersive, multi-sensory experience that feels both personalized and technically robust. And most of all, we love the experience of listening to the stories that come out of our product!
What we learned
📚 Through developing Fable, we gained a deeper understanding of real-time data processing, from parsing EEG signals to synchronizing audio and video outputs. Integrating diverse tools like OpenAI, ElevenLabs, and Luma Labs taught us the value of modular design and clear communication between APIs. We also discovered how critical it is to balance technical complexity with user experience, ensuring that the shifting storyline remains both immersive and coherent.
What's next
🚀 We’re excited to broaden Fable’s capabilities by refining our EEG interpretation for an even wider range of emotions and deeper engagement tracking, exploring additional wearable sensors beyond the Muse headset, and advancing our storytelling techniques—potentially introducing multiple branching storylines, co-op experiences, and VR integration.
Fable [TreeHacks OpenAI Prize Winner]
Inspiration 💡
Fable began with a simple question: What if a story could adapt to your state of mind? As our team explored EEG technology, we became excited about the idea of measuring brain waves and uncovering hidden patterns of thought. What if a narrative could respond to your level of focus and relaxation—your shifting mental state? With EEG headsets reading brain activity, Fable dynamically shapes its plot, characters, sound effects, and visuals, crafting a living, breathing story that unfolds uniquely for you. This isn’t just storytelling—it’s an experience powered by your mind.
What it does 🔮
Fable reads your brainwaves to craft a living story that responds to your every thought. As your mental state shifts, the plot dynamically evolves—changing tone, pacing, or twists to reflect how you feel. Simultaneously, the visuals adapt to match the unfolding narrative, immersing you in a real-time, brain-driven adventure where each scene is shaped by your mind. Even the moving gradient color background gradually fades and shifts, mirroring your inner state and heightening the immersive feel of your journey.
How we built it 🧱
We built Fable by combining a Muse 2 EEG headset with a dynamic storytelling pipeline, powered by a Python FastAPI backend and a Next.js frontend styled with Tailwind CSS. The headset reads beta, alpha, theta, and gamma wave patterns—interpreted as relaxed, neutral, or focused states—using Mind Monitor and streams this data in real time through OCS. Our main story loop runs every 30 seconds, checking the user’s current state and using the OpenAI API to generate story scripts (and corresponding sound effect prompts) based on those EEG readings. We map each state to a specific narrative direction—for neutral, we steer the story toward fresh discoveries; for focused, we introduce more details or challenges; and for relaxed, we invite ease and wonder. To enhance immersion, we integrated 3.js and GLSL shaders to create an EEG-based dynamic gradient background that shifts in real time with the user’s mind state. We then feed both the text-to-speech lines and OpenAI-generated SFX prompts into ElevenLabs (streamed via WebSocket), allowing us to seamlessly produce both TTS dialogue and ambient sound effects. Finally, we bring the story to life visually with the Luma Labs API. Throughout this process, we employ a multithreading approach to process text, voice, and video asynchronously, ensuring smooth, parallel generation of each element.
Challenges we ran into 🚧
We faced several hurdles bringing Fable to life. Hooking up OpenAI’s story generation so that each paragraph was generated sentence by sentence required careful orchestration within our webapp. Integrating ElevenLabs’ text-to-speech to ensure that audio and subtitles streamed seamlessly in real time was another challenge. Working around lengthy inference times on video generation models forced us to asynchronously and concurrently queue and segment videos to keep up with the script and audio. Our hacking led us to benchmark at least 10 different video generation APIs against each other for speed, including text-to-image and image-to-video generation.
Accomplishments that we're proud of 🏆
We’re proud of creating a seamless, real-time storytelling platform that translates brainwave data into dynamically shifting narratives, audio, and visuals. By integrating multiple APIs—Muse for EEG, OpenAI for generative text, ElevenLabs for audio, and Luma Labs for visuals—we managed to build an immersive, multi-sensory experience that feels both personalized and technically robust. And most of all, we love the experience of listening to the stories that come out of our product!
What we learned 📚
Through developing Fable, we gained a deeper understanding of real-time data processing, from parsing EEG signals to synchronizing audio and video outputs. Integrating diverse tools like OpenAI, ElevenLabs, and Luma Labs taught us the value of modular design and clear communication between APIs. We also discovered how critical it is to balance technical complexity with user experience, ensuring that the shifting storyline remains both immersive and coherent.
What's next for Fable 🚀
We’re excited to broaden Fable’s capabilities by refining our EEG interpretation for an even wider range of emotions and deeper engagement tracking, exploring additional wearable sensors beyond the Muse headset, and advancing our storytelling techniques—potentially introducing multiple branching storylines, co-op experiences, and VR integration.
Analysis
View
Metric
- 10
- 3
Figures cover GitHub contributors during the hackathon window. A co-authored commit counts in full for each author, so per-member totals add up to more than the whole-team figures.
Technology
- CIn code
- C++In code
- CSSIn code
- HTMLIn code
- JavaScriptIn code
- Next.jsIn code
- PythonIn code
- ReactIn code
- Tailwind CSSIn code
- TypeScriptIn code
10 of 10 appear in the indexed code.
AI coding agents
No AI coding agent signals were found in this repository.
Detected from committed agent config files and commit authorship. Absence of a signal is not proof an agent was unused.
Codebase size
Source size
48 MB
Source files
3,814
Counts recognized source files only; vendored directories, binaries and lockfiles are excluded, so this is smaller than the repository on disk.
Repository
StiopaPopa/fable
4,000 files · 80.6 MB · @ 336348f
Structure
Interface
2 files · 0%Screens, components and styles rendered to the user.
API & routing
6 files · 0%Request entry points: routes, handlers and controllers.
Application logic
3,104 files · 78%Domain rules, services and shared utilities.
Background jobs
6 files · 0%Work run outside a request: tasks, workers and schedules.
Data & schema
14 files · 0%Schema definitions, migrations and data access.
Supporting
Layers are inferred from where files sit in the tree, not from reading the code. A project that names its directories unconventionally will read oddly here — open the file browser to check anything the diagram implies.
Languages
- Python86%
- C14%
- JavaScript0%
- Markdown0%
- CSS0%
- C++0%
- Other (3)0%
Share of indexed source by file size. Binary and vendored files are excluded.
Dependencies
frontend_/package.json
npm · 21- @react-three/drei
- @react-three/fiber
- @thi.ng/color
- chart.js
- elevenlabs
- gsap
- leva
- next
- react
- react-chartjs-2
- react-dom
- stream
- three
- tone
- +7 more
package.json
npm · 8- @gsap/react
- @react-three/drei
- @react-three/fiber
- @thi.ng/color
- @types/three
- gsap
- leva
- three
Declared in the repository’s manifests at the indexed commit. A declared package is not proof it is used, and runtime dependencies are listed first.
This repository has more files than are indexed here, so the diagram and browser show a partial tree. Open it on GitHub for the complete structure.
This project’s features have not been analysed yet.
Export this project's context (description, README, evidence, key source files) to chat with an AI agent elsewhere.