DigitalDiary2014 is a game demo submitted as my final project for my MA in Digital and Interactive Storytelling. It is a narrative-driven casual game that explores issues of identity, internet community-building, and cultural exchange.
A screenshot of the game's first phase — the blog.
A screenshot of the game's second phase — the chat.
PROJECT CONCEPT
Operating in the space of "games for change" or advocacy, DigitalDiary2014 was designed to prompt reflection on how we perceive the lives and wellbeing of others through their social media posts. Through nostalgic cultural references and branching narratives determined by the players’ curiosity and engagement, it seeks to engage an audience familiar with the mid-2010s internet fandom space.
In the first phase of the game, players will explore the blogs of three characters, learning about their interests and cultural backgrounds. Once they are finished, they will choose one character that they’d like to interact with, proceeding into an instant messaging conversation. The conversations are designed to challenge players’ assumptions based on the static content they encountered previously.
ILLUSTRATION AND VISUALS
The content in the blog demo takes inspiration from trends in Tumblr blog design from this era along with fan-art culture. At moments, the blog references cultural moments from the era such as this animated illustration inspired by this iconic quote from the Captain America: Civil War press tour in 2016.
The chat demo is designed to follow the standard visual conventions of instant messaging apps while complying with the restrictions of the script that governs the interactivity.
NARRATIVE DESIGN
While the full game would feature three characters, the demo focuses on one, Ioana. The blog demo features seven posts that reveal some of her interests and real-life struggles, whereas the chat demo focuses on a discussion about her college plans falling through at the last minute. This premise was chosen because it reflects a common problem faced by young adults across cultures, and it can develop into deep conversations about identity and loss or stay relatively surface-level depending on the player's choices.
A visualisation of every possible path in the chat demo. There are three core endings (good, bad, and neutral), but twenty different routes through the demo with 76 possible choices.
Players' performance is measured in two variables: trust and fail. They earn trust for choosing person-centred responses in line with research on peer support in computer-mediated communication, while fails occur when a player chooses a dialog option that is offensive. Players who reach trust > 3 before the key breakpoint will receive a good ending and players who have any fails will receive a bad ending. Those who do not reach trust > 3 but also have no fails receive a neutral ending.
CODING AND PUBLISHING
A screenshot of the Tumblr theme editor on Ioana's blog.
The blog demo is published on Tumblr with a customised CSS theme. Posts were published directly to Ioana's blog or through dummy blogs, allowing them to appear as something she reblogged rather than posting herself.
A screenshot of the chat demo in Inky. On the left is the code and on the right a live preview of the game.
The chat demo was scripted in Ink, a purpose-built language for interactive fiction. The trust and fail variables were incremented in response to player decisions.
Ink's native text editor, Inky, exports games for web publication by creating a package of JavaScript, HTML, and CSS files. Custom classes defined in Inky can be referred to in the CSS file to change how the game appears in a browser.
FINAL DEMO
Narrative mind map created in Scapple
Illustrations drawn in Adobe Fresco
Blog designed and published on Tumblr
Chat scripted in Ink and published by Inky
Default chat HTML and CSS customised in Brackets
Chat hosted on GitHub Pages