Diegetic UI - Realistic, or Distracting? - Extra Credits

Wanna watch without ads and see exclusive content? Go to go.nebula.tv/e...
What makes a good UI and a good HUD? Can you make narratively immersive UI that doesn't end up distracting or confusing the player? Is it okay to just make "boring" UI?
Follow us on Instagram: bit.ly/ECisonIn...
Subscribe to Extra Credits for more episodes every Wednesday! bit.ly/SubToEC
Get info about all our shows at becausegamesmat...
___________
Get your Extra Credits gear at the store! bit.ly/ExtraStore
Thanks for participating in this week's discussion! We want you to be aware of our community posting guidelines so that we can have high-quality conversations: becausegamesma...
Contribute community subtitles to Extra Credits: www.youtube.com...
Talk to us on Twitter (@ExtraCreditz): bit.ly/ECTweet
Follow us on Facebook: bit.ly/ECFBPage
Watch us play games and have fun on bit.ly/ECtwitch
Listen to our podcast: becausegamesmat...
Follow us on Instagram: bit.ly/ECisonIn...
Follow us on Tumblr: bit.ly/EConTumblr
___________
Would you like James to speak at your school or organization? For info, contact us at: james-portnow.com
___________
♪ Intro Music: "Penguin Cap" by CarboHydroM
bit.ly/1eIHTDS
♪ Outro Music:
"A Long Way Home"
By nokbient
ocremix.org/re...

[@extrahistory]

Good UI should be legible first, and stylized second.

[@callmeeuan8372]

Extra Credits escape from tarkov has a very good immersive way to check ammo, pull out the mag and looks the bullets

[@leoparathesweekgeeky7244]

This is fair, though I remember very vividly when I first played Fallout 4 how the Pipboy3000 became the menu and how Power Armor changed the UI. This stylish design showcase a long standing tradition of this series of the advanced technology of the age. So, I think UI should also incorporate the world you are in, to help in framing the theme for the players.

[@alek7998]

@@callmeeuan8372 Just like Red orchestra

[@GreatGeneralZar]

I wholly agree with legibility first. the more legible, and easily assessed your UI the less time you need to spend in it. Plus true imersiveness is letting the player suspend their disbelief. Yatzee of zero punctuation says it best I'm going to quote this the best I can from memory "immersive is when you finish playing 8 hours of thief two and go outside and immediatly try to check you visibility meter" . Even with an in your face UI you can be super immersive.

[@thegreatjay1245]

Talk about tower defense games like tiny defense and plants vs zombies and why people love them.

[@foxstele]

I have to admit it would be fun to have a NPC wrestling with his exclamation mark or enemies angry that your "press x to duck" window is obscuring their view.

[@R4V3-0N]

Or having your character turn around to wipe the blood of the hovering camera behind them after they start regenerating health or something. Sounds like something straight from Deadpool.

[@samuelmendoza9356]

@@R4V3-0N i would be surprised if the future devs are not writing this down on their notes.

[@axelpatrickb.pingol3228]

I nelieve some PC games touched upon that and treated the game being a "game" as both a mechanic and a narrative device...

[@ocirMZ]

Try Magicka, there's an npc complaining about her exclamation mark

[@datbootlegger]

I'll just... Write that down

[@darthtace]

I've always rationalized non-diagetic UIs as a kind of window into my character's head. Of course my character knows how injured they are, how much mana or ammo they have left, and even things like where off-screen bullets are coming from and what items in their environment would be useful. For any experienced character, those sorts of things would be intuitive, and granting me that knowledge helps me understand what my character would be thinking in those moments, in addition to granting me more of their non-explicit abilities. Maybe that's just me though.

[@FlackNCoke]

Same! It's why I don't mind the little indicators over enemies in the Batman Arkham games or Spider-Man PS4 telling me when I can counter or dodge. Both of those characters would instinctively know these things but I, a mere mortal, do not, so giving me the extra boost helps put me in their shoes better. Ditto for things like Detective Mode.

[@Just_A_Dude]

Exactly how I feel. The UI elements and other things make up for you nod being there in the game, and not having the instincts and training of the character.

[@jamrenzee]

Yeah. Like how 3rd person shooters are better for me than first person because I generally look all over the place and not just in the direction I'm going so third person games better represent the access to info id have than the first person perspective really allows for, outside of vr of course . That's where shooting really shines for me

[@donbionicle]

Oooh, now there's a fun idea. The game's automatic UI for indicators like that starts off bare bones and lacking, but gets progressively more detailed as the story goes on. You can tell what's going on better as the character does!

[@Dragonoid269]

@@donbionicle Wouldn't that be opposite to the players need for said indicators though? Those indicators of when to dodge/counter/etc are the most useful when just starting the game or when meeting new enemies with different patterns. Whilst once you're near the end you might already have a good idea when to do those things without needing the visual indicators as much. Perhaps a better way of playing with this idea would be the reverse, where we would slowly reduce the ammount of indicators due to your character losing their innate abilities / memeries over the course of the game.

[@RyanKing00]

