K-12 sex education in California has come a long way since we were in primary school. In our application, we draw inspiration from some of the lesson plans and information the Advocates of Youth ( has produced to help schools and families improve the public health, increase awareness of and practice with consent dialogues, and reduce common social problems like bullying.

What it does

Our application aims to encourage kids (ages 7-12) to reflect on the idea of consent as they fall from the sky with Droplette, a charismatic/woke raindrop.

How we built it

It was important to us that we prove to ourselves that certain web technologies would support our future plans with this project, because we want to maximize accessibility (which we believe we do by running in web browsers, available on nearly all consumer computing platforms). For that reason, we chose to rely on two web based game engines. The first is called Monogatari, a visual novel engine that made it easy for us to define characters and provide branching narrative elements via dialogue trees. The second is called pixi.js, a 2D rendering engine based on webgl. When the page loads, the part of the game using the Monogatari engine starts. Later, when the rain-fall section begins, we spin up the pixi.js engine where our animated sprites react to user input and provide the background narrative to introduce consent dialogue practice.

Challenges we ran into

Games are hard, and hackathons are short.

Accomplishments that we're proud of

We put together a bare-bones working prototype where we can further test out the ideas we want to expand this app to include. We have become familiar with a system to add characters, dialogues, backgrounds, and sound effects in Monogatary. We are happy to be able to combine the two different game engines to quickly prototype our ideas. We are proud that all images in Droplette were hand drawn in Adobe Sketch on the iPad! We made a very cute ANIMATED Droplette character which squishes in the direction you move, which we LOVE.

What we learned

None of us had every used pixi.js, Monogatary, created a sprite sheet, or created an animated sprite. Those things were new for all of us. We also learned how to use GitHub in a group.

We learned how to bring in art drawn on an iPad and use it in the game.

What's next for Droplette

We approached this hackathon as an opportunity to prototype and test out some web technologies before embarking on a longer journey for a more complete sex ed application, which Paloma will continue to lead development on as she follows through on a proposal she wrote that was awarded an IdeaHub grant from Center for Creative Innovation and Entrepreneur Development.

Built With

Share this project: