How the interface tells stories in video games

The Plarium Krasnodar piggy bank has accumulated a lot of interesting materials, and we want to share some noteworthy, in our opinion, examples of narrative design related to the design of user interaction (UX) and graphical interface (GUI).



Instead of joining


You are a character in a computer game. Your world is holistic and full of adventure. You will see dragons, zombies, or even an energetic advertisement, but pop-ups and a skill panel will never. Unless your creator wants to break the fourth wall.

Or you are a player. You are used to the interface as a convention, a must-have assistant. Even clicking on the fireball icon, you imagine that your magician casts a spell and releases fire shells from his hands.

But here you come across a game in which the interface becomes part of the story and even the character’s world. With it, you better understand the main character and at the right moments experience new emotions, mentally sending a plus sign to the developer's karma. Such cases are rare, but they enrich the culture of video games and change our understanding of the quality of the gaming experience.

Dietetic interface! = Narrative interface


First, a little explanation. To reveal the stated topic, you need to distinguish between these two concepts. A dietetic interface is an interface that is part of the game world, setting. As a vivid example, here's a health indicator and a stasis scale on Isaac Clark’s back from Dead Space. But they do not create a story, do not characterize the hero.


Illustration from medium.com

Another example of a diegetic interface, but with narrative interaction, is Peep Boy from Fallout. He has a strong connection with the history of the world and the character: there is information about the manufacturer, and also that he is included in the standard equipment of the inhabitants of the shelters (and this explains why the main character has an “interface”, and the other inhabitants of the Desolace )


Illustration from the resourcefallout4.wiki.fextralife.com

Another example of narrative interaction between an interface and a plot is the exam at the beginning of Fallout 3, when a player answers questions to determine character skills. Moreover, you can disagree with the results, and then the teacher will offer to name your own strengths and weaknesses. In essence, this is the process of creating a character in a narrative wrapper. And in Morrowind, this stage was disguised as registration in the Imperial Chancellery and filling out the “papers”. Of course, the correspondence is incomplete - you do not need to move the pen along the parchment, but even such a move is very good.

Detroit: Become Human turned out to be a very convenient project for the Android dietetic interface, which coincides with the game interface and is in complete harmony with functions, setting, history. We play for different androids, each has its own purpose. For example, in the “interface” of Kara’s housewife, there are only those tasks that she can do according to the program laid down in her. Wagering, quests and visual design are closely intertwined and give a cool, high-quality gaming experience.


Illustration from the resource sagamer.co.za

Or NieR: Automata - another project about androids, but with more interesting ideas. During the game, you find various chips that can be connected to a character or removed. The interface changes from this, that is, in fact, you control it by choosing certain functions for the android. Moreover, chip slots are limited and you will have to sacrifice some for others. Amazing harmony of setting and GUI.


Almost without chips - almost a clean screen.
Illustration from gamefaqs.gamespot.com.



Here, for example, there is a chip showing the health and level of the enemy.
Illustration from analogstickgaming.com.



And this is the interface if you decide to use the self-destruct function.
Illustration from platinumgames.com


Interface that reveals the character


Meet Austin from the Scapes series. He is not young, but loves to sit on social networks and does not part with the tablet. How do we know that? Yes, Austin just constantly mutters something about likes, mobile games, and so on. However, we truly understand the character’s love for social networks and games through the interface.


Illustration from dobreprogramy.pl

In Homescapes, we go through three-in-a-row levels, get stars for the victory, and spend them in the mission window to repair and furnish rooms. We say “mission window” because this is its essence, but in the game this is not just an interface window, it is a tablet with a to-do list. We often interact with him and begin to imbue Austin's life, because here in the neighboring tabs there is an analog of Facebook and “photos” of characters that change as the plot progresses. Very humane, very cool, especially the project news disguised as feed.

Continues the theme of devices in games with a symmetrical response from GTA V, which, after its predecessor, uses smartphones as a UI. It would seem that the phone is such an insignificant detail, but nevertheless it makes the characters livelier and brighter.


Illustration from prakard.com

