The Leading Times Card Photo

The Leading Times

Multi-Discipline | UX Design

An RPG simulating the toxicity and sensationalistic qualities of current journalism practices.

This project was completed over a ten-week period in spring of 2023. This was an independent project.

Capstone overview

The University of Denver's Emergent Digital Practices (EDP) program educates students on the emerging frontiers of digital art, technology, user experience, and tech culture. The goal of this program is to expand the critical thinking, ethical awareness, and artistic skills of students so they're prepared to lead the focal conversations surrounding these new digital frontiers.

The capstone course allows EDP seniors to present a synthesis of their studies in a format or medium they deem fit for their specializations and/or interests. For my capstone project, I decided to build The Leading Times, a browser-based role-playing game (RPG) simulating the toxicity and sensationalistic qualities of current journalism practices and media cycles. The game mechanizes popular logical fallacies and advertising strategies that define our current era of news, of which the player must eschew while also balancing both the social, moral, political, and ethical tensions between a newspaper and its readers. If they fail to do so, then the player experiences the more modern consequences of social upheaval: protests, public outbursts, even violence.

The Leading Times is currently a demo, which I will continue to adjust and revise throughout the months to come. To play the demo, go to https://klich.itch.io/the-leading-times, select the “Download” button, unzip the downloaded file, and open “THE LEADING TIMES.html” file in your preferred browser. 

Research & definition

The headache of free speech

The concept of free speech, guaranteed by the United States’ First Amendment, has consistently been a topic of debate throughout United States history. When it comes to U.S. news and journalism, practically since the birth of the country itself, newspapers have been vessels for party-specific agendas, which has remained true up into this century, even with the more recent digitization and monetization of all our news and content. Regardless of one’s political affiliations, most U.S. citizens receive their news via technological devices, such as computers, phones, tablets, the like. Republicans and Democrats are specifically more likely to pay for their news, search for news multiple times a day, and each as likely to challenge the viewpoints of an opposing party’s news source.

Even though the shock of “fake news” has somewhat recently been popularized through select political campaigns, the concept of sensationalizing the news or publishing misinformation has existed for decades. Yellow journalism, or news explicitly sensationalized to increase circulation, was a hot discussion during the late nineteenth century, and has since been replicated and re-branded as concepts such as “clickbait” or “fake news.”

In tandem with the political and social consequences of modern journalism listed above, there’s ample evidence that the type and amount of news consumed can have significant effects on one’s psyche. Following a traumatic event (such as the Boston Bombing Massacre, 9/11, etc.), the more news a person consumes about the traumatic event, the more likely they are to develop post-traumatic disorders, such as PTSD, anxiety, even long-term cardiovascular problems. And, even though this may be the case, scientists suspect we’ve perpetuated a possible “negative bias” within our news, where “fear is more motivating than opportunity.” A Russian news website experimented with only reporting good news for one day, and as a result, they lost about ⅔ of their following

Sleuthing the project's passion

To begin thinking about our capstone projects, my class began our ideation phase by drawing a random selection of thumbnails of abstract concepts we wanted our capstone to visualize and/or discuss.

Scanned journal photo with thumbnails for project ideation
Scanned photo of my thumbnails for the ideation exercise

After completing this ideation exercise, I decided to focus my capstone around three ideas:

Guided by the statements above, I decided to propose my capstone project to be a videogame in which the player is an editor for a newspaper company who experiences first-hand the toxicity and slyness of modern journalism practices. I wanted the game's objective to be showing the player the political, economical, and social biases of media publishers and how complicated it is to deliver truthful and honest news in today's media haze.

I wanted to focus my project through a journalistic lens because I personally find it frustrating how our current media is sloshed with misinformation and psychological gimmicks. And, in light of recent events, such as the January 6th insurrection and Alex Jones’ Sandy Hook defamation trial, I think it’s important that people understand that our news, our media, our content, can (and will) dramatically shape the way we think and behave in society. By all means, I am not above the tricks and traps of current journalism-- while I may try my best to decipher where I’m being deceived, it’s practically impossible to uncover completely unbiased and neutral news.

