Unofficial Chicka Chicka Boom Game in p5.js

uxBrad
6 min readMay 27, 2019

When I was tasked with creating an interactive story based on a children’s book that had to include some form of randomness and build on some of the things we’ve learned in the first 2 weeks of my class on p5.js — Chicka Chicka Boom Boom was the first thing that came to mind — so I ran with it.

tldr; Made a game that you or your kids should play: Chicka Chicka Boom Boom Game

The setup

Chicka Chicka Boom Boom is a children’s book that helps kids to learn the alphabet by turning the letters into characters and telling a story of how they go to a party and fall out of a tree — something like that. I only read it a handful of times when my kids were little and I was a bit too old to grow up on it (it was published in 1989).

The design of the book is bright, the typeface is bold, and the rhyming wants to make you get loud and excited when reading it.

Design Goals

My idea seems simple — Create an interactive game based on the story — letters will be piled up on each other after they’ve fallen out of the tree and the player will need to find each letter in ABC order.

The design should mimic the bold lettering and bright visuals from the book.

After placing the letters back into the tree, the player should be given the opportunity to play it again.

Development Goals

--

--

uxBrad

I’m Brad Cooper — UX Practitioner. A11y Evangelist (CPACC). Blockchain Enthusiast. Web Theorist. Find out more on how I work at https://uxBrad.com.