Survive the Century
This futuristic game of choice and consequence uses a branching narrative, much like a "choose-your-own-adventure" novel. The player makes choices that influence whether or not they "survive the century". It is about the political, environmental and social choices humans need to face in the years to come. It aims to show players that decisions made can make a difference to our shared future.
PRIMARY TOOLS= FIGMA + ILLUSTRATOR
DURATION = UX 2 WEEKS + UI 3 WEEKS
CHALLENGE
We were approached by best-selling author, Sam Beckbessinger, to build an in-browser game that she conceptualised in collaboration with climate scientists Dr Christopher Trisos and Associate Professor Simon Nicholson. The player of the game is put into the role of leading journalist and is prompted to make decisions about what news headlines to publish, thereby influencing public opinion and political responses to climate change.
In its simplest form, the game is a beautifully written narrative. This means that the design needs to accommodate generous amounts of text, while at the same time invoking a futuristic, gamified environment. The game is centred around a journalistic theme so this is also a consideration in the design.
To develop this product I worked in collaboration with the Electric Book Works team as Design Lead.
“This is a game for everyone, but particularly for climate nihilistic Gen Z's who know about climate change and feel hopeless and frustrated at the inaction they are seeing.”
SAMANTHA BECKBESSINGER, AUTHOR AND GAME CREATOR
IDEATING THE VISUAL FLOW
Concept sketches were created to determine the structure of the interface and how the UI elements came together on the screen.
These ideas were then digitised and crafted further in Figma, as mid-fidelity wireframes. We received feedback relating to functionality and placement of UI elements which were addressed. Once changes were made, and the mid-fidelity approved by the client, we began the high-fidelity design.
CONTENT BASED DESIGN THINKING
Key moments in the game are beautifully illustrated by Annika Brandow, but aside from these, most of the screens are text based. This means that the design needs to engage the player on a visual level.
To achieve this a colour palette, inspired by the bright illustrations, was chosen. An acid green and red contrast a deep midnight blue. The deep blue provides the backdrop for most screens, creating a dramatic, gaming environment. Reading larger amounts of text against a dark background is also easier on the eye and more accessible.
The luminosity of the green and red have a glowing appearance against the deep blue and it is accentuated by applying an added soft-glow effect to signify user feedback on actionable buttons.
The fonts chosen for the design include a combination of easy-to-read, accessible serif and sans-serif typefaces. This enforces the journalistic theme of the game as well as the literary element.
Beneath the light hearted fun there is a serious tone and the reality that the game presents is no joke. As the player makes choices the dashboard shows how the world is effected and at the close of each decade the player can read the resulting "news".
These "news" screens punctuate the game and are designed to look and feel like a genuine online news agent. Their design incorporates short excerpts as well as longer articles written by contributing authors.
DESIGNING KEY GAME COMPONENTS
The dashboard is an important feature of the game as it communicates the global status resulting from choices made during the player experience. The dash board appears on most game screens and is therefore an important factor to consider in the overall design.
The first version of the dashboard was designed using emoticon-style icons that were inspired by the featured illustrations. But when tested, users found the icons confusing and also tended to try to click them as they had a button-like appearance.
An alternative design was created that was less lighthearted but still playful. The icons were designed to look like traditional statistical dashboard indicators and the measurements of the global impact was also included as text.
The new design did not try to follow the style of the illustrations but rather aligned with the UI design of the game.
Further testing showed this revised dashboard to be more user friendly and accessible. It communicated the correct tone and the information it was conveying to the player was easier to understand.
NEXT STEPS AND KEY LEARNINGS
Working in collaboration with the Electric Book Works team was a great learning experience and it was exciting to see the designs come to life. I learnt that attention to detail and designing accurately and consistently in Figma makes handing over to the developer more streamlined.
The game has been widely reviewed, receiving very positive feedback. We are currently in the ideation phase for a physical version with the client. The big question is what form it will take ... a book or a board game? Or both? Or something entirely different?