I feel like the HUD and UI in halo, is actually pretty good, and blends perfectly with the narrative. Especially since the ammo counter, targeting reticle, and shield bar are all being displayed on the helmet of Chief's Mjlnoir armor! Ammo counter and targeting reticles are also standard for marine and army trooper helmets, being linked to a computer in the helmet.

[@tnecniw]

Same with Doom.

[@clydemarshall8095]

Halo does a lot of things really really well. HUD, encounter design, level design, pacing, narrative and gameplay blend. The original trilogy had their issues, but they were masterpieces.

[@AdmiralTails]

I feel like you can't really bring up this kind of stuff without mentioning Metroid Prime, which took this a step further by adding in the opaque elements of the helmet, which even held some parts of the UI, among other effects to really give the impression that the HUD was all part of the helmet.

[@christopherverhoef9112]

Then there's the bit in the last level of Halo: Reach where your helmet gets cracked and knocks out some of the HUD. There's no better way to say, "You're screwed."

[@ripster7]

@@christopherverhoef9112 oh lawd, my friends and I spent so many sleepovers trying to survive longer than each other

[@gniludio]

There is also the possibility to hide UI in art style. Like colors for weapon rarity, mimics, etc.

[@Asheriancommand]

that takes so much practice and very few UX and UI Designers are that capable to have both a good artistic and design collaboration between their team to successfully deploy a good UI system that has a notable art style that isn't distracting or at ends with the game itself.

[@aka5]

@@Asheriancommand thank God you put a full stop at the end; that's where your comment really needed it

[@fernandobanda5734]

@@aka5 Thanks for responding with meaningless sarcasm. That's *what* this thread really needed.

[@henrikmunkmadsen3190]

@@fernandobanda5734 & Akașșș Why so salty? 🤔

[@henrikmunkmadsen3190]

That's really a different angle from what was described in the video, though. Like you can use all sorts of things to convey information, like words, shapes, colours, hover-effects, whatever, it just makes the ui more information dense.

[@Rehteal]

Now I want to get some signs that say "Press Ctrl to get into cover" or "Press SPACE to vault over walls" and glue them to random walls and fences (Not private property of course). Call it street art.

[@IIIDemon]

come to magfest with that. i think we need it.

[@sjonnieplayfull5859]

When its not private property, its public property. I suggest Duck tape.

[@RAFMnBgaming]

@@sjonnieplayfull5859 Woo-ooo!

[@volrag]

If you did that, you would of course have to start with signs that say "Press F to pay respects" once you had covered every available surface with the other signs.

[@DetectiveThursday]

To be fair Fallout's use of Diegetic UI goes all the way back to the first game in 1997

[@beliynikita1433]

System Shock arguably used it back 94

[@torperator1555]

And the Pip-Boy was always wrist mounted!

[@nbtwall7287]

A good example of diegetic UI would be Metro for me. The watch shows your filter minutes and how much light you're in. Some guns also have mags that let you see how many bullets you have left visually

[@Azraeltheangelofdeath]

Yeah I always liked how it like far cry 2 UI where you health and ammo counter are there, but they disappear after a while, so its not always on your screen

[@Byefriendo]

Also in exodus the radiation counter watch. It also does have the cool on screen prompt of green flickering too tho

[@AlechiaTheWitch]

Nerf gun

[@Ghiaman1334]

"Press X to Zoey" *mashes X*

[@legendarytat8278]

X

[@roguebanshee]

Are you sure you're using the right controller, you may want to try the one for the "other" console.

[@TenyoS]

X

[@999Plasma]

I've never mashed so much since i've been allowed to button mash on Morgana's head

[@Vote4Drizzt]

X

[@pettersonystrawman9291]

Idea for an episode topic: Transparent vs Non-transparent mechanics. E.G. Lague of legends is transparent (shows exact numbers of HP and exact amount of DMG an ability does, the ratio by which it scales with ability power etc.) and Dark Souls is leaning more heavily on the non-transparent side (often representing information without exact numbers, lot of things simply described in words as high and low, instead of actual number etc.)

[@abudgie6909]

CS:GO is a good example of non-transparency, since it doesn’t give you hit markers. Makes the information game more interesting.

[@sonictimm]

AOE 2 came out 20 years ago, and there are still non-transparent discoveries being made about that game, often involving underexplained mechanics or unusual combinations of different mechanics. Like League, it's got a competitive multiplayer scene, but unlike League, it's not constantly changing, so it's more surprising that there are new discoveries being made.

[@RAFMnBgaming]

Non-Transparent? How about Opaque Mechanics? That sounds pretty shnazzy.

[@Tioko]

I wonder if Nier Automata UI is considered diagenic or not. I mean, we *are* playing a robot... And the menu we as the player see is literally what the character sees.

[@KnakuanaRka]

Yeah, thats’s a fantastic example of diegetic interface done right. I remember one of Design Doc’s “Good Design, Bad Design” videos talked about it, contrasting to Fable 3’s poorly handled attempt at such an interface with its menu and skill tree.

[@henke37]

Some weird meta/diegetic hybrid I think.

[@trainathan]

I'd definitely say so. While there are issues with that, like it all being see from the third person and not first, there are 'status effects' that damage your ability to see your health bar and such. On top of that, if you manage to hack A2 during the final fight in the game, you have 9S actively 'hacking' into her pause screen, which is a real trip.

