top of page
awefewfwaefefwfe.png
awefewfwaefefwfe.png
awefewfwaefefwfe.png

Project Overview

Contentr: Content Moderation by Design is an ongoing digital game project run by the Ethics and Values in Design (EVID) Lab in the University of Maryland's College of Information Studies. Contentr is a digital adaptation of the lab's previous card game project, Content-Moderation-by-Design: The Game. Game design research was sponsored by the National Science Foundation under award CNS-1452854.

 

In both versions of the game, a group of players assume the role of a startup social media platform's policy trust and safety and content moderation teamsContentr was created as an educational game to provide an experience with content moderation: the processes, practices and policies online platforms establish and enforce regarding what users can post. The game is designed around United States policies.

My current role on the project is as the lead visual designer, game designer, and sole programmer. The game is being developed using the Gamemaker game engine and planned for release on web in the near future.

CONTENT WARNING!

This game involves discussing descriptions of (but not viewing) sexually explicit content, harassment, hate speech, self-harm, illegal activity, misinformation, and violent content. The purpose of Contentr is to provide a deeper understanding of social media platform governance, and as such real life examples of these topics are used in the game to simulate a realistic experience of this process.

Content Warn
Timeframe
1+ Year Ongoing
Role
UI Concept and Design
Visual Design
Game Design
Game Programming
Platform
Web
Tools
Figma
Gamemaker
Team
Devin Navas
Anna Lenhart
Katie Shilton
awefewfwaefefwfe.png

Problem

The physical nature of the card game limited people's ease of access to play Contentr. The original game designers at the EVID Lab wanted to adapt the card game digitally so it could be played online, and more easily distributed to classrooms/those with an interest in modern issues surrounding content moderation.

Goal

Re-design and adapt Contentr into a digital game that can be played online. Optimize the mechanics from the card game for this new platform, design game UI and new visuals based on the original visuals from the card game, and introduce new features to the game as needed to improve player experience.

UX/UI Design 

My first step in the process of re-conceptualizing Contentr as a digital game was to brainstorm ideas for the main user interface of the game. I used the original game's visual setup (concept shown below) as a starting point.

 

 

I began by identifying what items would need to be available to users at all times when playing the game based on the original rules.

  • Since the game's main mechanic is to have players sort "Policy" and "Content" cards into "Allow" or "Ban", I decided this feature would be at the center of the game screen, and be granted the most focus.

  • Other key items would be an indicator informing the player what "Round" of the game they were in, and some other items that are used throughout the play of the game, such as the "Section 230" card and the "Role" card for each round. 

I drew the initial UI concepts on paper to show to the EVID team for feedback, which I then mocked up in Figma for final revisions.

Screen Shot 2023-03-16 at 2.24 1.png
Click image to expand
awefewfwaefefwfe.png
Initial Wireframe Sketch
round.png
Click images to expand
First High-Fidelity Mockups

Key items that players may need to reference/use throughout game

dfvaf.png

Card(s) that have been sorted are visible in appropriate section

Frame 36.png

Card that is currently being discussed by players at the center

Click image to expand

Buttons that players click to sort cards into "Allow" or "Ban"

awefewfwaefefwfe.png
aerfaef.png

In "Round 3", there is no sorting, so the "Event" cards are given more priority on the screen

Frame 36_edited_edited.png

Sorted "Policy" and "Content" cards are grouped together and spaced out so they can be easily differentiated

In "Round 3", if a card the player has sorted "triggers" the event, the sorted card will light up in red so the user is aware what card triggered the event

Link to citation of real life event event is inspired from

new game feature added in this version

new game feature added in this version

awefewfwaefefwfe.png
Playtesting and Feedback

The EVID Lab team conducted two playtesting sessions to asses the reception of the digital adaptation of the game. There were two main player feedback items to note from the playtesting sessions.

Total Play Time of Game

Contentr is a game that primarily focuses the players' time on discussions amongst themselves on what choices the team should move forward with. Since it is so dialogue heavy, players spent a lot of time discussing each of the cards with each other, and often seemed to lose track of how long they spent on each card. Ideally, the EVID team wanted players to come to a conclusion on decisions for each card within 2 minutes. 

Keeping the Player Oriented

Players expressed that they had no sense of how many more cards there were for them to sort in each round of the game as they progressed. They noted that some kind of counter showing how many cards they had completed would have been useful.

edaedfef_edited.png
eqwdfewfddf_edited.png
awefewfwaefefwfe.png
Solutions and Feature Additions

Total Play Time of Game

Timer added that counts down until two minutes has passed, then prompts the players to advance to the next card.

Screen Shot 2023-03-16 at 3.28.41 AM.png
Screen Shot 2023-03-16 at 3.23 1.png

Card Counter added that shows how many cards are left in the round, and how many the players have completed 

Keeping the Player Oriented

Click image to expand
awefewfwaefefwfe.png

Visual Design 

Original Card Game Palette

Frame 37.png
Frame 36_edited_edited.png
Frame 36_edited_edited.png

New Palette for Digital Adaptation

Increased saturation of colors, and added yellow as a new contrast color

Group 443.png
Frame 36_edited_edited.png

Softer Shapes and

More Spacious Cards

Click image to expand
awefewfwaefefwfe.png
zxdxcsdsdasdd.png

"Like" and "Hashtag" Elements in Logo

The Contentr card game had a pre-defined visual style and color palette of its own. I decided to preserve the core of these elements for the web game adaptation, but re-design the overall style of the game to better suit a digital platform with the following changes:

  • I softened the font and shapes of the cards/game elements. The original card game's designs came off as more legislative in nature, so softening the game's elements helped give a more "playful" look to the content.

  • Incorporated a more engaging and colorful style in the digital adaptation. Since social media platforms typically use bright colors and elements, conforming to that style would emphasize the game's social media theme.

  • Created a logo for the game that incorporated "social media" elements into it, to further emphasize that element of the game's theme

  • Made the game cards more spacious to give more room for text and icons on cards, and allow for easier legibility on a digital screen.

awefewfwaefefwfe.png

Final Design System

Group 446.png
bottom of page