The Engaging News Project’s (a non-profit based at the University of Texas at Austin) flagship research and tool is on using quizzes to improve reader’s comprehension and retention of information.

I was assigned to lead a rebuild of their Quiz Creator which would allow journalists an easy way to build quizzes, embed them on their articles, and track data around their quiz.

I prioritized usability, accessibility, and performance on quiz embeds, bringing total requests down to 7, total embed page size to 75kb, and ensured the quizzes are screen reader and keyboard accessible.


To learn more about the creation of the Quiz Creator, read my in-depth case-study on the process of building the Quiz Creator.

Problem

The previous Quiz Creator was slow, bloated, and the quiz creation process was unreliable and inconsistent.

Each embed of a quiz unnecessarily fired up WordPress and 1.1mb of resources. Each click required a new page load from the quiz tool, making the UI and UX feel outdated with bootstrap styles. Creating a quiz was slow, unintuitive, and unreliable. The Engaging News Project needed a tool that would compete with existing quiz creators, quickly let journalists create quizzes, and provide end users a pleasant, accessible experience.

Solution

I eliminated the dependency on WordPress for embedding quizzes, built a robust plugin for creating quizzes, and prioritized performance, accessibility, and usability.

I started with competitive research of existing quiz tools, and created goals and objectives for the Quiz Creator for the ENP team to approve. Next, I sketched out component ideas with pen and paper before moving directly to the browser for low-fidelity prototypes.

To improve performance, I removed the dependency on Wordpress by creating new database architecture and configuration files to allow the Quiz Creator database to be hosted on a more robust server aside from the WordPress install (if desired).

For better usability on creating and taking quizzes, I made sure everything was screen reader and keyboard accessible, and that you could have a great, fast experience on any device.

Outcome

The base embedded iframe only requests 7 files (75kb total), and has a cutting-edge UX.

I embraced the Progressive Enhancement philosophy throughout the entire development process, resulting in a modern Quiz that works quickly with or without Cookies or Javascript. The Engaging News Project team is beyond excited with the outcome, and the tool is in use by mid-sized news organizations around the US as well as the public radio show Science Friday.