Resources
Inspired by Reddit, I made a fake-news quiz game that pits real, but unbelievable headlines against fake ones, using API data from the Reddit forums ‘The Onion’ and ‘Not The Onion’. Players simply have to guess which are which, and are presented with proof after answering. Their streaks and correctness are tracked, along with the global number of people “fooled”. It was an opportunity to learn about real-time databases, and an excuse to procrastinate vicariously.
I gained experience:
- Using Google Firebase RTDB
- Using Reddit’s API integration
- Sharing my project and responding to user feedback
Design
I designed the website to mimic the clear, slab like gauze of physical tabloid print, with pauses in between turns to allow the user to direct themselves to the article in dispute (if they don’t believe the answer). This simplicity allowed me to use CSS3 flex-box to make it mobile-responsive.
I made the inputs the largest individual elements (with some comical imagery), and ever present tickers hinting at the live state of the experiment.
Technology
I used Reddit’s ‘random’ API endpoint to grab a random post from both subreddits. Technically, you could cheat, and if I were to revisit it I would clean the code and wrap it all in a closure to remove access to private variables, further obfuscating the variable/function that gives the right answer – it wasn’t too important here.
I used Google’s Firebase to create a document-driven database, with write rules only allowing sequential addition to either correct/incorrect metrics. A JavaScript file maintaining a persistent connection delivered snapshots to the front-end in order to update the view with callbacks.
I used browser cookies to track the user’s current streak.
Feedback
I tweeted at ‘The Onion’ to no avail, however my post to the web development subreddit ‘Web Dev’ was popular enough to warrant responding to feedback. The consensus was that although the idea was great, some of the headlines were too obvious due to patterns in syntax from one specific source. I was able to implement some rudimentary culling, and remove repeat questions based on this, and improve the user-experience. Furthermore, the Javascript did not execute on some iOS devices due to a cross-origin quirk that I was consequently able to resolve.
Overall, it was incredibly rewarding to watch users interact with my project in real-time, and it was several days before it churned completely, due in part to me responding to questions and cross-linking it in different forums.