[@Jandalph]

Also you can uninstall UI elements to make room for more combat upgrades. Nier: Automata ist as meta as it gets.

[@Starfloofle]

@@trainathan yo wait what? That's actually super cool, I need to try that if I ever play the game again

[@syber-space]

I absolutely love Astroneer's inventory and language approach. The inventory is visible on the player but floats up to the camera when opened. All the in-game chemicals and resources have a sound, symbol, and a name if hovered over. This allows the player to get more info, but keeps the in-game world simple and accessible.

[@Kapin05]

The Half-Life games, and other sci-fi games like Metroid Prime, have a cool way of explaining their HUDs - suits. In Half-Life, you wear the HEV suit, which is a handy explanation for your strength, HUD and amount of weaponry.

[@paurepiccheeseman]

I’ve always found that those simple diegetic HUDs work better than any other BS people try and come up with - like, google glass is a thing, there’s no reason your future super science soldier shouldn’t be able to use something similar

[@davescott7680]

@@paurepiccheeseman Hololens is a thing too, no reason why it can't lay the UI within the world too. :)

[@tbthegr81]

Except that Gordon wears his HEV suit without it's helmet (That can bee seen on dead bodies of other scientists) so unless he has the HUD integrated into his glasses it doesn't make sense.

[@mdumasyou]

One of the things I liked about Prime is it went the extra distance to reinforce the Diegetic elements, you are are seeing what Samus is seeing (the screen on her visor). Liquid splatters wouldn't just fade, the suit had to activate a function that cleans them, and bright flashes would cause a mirror effect where you could see Samus' face reflected against the inside of the glass for a second.

[@gniludio]

Having a SciFi-Suit is the easiest way to explain the HUD/UI. And it's the worst...

[@fillershmazman3030]

At the end of the video all this UI started to remind of MMORPG's UIs

[@jondoe5937]

That's one of my peeves about MMORPGs, especially ones which have the trend of "login spam." The barrage of popups in the vein of "You missed this/You logged in and got this/This is on sale/Buy this/This is what's happening" either makes me tune it out or want to log back out.

[@BlueSparxLPs]

MMO UIs and HUDs can definitely be the worst. There's plenty of games that I was turned away from very quickly just because of the excessive (and growing) clutter as you progress.

[@TheSunriseAnimation]

eve online all the way at the front!

[@GeekInBelgium]

And then, you get FFXIV, highly customizable UI, clearly shown options if you want reminders when logging in or not. And constantly evolving on feedback. That's also a benefit of paying a sub for a MMO.

[@manaeth]

ehm no. mmos has usualy the best uis, since, if you dont know, can be HEAVILY customizable in many especialy more old school mmos. like you can COMPLETELY hange it looks, size certain elements, add/remove some features etc.

[@sethlangston181]

I think it's pretty funny in MGS games when Snake's support make him aware of the UI.

[@ryko9975]

Ive always thought the phones in GTA 4 & 5 did a good job. fast, clean, and also a nice mix between diegetic and UI. of course its not like gameplay in GTA games are super complex

[@armorfrogentertainment]

2:11 I was under the impression that basically all of Halo's HUD was diegetic and being projected onto the inside of the character's visor.

[@Roboyoshi15]

So we're not even gonna mention Metroid Prime? That game had a great UI that made you feel cool.

[@BlaxeFrost-X]

I have a bug report: When the message "Press X to Zoey" appeared, i pressed X in my keyboard and it didn't do a thing...

[@charlesbernier990]

TIIIIIIIMMMMMMMMMMMMM!

[@OtakuNoShitpost]

That's because Zoey is lazy and doesn't do anything. So it zoey'd, but that means not doing anything

[@benjaminholt331]

Try changing your key bindings and see if that works. If not, maybe blow into the cartridge.

[@AuxenceF]

alt + f4 to launch a diagnosis

[@RAFMnBgaming]

Huh. Swear that did something to youtube.

[@justintack5205]

My favorite implementation of diagetic UI was in Dead Space. It was useful and believable without being distracting.

[@flyingsquirrel1135]

I will say that the Pip-Boy is my favorite UI, lore immersive, easy to navigate, and useful in SO MANY ways.

[@RaspK]

Fun fact for those interested in the linguistics behind the words in use: "diegetic" means something akin to "narrative" (adj.), from Ancient Greek διήγησις, which means "narrative (n.)/narration" from its literal breakdown "guiding through" (διά + άγειν); and the word is used to refer to any narrative device which is part of the narrative's setting itself. The example I commonly use to explain this is when all music played during a movie is actually produced by somebody playing said music (e.g. by playing an instrument or a record on a playback device or by singing). I am glad the video used it as well, because it's very easy to imagine. This is contrasted to "exegetic" elements, which are part of the narrative from the narrator's, or even the audience's, perspective, rather than the setting in itself; the root here is the related word εξήγησις, which means "explanation" from its literal breakdown "guiding out of" (εξ + άγειν).

[@RingtailCafe]

I always thought Borderlands did a clever job of hanging a lantern on this; your character is given a literal HUD by one of the characters as the first thing that happens in game.

[@CPPpotkustartti]

Only game, as i remember, i played that hid UI was Trespasser (Jurassic Park) game, where your Health was shown as Tattoo on characters breast as Heart, so you had to look down to know how much health you had (3 hits could kill you and you regained health slowly) and ammo situation was only told when character either picked gun or when you shot with said gun. "Feels full." "Three shots." "Around eight." "Last shot."

[@Lightning-ig2do]

I remember some of the Ratchet and Clank games showed enemy health by how much armor was remaining on the enemy. It worked well because your focus was always on the enemy, and it let you know when he was close to being defeated contextually, without throwing numbers at you.

[@_-KR-_]

I think Metroid Prime should be the .. uh... prime example of diagetic UI done right. Borderlands sits on the border between clunky and immersive.

[@RAFMnBgaming]

Have a pun cookie son.

[@larutmrs3313]

I see whachudid there

[@GabrielDalposso]

You just summed up my 90 page graduation paper into a 8min video. Congrats you guys haha

[@GabrielShitposting]

In deus ex the hud is quite literally what the protagonist sees as a measure of his current health and such Seeing the world through the protagonist's eyes, is nice

[@asgrahim9164]

Yeah, it is one of my favourite UIs.

[@Mordalon]

Both Nier games have one of my favorite examples of Meta UI. In Automata, your UI both in game and in the menus are actually the OS of the Androids, and UI elements like health, xp, and the map are "program chips" you can actually remove to make room in your robot body for more combat upgrades.

[@Uriel238]

One of my favorite diegetic UIs was the literal HUD inside the helmet of 1138 in _Star Wars: Republic Commando._ On the flip side, a diegetic combat UI is had and described in Neil Stephenson's _Snow Crash_ as part of Hiro's transformation into (cybernetic) gargoyle, in which is monitors present his injuries in way-too-much detail.

[@LudicGamer]

My favorite example of Diegetic UI is from Life Is Strange: Before the Storm. In the game, you don't have a quest marker. However, if you lose track of where you were, got distracted looking for secrets, or just had to put the game down for a while, you can see your current objective by looking at your character's palm. Chloe, the main character, always has a marker on her and always writes the player's current objective on her hand. It's a very small element, but I think the habit of handwriting stuff on one's own palm in an awkward felt-tip marker scrawl is a really cute, humanizing detail and really helps prevent moments where you have to dig through non-diegetic UI to remember what quest you were supposed to be doing.

[@JoaoNascimento-uq8yg]

The metro series is the best at UI because you can choose how much UI you want and the UI you do have is perfect for the tone of the game

[@Volvagia1927]

Another example of meta UI is the Lakitu Reporter in Super Mario 64.

[@AmandaDavis6130]

I've always enjoyed how Astroneer did its UI. It has a power and oxygen indicators on your backpack, much like Dead Space (but stylized cuter like the rest of the game). Similar elements appeared on machines, showing you how much power they had, where it was flowing, how far along the research machine was, etc. When you open more complicated menus, it enlarges them so you see them clearly, but they're styled like an object your character is looking at. Rather than a map with waypoints, you place beacons in the world that you can see from a distance. And it also features the "screen turns red at the edges when you're hurt" meta. It all flows together pretty well, and I hadn't even thought about all the bits and pieces until this video. Neat stuff!

[@PaulGaither]

The Fallout Pipboy is a great example of it being used perfectly. I play with the hud setting at 0, which does more than increace its transparency. When set to zero in FO3 and New Vegas, you do not get XP notification sounds, quest sounds and so forth when such things would have popped up on the screen. If/when you set the HUD to 1 or more, you then get an update of all the XP you got since you last saw your HUD. I play Oblivion, Skyrim, and Fallout all without the HUD, as it makes it more immersive. I love the in-game music so much though, that I switch back and forth depending on the mood. Sometimes I want that bairn wasteland feel, while other times I gotta hear that soundtrack goodness.

[@AshenVictor]

I don't really agree. The frame of the Pip Boy takes up so much of the screen real estate and Bethesda's menus are always catastrophically poorly arranged on top of now being too small that it makes it much fiddlier to deal with than it needed to be.

[@perdiendomitiempo6403]

Me after coming out of my classes of on-screen interfaces and now seeing this: Ah sh*t, here we go again

[@joearnold6881]

Now explain why it’s impossible to agree on where to put the subtitles option in games.

[@stm7810]

accessability menu before the game starts, same as all other such things, at least for respectable games.

[@DawnPaladin]

Lovely animation this episode. Great work, Elisa!

[@Ziziwai]

The video glitched and paused during the meta UI explanation when it zoomed out to show the TV, and I just thought it was a whole meta joke and just sat there, staring, until I realized

[@Queekusme]

And then you have VR, where Diegetic and special UI are the only options

[@bm1747]

Surprised this wasn't discussed, though it is basically an entirely separate video. A good example is the difference in how the PipBoy is handled in Fallout VR vs pancake and how different headsets (text way more clear on Index) affects the settings a player will choose for that.

[@fernandobanda5734]

Isn't there any VR game with a HUD stuck to the display?

[@coyoteseattle]

@Fernando Banda Sure, there are some. And there are even tools to make your own HUD overlays on top of whatever VR stuff you're doing; for example, I've usually got a combined Discord/Slack/PagerDuty window across the bottom of my vision, when I"m playing. But you have to do a lot more actual design for those; since the VR display fills (effectively) the entirety of the field of vision, a traditional FPS HUD where it's a border around the screen with informational bits on it would either be basically unreadable during normal play, or would obscure notable parts of the playfield, in ways more detrimental than on a screen. If one isn't careful, they can also be headache inducing, because they can mess with a player's ability to focus their vision on the game world. Conveying the same information through things like UI elements either attached to the controllers or independently present in-world, sound, and shader effects is often the easier solution. Especially since most VR games at the moment either aren't intensely action oriented, or are fixed perspective; you don't need to constantly see a health or ammo count in an adventure/puzzle game like Obduction, for example, and don't need the UI elements attached to your vision when you're almost always looking down a gun in a shooter like Space Pirate Trainer.

[@GeFlixes]

@@fernandobanda5734 The ones I know of display the HUD as such that it's believable it's an diagetic element - part of an helmet mounted display in-game etc.

[@sharcc2511]

spacial UI, not special UI.

[@Somethingbloody]

I love it when games have a lot of HUD/UI customisation. Assassin's Creed (4, particularly) and Dishonored 2 had a lot of options for what you wanted to see. It was a good way of giving the player control of both the level of difficulty and immersion. AC was so easy once you were comfortable with it it was a nice little extra challenge to get rid of the UI, and the audio prompts (and a slight blur effect when being spotted) actually gave you a lot of the info you needed anyway. AC4 also had a button you could press to hide/show UI.

[@tutterbear98]

I love diegetic elements/UI choices. From the entire meta settings scene in Nier Automata and the presence of the menus and stats as just robots being robots to Hellblade just not having any and having you rely on Senua's (often self deprecating) voices for everything, just like she does. When that part of a game is done well, it's probably all I can think about for ages while playing it, I love thinking about that part of game design. That's also why I really like watching DesignDoc, his thoughts on UI are very interesting.

[@TheAnon03]

More important than any of that is making best use of screen space. Anyone remember the travesty of the unmoded Skyrim menu's on PC?

[@vizthex]

I personally love Astroneer's diegetic UI, and I can't imagine the game without out. That's really the only example I know of, but if done right it can be a really cool system.

[@emerz3530]

A strange example of meta UI is borderlands seeing as how you are given a heads-up display by a CL4P-TP steward bot (or Claptrap.)

[@rashkavar]

First piece of diagetic UI that I remember seeing: Goldeneye's pause menu was Bond looking at his fancy watch. Hey, it shoots lasers that cut through armour plating, sure it can have menu options. It also hid health there except when you were actually taking damage, which meant its UI was limited to a pair of numbers in the corner indicating weapon ammo, and an icon between them denoting what kind of ammo it uses. Pick up the Moonraker laser with its infinite ammo and that went away too. Surprisingly good job of keeping UI super minimalistic for a game that came out that early.

[@couriersix4252]

I like the pip-boy system

[@MadMac5]

Elite: Dangerous does diagetic UI extremely well. Aside from the Galaxy and System maps that switch you to a separate screen, the rest of your menus are projected inside the cockpit. Damage to the cockpit canopy keeps you from seeing parts that are projected onto it, and you can activate the navigation and ship systems panels by looking at them with mouse-look or head tracking. It's incredibly good in VR, since it means you don't need as many buttons bound to a joystick or controller to activate UI elements; all you need to do is look at the part of your ship where that control panel is in virtual space.

[@Ohem1]

Diegetic, I have learned a new word. Great to see types of UI mentioned, I didn't know how to describe to others what to call Diegetic without a/the term, so it made the point I was trying forward hard to convey.

[@wusashicat1]

I'm shocked there is no mention of the wonderful UI for Metro Exodus

[@PlebNC]

I agree. Makes very good use of diegetic UI although it did relinquish that practice in a couple of places like the 2 quick select wheels and the non-diegetic ammo counters, which the latter can be a point of frustration if mid-fight you want to know how many shotgun shells you have and you want to know quickly without reading the diegetics of the gun model and can't figure out how to make the non-diegetic ammo counter fade back onto the screen. Similarly because each gun expresses how much ammo is left differently the player has to relearn what different things on the gun mean, e.g. the only way (that I can remember) to tell how many shots you've fired of the double-barrelled shotgun is to just remember if you shot it recently while figuring out the ammo left in the SMG with the horizontal skeleton magazine (technically a clip?) is as simple as looking at the ammo still in the magazine.

[@christopherverhoef9112]

I think the map is my favorite part: a diegetic object (your objectives are physically scribbled on the back of the map!) with spatial icons. So sleek.

[@zockertwins]

The Metro games have always been good with their UI

[@stormxlr2377]

@@christopherverhoef9112 I loved the lighter! It's so nifty how he pulls out a lighter :D

[@Byefriendo]

I fucking LOVE metro exodus, the UI is just icing on the radioactive cake at that point lol

[@ErikHolten]

The first first-person game I played with a diegetic UI was the 1996 adventure game *Azrael's Tear* where you played as a futuristic relic thief (a "Raptor") wearing a MS-2 helmet providing AR-like HUD features and AI-enhanced interpretation of the environs, complete with speech recognition dialog logging. It held my record as one of the most truly immersive games I had played, until Thief: The Dark Project.

[@GeFlixes]

I like contextual UI elements the most - health bar showing when you're damaged (Skyrim), ammunition showing when reloading (Insurgency: Sandstorm, where there's a "Hold R to check ammo" feature), advisors and supplementary information popping up when they're needed (Civilisation).

[@Kindrick]

In a game I'm designing, you only start out with 2 UI elements, a HUD display of your character along with adjectives to display how/what your character is feeling, such as pain, to indicate possible injury or affliction, and a meta UI to indicate which direction an attack is coming from when it lands a hit on you. The next UI element introduced to you would likely be introduced the first time you interact with a container, giving you a simple and straight-forward inventory display, but only when interacting with containers, even your character's own pockets. Additional UI elements beyond this would require magical, biological, or technological upgrades to your character, or have them be some form of diegetic UI, such as a map drawn by you or another player, the glow of runes on a magic item, or an LCD on a device. For new players, the lack of information the game provides is either part of the challenge, or motivates the new player to socialize with seasoned players to get info they need. A character that picked up medical skills, for example, could tell you that your character's excruciating pain in their arm is a bone fracture, because of their additional UI elements, and apply medical attention as necessary, but if the broken arm was so bad that it'd be apparent to even a layman, then it'd be visible on your character model, allowing you to see it on your default UI.

[@tenchumatt]

I love it when the UI fades in and out of the screen when its needed or not needed. A great mod for the Witcher 3 called "friendly HUD" gives you so many options for what is constantly displayed, fades in and out like the health bar fades in during combat but then fades out once your health is full again, the mini map can be made to show up when you use Witcher vision and the mod adds in world markers that can show up on screen so you don't even have to use the mini map and even those can be set to fade in and out with Witcher vision. That's the answer, give the player choice for what is and isn't shown and and how long its on the screen for or when it shows up.

[@PrezWashinguns]

I liked how oblivion styled the inventory and journal like a book. It wasn't trying too hard, but it was enough to be memorable on its own.

[@oneofmanyjames-es1643]

I really liked how Star Wars Commando did their diegetic UI, where all the information is integrated into the HUD's helmet or on the gun. It achieved both the 'immersion' goal, as it seemed like you were genuinely looking through the helmet, whilst also displaying all the information the player needs in a traditional format.

[@JamesPetts]

Flight simulators are perhaps a paradigm example of diegenic U. I..

[@CrimsonBlasphemy]

This speaks to a design philosophy I've been kicking around. A 3 layer philosophy: Core, Guided, Explore. Everyone wants to make an immersive "Exploration" experience, where the players "live" your game, but regularly this gets in the way for many players. Which is why it is important to design at all three levels. If you neglect any of the layers, or make it difficult or impossible to transition between, more often than not the players WILL notice and COMPLAIN. I will point to Cyan's Myst (1993). At the time the height of exploratory game play.... It had fast travel, a lighting bolt Screen Space icon that if you clicked in the correct part of the screen, would instantly move you to a spot that Cyan thought was CORE to the game/story. Accessible once the player had walk through the space at least one time. There are some modern "walking simulators" that seem to have forgotten this. Many games also struggle with the Guided layer. Some do it too strong, some too weak. And the most horrendous example is the "Find the Thing" in the world space. Where either there is too much direction and the task is trivialized to a Core experience, or it's too hard and the players are forced to try mind reading the developers.

[@XLegiitBadassX]

The HUD in Halo is technically both diagetic and not. For Spartans, their HUD, canonically, is an actual part of their helmet, as they need to see their motion tracker, ammo, and shield systems. However, in the case of most Elites, like the Arbiter, they don't have helmets, and thus no HUD's in universe. EDIT: Also when you go third person, for whatever reason, its obviously not diagetic for the same reason as Link's 3rd person.

[@TheWizel]

You could handwave their UIs as cybernetic, nanomachines, or biological-modifications since they are hyperadvanced aliens, especially since Elites are a soldier caste so giving them all advanced body mods is both within lore-possibility and logical

[@takatamiyagawa5688]

@@TheWizel Pretty sure the Elites don't have any such bio-modifications, to contrast them with Spartans, who do.

[@michaelramon2411]

Ghost Recon Future Soldier probably overdid it with its system of having everything be in-universe AR holograms that the characters see (do these elite special forces REALLY need a big sign in the air reminding them what country they are in?), but it contributed to the game's greatest level, where enemy technicians are slowly jamming the character's systems. For much of the level you just get random glitches (including staticky text and enemy alerts that aren't actually there), which adds well to the level's tension. Then, at the climax, the system goes down completely as the protagonists encounter a massive ambush, and the player has to fight at a serious disadvantage as their UI is gone, which gives a good sense of the desperation the characters are feeling.

[@rjstuller1]

The moment i saw the title for the video i started chanting: Dead space, Dead space, DEAD SPACE!!!

[@dekisatria1233]

Exactly

[@wadebreeze1721]

The best example for diegetic UI that I've come across was in Spyro, where they had the the support character that followed you around and help pick up items change his color to show how many hits you could take. Always on screen but not distracting while filling multiple roles.

[@luliby2309]

Someone (Ryan King) mentioned that Halo's HUD and UI makes so much sense because you're looking through the Chief's helmet. This is also why Metroid Prime is so good and works so well. You're looking through Samus' helmet as well. That's also why turning Metroid from 2D to 3D is such a good idea. Being in Samus' suit and looking through her helmet is just plain cool.

[@franciscomm7675]

1:25 zoey listening to music. Cute

[@garrettv.2632]

Titanfall 2’s campaign had a neat mechanic, if I remember correctly, where you only had a ui after you got the pilot helmet

[@PikaLink91]

I am really glad Alone in the Dark was mentioned, I liked the "jacket as inventory"- thing, it was a clever idea and gave you a realistic idea of why you could only hold so many of x-item. My only two gripes were that it could be a bit iffy to navigate, and it was in real time. I know, time doesn't slow down for me either when I open my jacket.

[@alexanderrowley9870]

One of the coolest diagetic UI systems I've seen was in The Getaway: Black Monday. A third-person game where characters would become bloody to display health, you aimed guns by hovering the front sight over enemies, and when driving the game would tell you where to go by flashing the indicators (turn signals) on the car. Bit clunky, especially as it was a PS2 game, and the stealth missions were horrible, but man was it cool :)

[@Lugmillord]

I always have a glowing exclamation mark over my head when I go outside.

[@greekmyths8804]

Who doesnt?

[@subtlewhatssubtle]

I think one of the best diegetic UIs out there was in Republic Commando. Everything was cast as functions of your clone commando's helmet. Everything was conveniently indexed on the screen because that was just how your helmet was set up by your clone creators.

[@Axer022]

Really fun art in this episode (that also clearly shows and explains what Matt's talking about), props to Alisa.

[@justingreenland50]

This has been very handy for helping me find the direction of a project of mine, thanks EC :)

[@eduardobarreto5555]

Lately the trend has been minimalistic UI and I have been loving it. It has all of the information without the distractions.

[@hatuhsawl]

I remember the tie-in game for the Jack Black King Kong movie didn't have a HUD, and the diegetic way to know how much ammo you had left was to click and a button and your character would say out loud "x bullets left" which worked most of the time except when you're sneaking past dinos and it felt weird to be sitting in a bush and yelling "A COUPLE BULLETS LEFT"

[@kitchenjail3546]

Metro (1) did a great job with diegetic UI, and is definitely an example of that done right.

[@richardeldridge8371]

I am reminded of another good example of Diegetic UI in the Ghostbusters game (the good one you all know which one that is) where a lot of the important information is displayed on the proton pack which, much like Dead Space, is always visible to the player via the over the shoulder camera. Things like health, overheating, and what type of beam you are using and wither or not you are venting are key details to keep in mind. Heck you can even tell if you deployed your trap or not by seeing if it is strapped to your waist on the character. IMO probably one of the better examples of Diegetic UI being used to improve the game rather then mar it.

[@brandonraglow7713]

Can’t believe Metroid prime wasn’t mentioned

[@adamharris306]

Came to say the same thing

[@Fjuron]

Well said! Because in the end, good UI should be so intuitive and easily understandable, that it is practically invisible to the conscious mind. If conventional non-diegetic UI does this, then it allows for flow and immersion and thus for great gaming experiences. So it is more important, that the quality of the UI is good, rather than that it is diegetic. No diegetic UI needed.

[@BusinessWolfRay]

It's interesting to hear this discussed, because in the teasers for Cyberpunk 2077, the way they handle it is pretty ingenious. You don't see any of the UI or HUD until your character goes to get their cyberware altered. Once they have this procedure, you can then see the enhancements they're seeing, which take the forms of the UI and HUD we're used to. A really clever way to make it part of the world and the story, in my opinion.

[@Me2893me]

One thing that you alluded to or made a side note of but I think is also really important to consider is what type of UI thematically makes sense for a game. For instance, Senua's Sacrifice has a really diagetic and meta UI because that pushes the narrative and empathetic nature of the game. Spending time to make such a diagetic UI in Doom in contrast would make very little sense as the goal of the game is to kill demons and an explicit HUD and UI only helps achieve that goal.

[@seancornish7378]

Love these more practical videos btw. High concept stuff is nice but the more tips I get the better :)

[@AsbestosMuffins]

I really liked the way deadspace did the UI, issac's healthbar was always visible on his back, or menus would be holograms projected in front of him, while the players see it from his shouder

[@MysteryCorgi_VN]

I was ridiculously happy to see the nod to .hack with the character that looks like a wavemaster. I love Tsukasa and Elk so that was thrilling to an old .hacker like me.

[@occamsbeatinstick.3076]

Saw that Enter the Gungeon icon snuck into all those UI elements.... Clever, clever....

[@sarysa]

I can't be the only one to think of the Mooninites immediately after seeing 5:38...

[@pauladriaanse]

1:06 aww such a cute animation ;3

[@mutimateco]

Even if hated zombieU had an amazing way to check your inventory, literally looking down at the gamepad and back up to check if zombies are near you.

[@carloscaro9121]

I feel like vehicles make a diegetic UA feel very natural, as we control the vehicle through a sort of HUD anyway. We're also much more willing to accept a first person diegetic UI that looks like a reasonable use of augmented reality rather than something stuck in for the player.

[@estherfelicies7846]

Will have this in mind when creating my demo

[@Nonsanity]

I was the programmer behind Fallout 3’s UI, among other, earlier Bethesda games. That game, obviously, was a mix of diegetic and non-diegetic elements-all of which was thought up and laid out long before any code was written. Certain elements, like the monochromatic color scheme, were set in stone from the start and resisted any attempts (“SOME color, please?”) at change. And there’s always pressure to add pizazz at the expense of functionality, such as adding CRT glitches, scan lines, and artifacts through shaders to what was originally coded as a clean and clear interface. Losing half the screen real estate to a diegetic picture frame probably isn’t the best choice when trying to make a good UI. A good UI should be invisible-you don’t have to completely hide it, but don’t drown vital information with brass bands and gimmicky gewgaws either.

[@warmachineuk]

I liked Dead Space's design because it worked with its survival horror theme. Accessing in-game inventory didn't suspend time to let you manage resources. You could still be attacked whilst using it, so you had to find a safe place to use it and still listen for monster screams.

[@the1doctorwhat]

Metroid prime and Nier Automata are my favorite examples of UI

[@sonictimm]

Metroid Prime UI is nothing short of a blast to use.

[@MorbidSlinky]

I’m a big fan of how immersive Metro 2033 is. It impressed me how seamlessly the devs presented information to player such as their visibility as indicated by a small blue light on the character’s watch to their weapon’s present ammo count by designing weapons so their ammunition is clearly visible. The design of the Bastard Gun and Shotgun best exemplify this doctrine.

[@KuraIthys]

On an unrelated note, UI in VR is an interesting and complex topic... A lot of Diegetic and in-world UI tends to show up because traditional 2d UI just doesn't work. Even something like a 2d loading screen tends to get implemented in VR (largely for the sake of preventing nausea I might add) as a 2d UI on a display that exists in 3d space. For a loading screen typically the 3d space in question is a black (or uniformly coloured) void, and the 'screen' is literally just a 2d plane floating in space. But it's still interesting that this turns out to be necessary in VR. Of course, a bunch of things become possible and fairly natural to do in VR thanks to the standard hardware setup including head tracking and 6-DOF hand tracking. One example is setting your more conventional UI up as say, a wristwatch, or a handheld device that you can pull from some arbitrary location on your body. (both visible locations and invisible ones are valid options) For that matter, we also end up with conventions about dealing with Inventory screens, and items. Inventory tends to have to either have a 2d UI on some in-world device, or something like say a magic room or a rug that appears arbitrarily in the world with your stuff on it. For quick item changes, you can also again resort to placing objects in arbitrary places relative to the player's body. This feels natural, because it's what we do in the real world, and the motions are almost the same. As long as you fudge it a little in terms of the precision required, it works out OK, usually. Pulling a gun from behind your back just feels right, even though to get it working is a contrivance and requires several unrealistic things to happen... Hammerspace FTW. XD

[@talos111]

I haven’t tried Exodus, but Metro 2033 and Last Light uses a nice combination. The crosshairs, ammo count, and the bit of inventory is standard non-diegetic, but a lot of the other stuff is diegetic. Your objectives are on a clipboard, you have a watch that displays whether or not you’re in darkness, the real world time (or if you have a gas mask on, how much time on the filter), the flame and smoke of your lighter points the way, and the pneumatic weapon has a gauge showing air pressure.

[@Lottar]

Best art ever! Also great ep, thanks!

[@angeldude101]

Games that mate a non-diagetic UI element, and then _force_ it into the game world are always fun. Examples include Deadpool (of course), as well as Kirby Triple Deluxe where Kirby goes so far as to eat the entire health bar of a couple bosses. It's not _entirely_ diagetic, because it's still usually a 2D object, but it still manages to interact with the 3D game world. Though you could just argue that this just counts as breaking the fourth wall rather than a true part of UI design.

[@therealbahamut]

I think the main thing that keeps diegetic (thank you for giving me this word) UI from being accepted is delay. When you press a button and your inventory pops up, you don't even blink; you're just off doing your thing. When you press a button and a jacket opens up while some guy says something EVERY TIME, you get annoyed by the holdup. It's a speedbump and it breaks your flow. If you're going to put in diegetic elements, STREAMLINE THEM. Make them take almost no longer to navigate (if at all) than the equivalent UI element would or they quickly become an irritant.

[@Casual_Shots]

The art was awesome in this episode

[@SpectralTime]

I just want to open by saying the sound mixing here is *on point*. And getting an actual UI designer as guest artist for this episode was inspired. I can practically feel her expertise.

[@Artista_Frustrado]

I love the example of Dead Space's Health suit because there is a game that did it badly: Vanquish, Sam being a platinum games character meant he moved at high speed all over the screen making really had to see the tiny lights on his suit indicating he's one hit from dying