All players have phones, many are versed in brands and models, so almost everyone understands how the personality of the characters is connected with the choice of smartphones. Novice criminal Franklin uses a budget device, rich Michael has a tricky Ai-Fruit, and a psycho Trevor has something broken-up, reminiscent of Nokia. Wonderful touches.


Illustration from youtube.com

There is a sound interface besides the visual interface. He reports on changes in the game, which is very convenient in shooters and action games, where pop-ups and text distract from a tense battle. Path of Exile has 7 classes, and each has unique phrases for different situations. For instance:
,
: « ».
: « , ».

: « ».
: « , ».

: « !».
: « ».

For comparison: in WoW, the characters have the standard phrases “Spell is not ready yet” or “I will not carry it away anymore,” which does not characterize them as individuals.

Another story - diaries. From a dry list of quests, this interface “genre” has grown into a full-fledged part of the character design. A vivid example is Max's diary from Life is Strange. It is colorfully decorated, the voice of the heroine sounds in it, and her hobbies and past are often expressed in the form of references. On one of the pages there is a phrase from The Lord of the Rings, on the other - mention of the film, on the third - a line from the song. From these grains you can understand how Max lives, what she loves, what she admires.


Recognize the Lord of the Rings?
Illustration from the resource life-is-strange.fandom.com


An interface that tells a story and touches emotions


Well, through the interface you can reveal the character, but what about breaking into the player’s heart? In the visual novel Doki Doki Literature Club! a sea of ​​drama and heartbreaking plot twists. In many ways, the game is built on the "reeling" of the fourth wall: it is assumed that one of the heroes realized himself as a character in the game. At the turning point of the plot, we see the screen:






Illustrations from lparchive.org

There are no other options besides accepting the cruel truth. This scene could be arranged in the form of a dialogue or a monologue of the protagonist, but this is an interface charged with drama, and it delightfully fulfills its role.

We increase the degree of tension. Heavy Rain uses the “flying” action options familiar to Quantic Dream. Usually they look like this:


Illustration from the resourceru.riotpixels.com

But in a stressful situation, words begin to tremble, blur, amplifying an already heated atmosphere.


Illustration from the resource jtmgames.wordpress.com The

heroine fell into the hands of a maniac, and she was about to be drilled through. What should she do? To panic. No, PANIC. And the game helps us feel this blurry, elusive text of a single choice.

Even such a standard thing as a health indicator can be made more interesting, which will help the player to get used to the character's role. To do this, in Doom, the portrait of the protagonist changes depending on the percentage of remaining life. This helps to understand how hard the protagonist is, and makes him lively, humane.




Illustrations from store.steampowered.com

Another good example of empathy for a character through the interface is in the scene of drinking in RDR 2. The main character gets drunk and goes to look for a friend. The screen ripples, control over Arthur is hard, and the familiar clues in the corner turn into drunken rubbish.


Not to mention the fact that all visitors to the saloon became Lenny. Even women!
Illustration from the youtube.com resource

But even without a narrative binding, the interface can be a full-fledged participant in the story. For example, in Metal Gear Solid 4, health indicators and music change during the final bout.


Illustration from the resource youtube.com


Illustration from the resource attackofthefanboy.com

The interface moves from the first part to the last, and the player is covered by a wave of nostalgia ... The epic of the battle is felt more acutely, as is the importance of the path that the player followed along with the main characters from 1998. And then comes awareness - everything, this is the end of the saga, the end of an era.

And finally: even ordinary, unremarkable interface windows can be transformed with a pinch of love for the game. In particular, using the player’s powerful imagination (and users like to think out, voice, revive - that's why commentary streams are so popular). Look how interesting, lorno and fervently beat the app evaluation window:


Illustration from twitter.com

This is a meeting with old Obi-Wan! And his catchphrase, just like in the first Star Wars. Such a nostalgic bribe is hard to ignore.

Instead of a conclusion


The conclusions about how good the union of the interface and the narrative is up to you. But, in our opinion, these are important and advantageous details. The game should be fun, and the techniques described in the article undoubtedly increase it. For the player, what’s behind the screen is the whole world, and the livelier and more emotional he is, the happier the users and the better the reality.

If you have encountered similar examples of the interaction of the interface and history - share in the comments, we will be happy to discuss :)

All Articles