Draw Your Hero

A child's paper drawing peels off the page and becomes the hero of an AI-narrated story on Fire TV, which they co-write out loud and with crayons. Built on Vega with Amazon Bedrock and Polly.

Comment

Inspiration

Every child draws heroes, and almost none of those heroes ever leave the paper. Meanwhile the biggest screen in the house is mostly something kids watch. We wanted to flip that: the TV should be the place where a child's own drawing comes alive, and where the story is theirs, made from their idea, their words and their crayons.

What it does

  1. Draw a hero on real paper and snap it with a phone (scan the QR code on the TV; no app install, no account).
  2. The paper turns into the hero. The TV first shows the actual photo of the page, then the drawing peels off and flies into an animated world, and introduces itself in its own voice.
  3. Amazon Bedrock looks at the drawing, gives it a name, a personality, a voice and three story ideas.
  4. The child says what the adventure is about (voice on the phone, or the remote). A three-part picture-book story is written around that idea and performed by Amazon Polly with a cast of voices: a narrator, the hero, and friends. Words light up as they are read, for early readers.
  5. The child co-writes the story. At each turning point the TV asks "What happens next?" Answer by voice, by remote, or by drawing: "Can you draw a friend?" The new drawing becomes a character that walks, talks with its own voice and falls asleep beside the hero at the end.
  6. Keep it. At "The End", a QR code opens the story as a storybook on the phone (replay, print, share). Photograph the same drawing again and the hero remembers: "Look who's back!", episode 2.
  7. Made for the TV: remote-first focus, a calm bedtime mode, and a Back button that asks "Leave the story?" instead of dropping a child out of their adventure.

How we built it

  • Fire TV app: React Native for Vega OS (Vega SDK 0.24), built from Amazon's multi-TV sample. 15 painted story worlds × 3 variants as parallax layers, weather and mood lighting, native-driver animations, a squash-and-stretch "sprite" made from the child's cut-out, read-along text synced to word timings, and W3C media AudioPlayer for narration. The same code also runs as a web build, which is the hosted "try it in a browser" version.
  • Phone page: plain web. Camera, paper detection and cut-out on the phone, colour-in, a silhouette fingerprint (for "returning heroes"), and speech recognition.
  • Story service: Node.js + WebSockets. It pairs one TV with phones and streams each page to the TV as soon as it is written and narrated.
  • AI pipeline (Amazon Bedrock, Nova Lite): vision describes the drawing; each act is produced with the Converse API + tool use (toolChoice: any), so the model returns a validated JSON "stage direction": pages with narration and dialogue lines, setting, mood, weather, the hero's action, props and the next question (sometimes a draw question). Retries and a built-in fallback story mean a child is never stuck.
  • Child safety: Bedrock Guardrails with selective guarding (guardContent) on the child's words and the model's output, a word filter, and storyteller rules (no famous characters or brands: a drawing of one becomes the child's own original hero).
  • Voices (Amazon Polly): generative voices for the narrator (Ruth) and adult characters, neural child voices for heroes. Lines are synthesized per character, joined, and word timings drive the read-along.
  • Hosting on AWS, one CloudFormation template: CloudFront (HTTPS + WebSockets) → EC2 (Amazon Linux 2023, IAM role, no keys, Session Manager instead of SSH) → Bedrock, Guardrails, Polly; S3 for drawings, audio and storybooks with a 1-day lifecycle rule; DynamoDB for hero memory with a 7-day TTL; CloudWatch logs, custom story metrics, a dashboard, and auto-recover / auto-reboot alarms; AWS Budgets alerts.

Challenges we ran into

  • New-account Bedrock quotas were 0. The first call failed with a generic throttling error and needed a quota request.
  • Vega build on Ubuntu 26.04: hermesc "not found" because the SDK installs it in a different folder than the build plugin expects (fixed with a symlink).
  • Guardrails blocked our own safety instructions. A prompt listing what a children's story must avoid tripped the filters; selective guarding fixed it.
  • Nova Canvas reached end of life during the hackathon, so we painted all 15 worlds ourselves as layered parallax art with our own SVG pipeline.
  • Polly generative voices have no speech marks. We stretch the neural voice's word timings onto the generative audio so read-along still works.
  • Cutting a drawing out of a real photo: glare, table edges and gaps in a child's outline. We detect the sheet first, close outline gaps, and add a sticker border.

All of these are documented in our friction log.

What we learned

  • Structured output via tool use is what makes an LLM reliable enough to direct an animated scene, not just write text.
  • On a TV, small things matter: focus, the Back button, never making a child wait without something to watch.
  • Infrastructure as code made the hosted demo reproducible in about 10 minutes.

What's next

Siblings drawing together in one story, printing the storybook as a real book, more languages through Polly, and testing on a physical Fire TV device.

Built With

Share this project:

Updates

Submission history