Sylvester and the Magic Pebble: A Children's Story Experience
Sylvester and the Magic Pebble is one of my favorite childhood stories. I reproduced the spirit of the story by creating an interactive version that progresses the reader through the story as they hold in-world elements up to your computer’s camera.
This past summer I attended NYU's ITP Camp for the first time and learned about the magic of machine learning. Using Glitch.com to host the experience and Google's Teachable Machine to train an interactive model, I created a children's story interactive experience. Sylvester and the Magic Pebble is one of my favorite childhood stories. I remember my mom sitting me down at night and reading it. I wanted to recreate a fond memory into something interactive for other children to enjoy.
Although I am still working out how you can train your own model with objects you have at home, you can visit the experience here.
The Homepage
The process
My first step was to train twelve classes in a machine learning model using Google's Teachable Machine. The result looked like this:
Although not 100% precise, the model distinguished the classes to a high enough percent. Next, I encoded the link to my model in Glitch.com and used a series of IF statements to take the user to a new page once the model recognized a specific class.
Then I created a cohesive experience that progresses you through the story when the model recognizes a class. Each class is intentionally placed to sequentially follow the narration. Here is the Sparknotes version of the experience:
On the first page of the story, Sylvester finds a red magic pebble and wishes it would stop raining. I didn't have a red magic pebble but I improvised using an orange ping pong ball. Readers should hold up the "magic pebble" and say "I wish it would stop raining." This will take you to a sunny page!
On the first page of the story, Sylvester finds a red magic pebble and wishes it would stop raining. I didn't have a red magic pebble but I improvised using an orange ping pong ball. Readers should hold up the "magic pebble" and say "I wish it would stop raining." This will take you to a sunny page!
As Sylvester is running home to tell his parents about the pebble he runs into a lion. I didn't have a lion stuffed animal but a tiger will do.
Sylvester panics when he sees the lion and wishes he were a rock. After days and weeks go by, his parents send out a search party of dogs to find their son.
As the months go by, Sylvester's parents become hopeless. One day, they have a picnic by Sylvester, who is still a rock. They place the magic pebble on the rock and Sylvester wishes he was back to a donkey. The family is reunited and they can continue on with their lives. To match the sweet ending, the reader is supposed to hold hands with your reading buddy and at the end, there's a special song that plays.
This project demonstrates my desire to craft more than just passive experiences; instead, I want to produce more interactive and meaningful experience for others that combines both the physical and digital worlds.
Skills used: HTML, JavaScript, CSS, Machine Learning, Storyboarding