While this project won’t necessarily discuss the nuances of top-down and bottom-up thinking, the overall strategy of having someone start with the details of an article, then connect their behavior to a larger picture, does somewhat align with this objective. Regarding the last objective listed above, I used Twine to build this game, which is a markup-based tool and therefore already utilizes native HTML elements naturally built to be accessible for screen-readers and other accommodation tools. 

Mapping user experiences

Following the preliminary research and ideation exercise, I configured a user journey map to better understand the restrictions and assumptions the game will rely on in order to be completed in a ten-week period. I decided to utilize two proto-personas for this project, since this game will be presented in a specifically-designed installation and also live online, where anyone can interact with it in unknown contexts. Esteban is the proto-persona who interacts with this game within the Capstone Expo, while Ember is the proto-persona who finds the game online.

Photo of a whiteboard with the project's user journey map
Whiteboard of user journey map

Through building this user journey map, I generalized a few assumptions that I followed, moving forward with the production my game:

While some of these assumptions are very restrictive and not very inclusive, for the sake of completing this project within a ten-week timeframe and being the sole designer and developer for this game, these assumptions will allow me to design a game best aligned within my current design and development skills. 

Executing a feasibility study

Following the user journey mapping exercise, I decided to focus my attention on further scoping the game before I began prototyping, which was mainly focused around finding answers for the following questions: 

Outside of the more software-based questions, I wanted to be very cautious regarding the heavy politicization of current media, and how that might counteract the messages of the game I want to convey. Because, in the United States specifically, a Republican’s and Democrat’s loyalty for their specific news platforms runs high, I needed to consider ways of depoliticizing the themes I present so that any player, no matter their political affiliation, will not immediately fall back on their own biases and prejudices when playing the game. My fear was that players may become defiant and untrustworthy of the messages I convey throughout the game if it seems like these messages are coming from a different political party than theirs, and at that point, the game would fail its objectives of exposing the player to the toxicity of today's media cycles.

To prevent political bias, I decided to focus on the rhetorical fallacies used in journalism to elicit emotional and/or irrational responses from readers, since rhetorical fallacies are overwhelmingly present in media across the political spectrum. 

For my feasibility study, I wanted to understand the responses of two popular fallacies: either-or fallacy and the correlation vs. causation fallacy. Along with these fallacies, I also wanted to better understand how participants would decide the subject order of headlines (ex. "Cat saved from tree by fireman" vs. "Fireman saves cat from tree"), and I wanted to understand if participants would select more optimistic or pessimistic headlines to represent article synopses.

Using Twine, I built a prototype of this headline-picking game mechanic and tested the prototype with classmates. This prototype offered no incentives for picking one headline over the other, for I wanted to understand the "baseline" thought process someone may go through in order to pick a headline. My goal was to use this understanding of what the "baseline" is to better balance the game, and provide the proper incentives to make the headline-picking decisions harder. I'm aware there may be a bit of a Hawthorne Effect with this study because the participant is actively being surveyed, so I took the results of my study with a grain of salt.

Screenshot of the usability test with different headlines with different subject orders
Example of a synopsis and its suggested headlines presented during the feasibility test

Due to the nature of the University of Denver's course-related research guidelines, I cannot publish the results of my experiment. However, I can say, in summary, that my prototype test did verify that my game's headline-picking mechanic was fairly unbiased, regarding political stances and triggering rhetoric. The headlines picked for each article synopsis were fairly balanced among my participants, which I took as an indicator that my process for building headlines was built well for players with varying demographics. During testing, the participants expressed how they felt challenged and intrigued by the nature of picking headlines for an article synopsis, and some of them even wanted to understand their consequences in picking certain headlines.

As for the maximum file capacity, it solely relies on the storage space of the player’s computer, so I made the game file as small as possible to prevent storage issues.

Process

After synthesizing the results from the feasibility study, I began to prototype the interactive flows, staring with whiteboarding the basic layouts of the wireframes, and eventually ending with fully-interactive prototypes built using Twine.

Two photos of whiteboards with sketched wireframes
Whiteboards of daily "shift" UI planning

Due to some technical constraints with Twine (and my own dev skills), the preliminary whiteboarded wireframes were slightly adjusted during their digitization to make the UI more responsive among different viewport sizes, less memory-taxing on the browser, and better adjusted to Twine's technical and styling restrictions.

Screenshots of the Twine node configuration and the final UI for the game
Digitized daily "shift" UI

Outlining player interactions

Because Twine is mainly a tool for building nonlinear storytelling games, I decided to keep the UI and the user interactions as minimal as possible. As the player edits the articles during their daily shifts, they have select touchpoints within the article drafts where they can edit the copy-- mainly to hone the player’s attention to the specific syntax and diction used within the article, and also to make it easier to configure quantifiable consequences of their decisions. 

Building the script

After scoping and defining the basic objectives of the game, I began building the game script. I decided to characterize the player as a “diversity hire,” so to speak, to induce the feeling that the player is already on thin ice at this company, and also to “other” the player from the journalists so they have an incentive to appease the journalists. Each journalist represents a specific vice I find common in today’s news and media. Shelby’s articles usually contain a lot of misinformation and causation vs. correlation misconceptions, whereas Joe’s articles are accurate in their information, but heavily opinionated and emotive. Dan’s articles usually rely on the player carefully reading the context and agenda of the article at hand and making the best decisions from their deductions.

While writing the game’s script, I intentionally made the names, articles, and headlines somewhat absurd and childish for the sake of removing any political affiliation with the content presented. I do not mention race, legislation, or current hot topics, such as abortion and police brutality, anywhere within the game in fear of triggering the player’s own political opinions and having those opinions dictate their behaviors. I even used Notion’s AI tool to help write the articles the player edits in order to remove my own political bias and writing voice.

Being a nonlinear game, a player can play the game multiple ways, each which should lead to different endings and conclusions. If the player decides to rely on their own moral compass when editing articles, then they most likely will cause the Turkeys to insinuate a protest against The Leading Times. This idea of a protest happening outside the headquarters is based on the multiple recollections of both Republicans and Democrats protesting outside the opposing party’s news headquarters. However, if the player decides to appease the journalists and/or Turkeys throughout their gameplay, then the protest might not occur, but other negative consequences may happen, such as getting fired for not meeting the daily quota.

Leading with accessibility

While I was designing the game’s user interface, I placed most navigational and interactive elements (outside of editing the articles themselves) in a container fixed to the bottom of the viewport in order to have a clear distinction between the story’s non-interactive components and the interactive components.

Since Twine is a markup-based framework, I utilized the built-in HTML accessibility features (such as browser-native focus states) in the game to make the game as easily-interactive as possible. 

For players who might have cognitive and/or language comprehension difficulties (or for players who simply don’t like timed games), they can disable the timer using the “Pause Game” menu in the upper left-hand corner. For players who may have vestibular disabilities, they can disable the shaky text effect that appears when a mood rating is low also using the “Pause Game” menu in the upper left-hand corner. 

Conclusion

Since The Leading Times demo has been uploaded to itch.io, I’ve received generous amounts of feedback and critiques on its design, gameplay, and overall experience. Again, due to the nature of the University of Denver's course-related research guidelines, I cannot publicly publish the feedback from the people who have played The Leading Times

To play The Leading Times demo yourself, go to https://klich.itch.io/the-leading-times, select the “Download” button, unzip the downloaded file, and open “THE LEADING TIMES.html” file in your preferred browser. 

Next steps

The Leading Times will be installed at the University of Denver’s 2023 Spring Expo in a few months. Until then, I will continue debugging and polishing the game based on the feedback and critiques from its players. 

In the future, if I were to rebuild this game completely, I believe finding another tool other than Twine to build The Leading Times would afford more unique and specialized interfaces and interactions. I also believe re-examining the points system and the overall balancing of the game may elicit better results and user experiences, as most of the players indicate that the game is “too easy” to play. I also want to add more content to the game, both in the form of more articles, endings, and character interactions with the journalists and the Turkeys.

Return to Work ->Arrow