Don't Die

Overview

Objective

Don’t Die is a collection of interviews surrounding the world’s digital landscape in the early 21st century; effectively logging the thoughts, reactions, and feelings of those inside and out of the gaming industry. Inspired by Gamergate, Don’t Die was started in 2014 by our client David Wolinsky, an award winning author, journalist, and researcher.

Wolinsky has built a web tool and website allowing users to surface these interviews and sort them by the “type” of individual who was interviewed such as “People who Make Games,” “Museum Curators,” “Media Theorist,” and more. Since Don’t Die’s conception, Wolinsky has interviewed over 200+ people and has positioned Don’t Die as a valuable archive of gaming history. However, due to the site’s small working team, a lack of updates to the Don’t Die interface and content, Don’t Die has difficulty broadening and reaching its audience, encouraging site exploration. Our report documents the research and design process undertaken by our team in order to redevelop Don’t Die’s interface and provide a more seamless user experience.

Initial research and interviews into the current web tool helped guide our design process towards better envisioning Don’t Die’s site structure and shed insight into how users currently interact with understand the project itself. As a final product, we then redesigned the whole of the Don’t Die webtool in order to better fit the client’s sensibilities and its content.

Team

G/A Augustin
Yifei Chen
Proud Taranat
Harvey Zheng

Duration

Spring 2023

Research

Secondary Research

Through our secondary research, we looked at articles (both news and scientific) that cite or mention the creation of Don’t Die, and looked at people discussing David and the website on Reddit. Most articles were interviews citing industry figures about something they helped pioneer or create - for example, in a Master’s thesis about designing shooting games for women, the article cites David’s interview with Brenda Laurel, a game designer who was one of the first to try to design games for girls. Reddit was similar, leading us to the conclusion that people used the site to get pieces of information they may need about industry figures.

Competitive Analysis

Looking at historical archives similar to Don’t Die (history archives, etc.) to gain a sense of best practices, we found a few common notes between the websites:

1. Robust ways of exploring other articles on their websites, via time or other connections
2. Interactivity to keep engagement
3. Good tag and search functions

Interviews

We split our interviews into two types: Archive Curators (people we thought could provide useful information about how archiving is generally done) and Archive Users (people we thought could provide information on how they prefer their information organized).

With the curators we interviewed, we largely asked them to walk through their thought process when curating an archive. Interviews with our users largely followed two phases: a directed storytelling of an archive they’ve used, and think-aloud testing of Don’t Die. The interviews didn’t always explicitly follow this track though; sometimes they deviated into conversations about internet culture as a whole and how we might preserve it.

Affinity Mapping

Through affinity mapping, the team shared research, finding common themes regarding usability of the site, and how it compares to other archive-style sites. We then developed the four following insights.

1. The video game industry and surrounding culture’s growth outpaces resource development and collaboration.
2. The speed of the video game industry limits the ability to both define its history and provide time for reflection from those within it.
3. Archives provide a holistic and reflective representation of history which allow users to form their own opinions in ways that traditional textbooks can’t.
4. Within the Don’t Die archive, articles and topics of interest are not easily discovered by users, both on and offsite.

Our problem statement: How might we make Don’t Die more digestible, help people explore the website, and give the website more dimensions to be discovered through while improving the user experience?

Low-fidelity

Personas & Crazy 8s

Through brainstorming with Crazy 8s, we found our main themes:

1. Tagging systems that could be manipulated by the author and used to sort on the home page
2, Interlinking between similar points made in different articles
3. Contextual highlights, providing more information about niche topics

We formulated a list of potential users and improvements for the site for our client to rank through co-design activities,  identifying target users and key features from the client’s perspective. From the activities, we decided to prioritize on drawing the attention and refining the exploration experience of non-gamers and non-professionals in the field.

Wireframes

At this point our goal was very open-ended - finding a way to encourage users into rabbit holes and to explore the site - so we spent extra time ideating in this phase.

