We were inspired by Freerice. This organization has been around for years, donating rice with the help of its users. Freerice's website includes educational trivia, which makes playing the game fun, and for every question that is correct, they will donate 10 grains of rice. It was satisfying to watch the rice pile rise as we played, and we wanted to create something that was gratifying and helps a cause. We were also inspired by Kahoot. Kahoot is a fun learning tool, and we wanted to incorporate that into our extension.

What it does

This extension is a trivia game. The user answers questions, and if they are correct, their score will go up by a point. If the answer is incorrect the button will appear red, and the correct answer will be revealed in green. The game does not have an end, but the user is free to close the extension at any time. Its simple design is meant to be enjoyable and not distracting from the stream.

How we built it

Our extension is server-less, which made it significantly easier to hack out. We use HTML/CSS/Javascript for the frontend, and in the future, we may need to integrate with an ad network to serve ads.

We came up with a list of fun and educational questions that are stored in the extension, and get randomly chosen for users. After every 3 questions, an ad gets rendered which will help generate revenue for charity.

For the extension, we made sure it was responsive and could run as a panel, video overlay, and mobile extension. This allows for a diverse set of users to use the extension and gives streamers the flexibility to display the extension in a format of their choice!

Challenges we ran into

During our investigation into Freerice, we realized that the way they made money was through display ads. After every question, 2 new display ads get generated. This helps them generate revenue that they can donate to the world health organization. When moving this to Twitch, we were unable to render their ads, and so the extension would be unable to support their charity. This was a challenge because it hurt our main concept. Users would no longer be able to support a charity by answering questions. However, this challenge ended up being a great opportunity, because it helped us go back to the drawing board and come up with a more personalized and Twitch-centric idea.

Another major challenge we ran into was how our extension will be monetized. In order for us to donate money to charity, our extension needs to generate revenue. We thought of trying to use bits to fund the extension, however this doesn't align with the "passive education" model of charity. The tried and true approach we've seen with Freerice is rendering display ads. We ended up putting fake ads on every 3 questions as a placeholder for future ads. We hope to work with Twitch after the hackathon to continue developing this concept and driving support for in-extension display ads.

Accomplishments that we're proud of

We're very happy to have created a functional project that is submitted to Twitch. It can already run as a video overlay, panel, and mobile extension. The questions are already fun and interactive. And the display ad flow is already built, and ready to be replaced with an actual ad network.

What we learned

The largest skill that we learned over the duration of the Hackathon was cooperation and task delegation. Because of the 24-hour time limit, we had to quickly decide on who would be working on certain tasks for the extension as moved forwards in a timely manner. Additionally, we learned about some of the limitations that were involved with advertisements in Twitch extensions.

What's next for Trivia for Charity

We would like to add more features to this extension. It would be awesome if streamers have the option to add their own questions. We would also add a menu for categories to add a variety of academic subjects, pop culture, and random trivia. We would have also liked to have a leaderboard for the current stream, so viewers can compete with each other. We would also like to have a small informational icon for the chosen charity.

We hope that this project can help inspire others to create more educational and charity-driven projects on Twitch. We hope to work closely with Twitch to extend their display ad network. We hope to work more closely with charities to give streamers a choice of which charity they'd like to support. We hope to add a larger base of questions to keep users engaged and supporting charities!

Built With

Share this project: