Content Design + User Testing

Methods/Skills

Content Design, A/B Testing, User Interviews,

Card Sorting, Competitive Analysis, Moderated Usability Testing,

Qualitative Research, Quantitative Research, Wireframing, Rapid Prototyping

Tools

Figma, Sketch, Axure RP

Problem

Needed to create a digital debate space that could present important policy issues to everyday citizens in a way that's meaningful and free from biased arguments.

Solution

Utilized a message board (internet forum) system that allows users to hover over a debate argument to easily scan all of the essential top-level information pertinent to that argument without having to click on anything.

Beginning the Journey

For this case study, I created a new web application concept, called Policy Bytes, to showcase debates on significant policy issues for Citizens League. They are an organization dedicated to empowering all Minnesotans to be actively engaged in public policymaking.

These initial sketches illustrate early attempts to construct a new digital layout that could be free from bias and accommodate up to four debate voices. A grid system with collapsible text containers was utilized to present information at various levels, to not overwhelm the user, and to create a clear flow of information.

Feedback, Feedback, Feedback

I met with potential users in both groups and individually to better understand how they process and interpret information. It became apparent that they didn't want to be guided too much in navigating the interface, wanted to have the ability to scan information without having to click on it, and wanted a preview of the content before entering the debate space. Color was also hugely important, and shaped the way they perceived different argument claims.

Testing Participant: "Who is arguing and making these points?"

Testing Participant: "I want to have the most control possible, that's a lot of clicks to see the whole thing."

Testing Participant: "This is guiding me too much."

Testing Participant: "These are my favorite colors, they aren't making a statement."

Testing Participant: "When did I sign up for this ride?"

Refining the Concept

After meeting with users, I synthesized my findings and moved forward with a new design that encapsulated all of the feedback I received. This concept utilizes a message board system to present the debate content. By hovering on a main argument/premise on the left side of the interface, the back-and-forth conversation between the debaters appears on the right. This allows users to easily scan and gather information without clicking on anything.

Final Thoughts

The final design concept uses muted earth-tone colors to avoid any preconceived subjective color biases. Users can also click on any main premise buttons and to anchor the back-and-forth conversation onto the page to explore any piece of evidence attached to that argument. With this design, it's simple to quickly understand what is happening in a debate by hovering over any argument, while also providing flexibility for the user to click through and dive as deep as they want on any given topic.