Our lo-fi sketches consisted of small features and micro-interactions that we can include on the website. These include: an audio player to listen to the interviews, a random interview button,more informative interview cards to display on the homepage, and a mobile option of viewing the interviews.

Our client felt that our lo-fi sketches were still too safe and do not provide an interesting enough experience for the audience.

Clickable Prototype

After client feedback we created a Figma prototype of the interview page that included all the features we wished to include from our first stage of ideation, such as a more informative header, an audio option, a tagging system, a navigation system, color-coded tags, and hover boxes.

Overall, the client felt that our lo-fi sketches overlapped a lot with their previous ideas and that some ideas still felt too ‘safe’.

Clickable Prototype

In order to gain a higher understanding of our client’s priorities and to find focal points upon which to center our prototypes on, we created a set of collaborative design activities for our client and his engineer. We were able to able refine our design priorities by gaining more clarity on principal target audiences and insights into which potential design aspects/features were most favorable.

To create these activities we drew from a variety of common UI/UX methodologies then decided what would be the most helpful for us at this design stage. In their final form, these activities were a set of ranking schematics sorted into varying types of users and then a bullseye ranking of different design aspects, features, or outcomes for Don’t Die as a finalized product. We also guided the client on how to measure attributes for each decision in terms of potential engagement, frequency, as well as personal interest.

The following insights emerged:
1. The Don’t Die archive should appeal to a broader audience overall and have a lower barrier of entry in content engagement.
2. Our client felt strongly that those interested in internet culture, non-gamers, hobbyist gamers, and rank-and-file employees who help make games, but don’t necessarily play them are all top priority. This is in contrast to our prior understanding that the site should be geared towards most highly towards academics.
3. There were a lot of experiential features our client found interest in adding to Don’t Die such as auditory elements (i.e., a podcast), a more robust search feature, and contextual information of the internet and world at the time.

Mid-fidelity

Speed Dating

For speed dating, we created three prototypes based off feedback of being "too safe" and preference for a website format. We based them off a bookshelf/, The Creative Independent, and a yearly breakdown list.

The following insights emerged:
1. Users preferred the list breakdown prototypes (prototypes #1 and #3) to the card display.
2. Users liked: Micro-interactions - more interaction and visual feedback; Customizable details; Visual elements
3. Users disliked: Overwhelming blocks of text; Up-front information

Think-Alouds

Our two prototypes for think-aloud testing were cards, the original system utilized, so we could compare which was more successful at conveying the client’s message.

The following insights emerged:
1. Users enjoyed having a clean and neat interface.
2. Contextual information helped users understand the “when” and “why” of interviews.
3. The tag feature was a nice inclusion but users were unsure how much overlap there would be.
4. Users enjoyed being able to customize.

Client feedback:
1. They found that the side by side design is overwhelming by offering too much information at once.
2. They wanted to change the information architecture on the contextual information to find a better implementation.

High-fidelity

Evolving our Design

Don't Die is a passion project that’s part art/part archive/part documentary. For us, it became just as important that the work we made represented the visual sensibilities of our client as well as the nature of the content. Moving into our high fidelity prototype, this led us to consider things like typography, color, and image treatment.

Features

Contextual Timeline - To open up the website to everyone so that anybody could read the interviews without confusion, we implemented a contextual timeline with background information to support the interviews.

Tag Jumper - For readers interested in only specific topics discussed in an interview, they can click on a tag in the summary that will bring them to where it is mentioned in the interview.

Audio Player - For users who are auditory learners rather than reading, an audio player was added to interviews where an interview was recorded. When playing, the interview will scroll correspondingly to the content.

Font Size/Color Changer - To improve accessibility and the reading experience, users are able to change the font size to whatever they are comfortable with. As a way to customize the user experience and include a fun aspect, a color changer was included so that users can change the background of the page to one of the included color options.

Final Desktop Website

Final Mobile Website