XaiJu
americanmcgee
americanmcgee

patreon


Asylum UI & UX

Dear Insane Children, 

Today we're taking a look at the User Interface and User Experience for Asylum. Want to take a quick refresher on the concepts of UI/UX? Check out THIS LINK

Alex says of what's presented here: 

 The whole idea is: Smooth, seamless transition between gameplay and item management. Keep the player in the action.

My thought process was to look at this as more of a "whole experience", as rendering small parts of UI / UX at this stage might be fruitless until we establish the foundation of gameplay mechanics.

As such, here is a gameplay and control set mockup, which is a starting point, and can be thrashed about.

And a couple of quick notes on what we're sharing here before you jump into the comments... 

First, PlayStation controls are chosen for no particular reason. This DOES NOT indicate a preference for PlayStation nor indicate any plans in terms of any platform. I've said many times before: We'll try to deliver Asylum on as many platforms as makes sense. PlayStation, Xbox, Nintendo (ButtJack), PC, etc. This is NOT the thread to discuss platforms. Save it for later, please. 

Second, this is all Work In Progress. Nothing is set in stone - not the controls, not the weapons presented, NOTHING. We're here to start a conversation, discuss options, and work towards penciling in our initial hopes and ideals. 

Third, lets keep it positive and constructive. Don't like something? Explain why in a way we can apply towards improving towards something you would prefer. 

With that out of the way...

Alex shares a series of design pages starting with Controls (first image, up top). 

Font Lord noticed an issue contained in here straight away...

 If the game is still live (even if it goes into slow motion) when the selection wheel appears, you can't make the wheel appear with a d-pad press, as this will take your thumb away from the left thumb stick. Games usually use a trigger for this function. 

Up next, Alex shares a weapon select system he says is "inspired by DOOM (2016)" - there are worse places for us to draw inspiration.  

He next presents an overview of controls for Alice's Modular Dresses - a topic we've covered quite a lot in previous Crowd Design discussions. 

We then have the game's HUD and Pause Menu concepts presented...

Lastly is Alex's idea for Inventory / Map / Etc... 

Of this concept there's a group consensus that such an animation, played every time we hit the trigger button, would quickly drive everyone crazy. The first time we see it... "hey, that's cool" The 100th time we see it... perhaps a little less cool. 

There you have it! The foundation for a lot of discussion and decision making! 

Let us know in the comments below what you think!

Crowd Design Session

We should have held a Crowd Design session this morning but I canceled it due to allergies and migraines. Don't know I can do much to solve the allergies problem but the migraines... I went to the eye doctor this morning and discovered that they were likely a result of my glasses being the wrong prescription! Now that that's (hopefully) solved... 

We have a lot of material here for next week's design discussion. I'd like to combine this together with the weapon design material shared yesterday. That should fill out one or two sessions (at least). 

So if you're an avid gamer with opinions on controls, interface, UI, UX... take a serious look at yesterday's and today's posts on these topics. Share your thoughts in the comments below and make note of things you'd really like to discuss during the next Crowd Design Session. 

Look forward to hashing all this out with you!

From Shanghai with Sniffles and Sneezes, 

-American

Asylum UI & UX

Comments

Every looks awesome! I know nothing is set in stone, but I'm really digging the look. I have no complaints, you guys know what you're doing.

No complaints here so far, I like the look and idea for the selection screens and menus. The zooming to her eye was also a nice touch. I think really brief couple second motions like that wouldn't be bad so long ago they weren't really long drawn out animations.

I really like the Chaos Wheel. It would be cool the camera focused on Alice in a haze but keep the current level background when you bring up the wheel. That way you don't have a totally repetitive image when bringing up the wheel. Just kind of slow motion the background so it feels like the game is still moving. I like the HUD design and the pause screen with this kind of stuff I am a fan of keeping things simple and clean.

I agree with this currently, but keep in mind that the PlayStation is the only console with this feature. Consistency among all platforms is key. Also when this game is ready for release we will be onto next generation systems. This may not even be a feature in next gen consoles. If it is, having a few unique features per platform ability would be cool...but more work for developers.

Conceptually I like the weapons outlined here, though I understand they are not final. I think including an array of the weapons from a couple of days ago would be great, but I like that the weapons described here seem to all 'belong' in Alice's world, either from the Wonderland of literature or the 19th Century England/psychiatry. SUGGESTION: I also think the idea of linking buffs to different skulls in the dress makes sense though there might be room for both approaches: perhaps each skull could have different coloured gems in its eyes. There might also be a different 'effect' for each skull, like eyes that glow and leave streaks on the screen like the hobby horse's eyes in AMR, or like a sparkly haze for a different skull or whatever which might also be linked to what the relevant buff does. I assume that the double jump buff would allow additional double jump (larger jumps or a third jump?). I'd be disappointed if you could only double-jump when that buff is selected; it feels too much like a basic game mechanic so I think I'd always have it attached and never get to use actual buffs :) SUGGESTION: I like the weapons wheel concept though if the goal is to be able to keep continuous gameplay it might make more sense to put the circle a little more off to the side (as much as possible while still making the weapon options reasonably easy to discern). Given that Alice is also dead centre of the screen, if you're trying to change weapons in the middle of a fight with projectiles and things heading your way it might be hard to tell if you're about to get hit (I'm assuming the game doesn't pause while in this menu). Just a thought. SUGGESTION: I LOVE everything about the idea of the animation and really hope I get to see it as part of the game. Personally my recommendation is you might associate the animation described with say a costume or skull buff change. It would only play the first time you try on an outfit and settings would exist somewhere to disable showing the animation again subsequently, but with the option to re-enable the animation to play every time if you prefer. I must say that while I'm in the thick of the game I may not want to be seeing the animation EVERY time as you said, though with a lot of the stuff you produce, which is absolutely gorgeous, I like having the option of seeing it when I feel like it. For example I used to love triggering the final level combo of the hobby horse in AMR just so that I could see that hang time in middair and hearing the horse whinny before the final strike and the lightning style strike on the floor. That's just awesome! I think having a toggle somewhere (and default having the setting disabled for those who can't/don't want to have to find it in settings) is a valuable option.

I like the weapon wheel, ti would be cool if you decide to have a lot of weapons in the game :)

Definitely not Adam Driver

I feel the TouchPad is underutilized in most games. One game has the left side of the pad pressed for a certain action/menu and the right side of the pad for a different action/map or whatever. A recent game I played let's you Swipe the pad up for collectables right for map down for inventory and left for story/missions. It's not a huge deal. I just feel for how interactive the TouchPad can be, it almost never gets used except for a big button

Forgot to add that putting this entire system into a "Click R3 Joystick" modifier would allow a player to move Alice in-game while navigating this cloudy weapon space overlay with their right thumb. with this option, a 2nd click of R3 selects the weapon. This would of course free up all 4/8 dpad inputs for other functions, at the cost of replacing your R3=camera controls idea.

Connor Sol

One very important thing which was nice in Madness Returns and helped a lot to sustain atmosphere - whole user interface should be "gone" if there wasn't any changes in values like health, ammo (?), no combat for while etc.

Daniel Woda

My suggestion on the topic of weapon wheel / weapon selection alternatives: Player Experience Flow Pitch: - Player is mid-combat, wants to change weapon. Presses any D-pad button. - A translucent, dark "brain fog" immediately fades into view as a gameplay overlay accompanied by a time-slowing of the game. It is dark with depth in its appearance and about 50% transparency toward its center. It is wispy and 80‰-95% transparent toward the "cloudy edges". The fog cloud overlay element takes up about 65% of the screen space. This dark translucent fog is a representation of Alice thinking about which weapon to switch to. - In the fog space, a 3D model of each weapon in high detail exists. - The weapons are laid out in a directional hierarchy. In other words, if there can be 4 categories of weapons (most ideal), each category of weapon would be laid out upward, leftward, downward and rightward of the center of the fog space. Otherwise, 8 different directions could be used but this defeats the purpose of what I'm trying to accomplish in terms of usability and flow. See below - If 4 different (UDLR) categories of weapon exist in the fog space (I.e. "sharp, blunt, ranged, specialty" or "meant for enemy types 1, 2, 3, 4" or whatever), then weapon selection goes as follows: - The center of the fog space moves in the direction of the D Pad held by player on an accelerating response curve, OR: a cursor or crosshair within the fog space responds to said D pad input. (less ideal, as scrolling through this space is still needed) - Player is holding "D Pad UP" because they think they remember the weapon they want is above the vorpal blade on this 4-direction layout of weapons that is 2 "levels deep" - The fog space scrolls to the vorpal blade and, within a 0.5 second delay, scrolls upwards, past it, to the weapon above it. Both of them are partly visible in this fog space at any given time, as are the neighboring weapons to the left and right (of course they're more transparent since they're at the edge of the translucent fog overlay) - The purpose of this system is to give space to the 4 main d-pad directions of weapon selection, and to eliminate that 8-direction "overwhelm" that never allows a player to remember (in a pinch) which direction means anything which makes traditional weapon wheels a crap shoot. With this system, there's a memorable sortijg logic used for up, down, left or right, and so if the player is seeking a certain type of weapon, (in this case, a slashing weapon similar to the vorpal blade) they're pressing the direction of the type of weapon and will quickly become conditioned to memorize (even in the heat of combat) which direction will navigate the fog space toward the TYPE of weapon they want. From there, it's just a matter of sorting out the 4 most common weapons of the 4 different categories. Those are placed on the inside of this "fog space weapon grid" while the more specialty and less-frequently used weapons are placed on the "outer ring" of the fog space weapon grid, at an angle. (wish I could sketch it) - Anyway, let's say the player actually is navigating the wrong direction in this fog space for the weapon they wanted, they would see the slightest edges of the nearest 3 weapons on the translucent edges of this fog space overlay. If the one they wanted was actually to the left, they'd simply then move at a diagonal/to the left to scroll the fog space over to it, then let go to select and switch to it. If the weapon they wanted was completely the other direction (extremely unlikely), they'd push the D Pad buttons to navigate the space. After 1.0 seconds of navigating this fog space directionally, the accelerative response curve would be at its full scrolling rate, so this wouldn't take more than another 0.5 seconds for most players to find the weapon in this fog space that they may have initially missed. But again, this systems entire purpose is to mitigate that issue of a player not being able to recall which direction a weapon is. - Another advantage of this is that you can easily add more than 8 weapons or selectable items. They'd just be further out along this fog space, however any more than "2 outward rings of 4" and it's just getting too complex. - This method also allows for up-close detail of each weapon while browsing instead of relying on UI icons to represent each weapon, which feels more gamey and less immersive. - This method adds to your "inside Alice's mind" theme in that this system represents the literal process of Alice browsing her foggy, neurotic thoughts for which weapon by imagining what each of them look like verbatim and in detail before selecting one. - Of course, once the player lets go of the Dpad wheel, the 'centered' weapon in the fog space is selected. Optionally, have a background highlight activate behind the currently selected weapon to visually represent its activation, and optionally add a 0.5 second "stick" to each weapon scrolled to in the fog space before scrolling will continue. Furthermore, optionally add a "cancelation ring" at the furthest reaches of this fog (or the very center of it) so a player can just say "nevermind" for the scenarios where they didn't want to change their weapon after all.

Connor Sol

Honestly I loved the weapon select in DOOM 2016..... so yay :)

A lot to unpack here. On a first glance, repeated zoom-ins no matter how quick whenever a player opens the menu would becoming grating very quickly...perhaps just the first time its used in the tutorial and then never used again. As for the slow motion weapon selector, it's probably user error, but every time I find myself facing a slow motion weapon wheel, I forget where my weapons are for a moment which is just enough time to get a projectile to the face...perhaps just pausing the game on the wheel is fine, though it actually leads into a gameplay question: a slow motion weapon wheel adds a small level of challenge to the game beyond a full pause, and does that fit with the direction of the game?

I like the style of control so I might as well throw something in. Given we have a ADS feature for firearms and a First person mode we could have a feature for First person view with firearms. This caters to people who enjoy FPS games bringing a larger audience to the game without making it fps dependent. This brings a variety of play style to the game switching from 3rd person to first in different situations which has proven to work really well in games like fallout and elder scrolls. Having the POV mode functional as a ranged weapon feature with ADS for better accuracy adds a ton more depth to the game and a wider audience will take more liking to it with its varied playstyles you can seamlessly switch between that's beneficial to different scenarios.

I like the look of the weapon selection and how the UI will work, never played Doom but I have used similar to this,i found the selection on HZD really easy to use but then you only have 4 active weapons not all of them. Looks like a good work in progress. I agree about the animation on hitting the trigger button, it would really start to grate on my nerves at the very least. Could you maybe do it on the 1st trigger per playing session (no idea how hard that would be code wise so apologies if thats one of those "oh simply do this" and takes a year of code) or maybe just once the first time in the game as kind of a tutorial?

For the menu animation, it might be useful to have a double click/press of the activating button skipping the animation, to eliminate the issue of having to watch it every time.

Daniel Linsley

I agree- though I mostly play PC I’ve still had moments like this. One possible solution would be that the selection wouldn’t be confirmed until release of the d-pad button, with a slight delay before the game actually resumes to allow resetting of the stick. Potential additional solution is to have that menu activation temporarily lock the aim? Could be combined with the aforementioned slight delay to resuming gameplay.

Daniel Linsley

Excited to see what's discussed. This is out of my wheelhouse though. Let me know when we go back to discussing aesthetics, emotions, trauma, and prop/costuming elements ^-^

Sarah Heist

Great post! I know all of this is a work in progress but Ill throw my 2 cents in the ring. I usually find weapon selector controls through an analog stick such as your example Doom but also Wolfenstein always awarded me a wrong weapon in a pinch while I’m playing. This is usually due to the analog stick just slightly moving upon completing a selection. (Probably some user error there I’m sure). Here is my go at an explanation of what I think is happening. After I select a weapon, I let go of the stick to have it centered getting ready for a fight, or resetting my aim and the game recognizes slight movement in the analog stick beyond the center position (even if just a small amount) before the weapon selector closes giving me a wrong choice. This is not a big deal if I’m just exploring but if it’s a live selector such as Doom where the game isn’t paused, it could pose a problem. I really hope I’m describing this correctly. If not, I’m just crazy :) I think the elegance in visual design is my favorite of an in game weapon selector, I just seem to struggle using it. Though I have never had a better idea of how to do something like this differently. It’s almost necessary with games having so many weapon choices and controllers having limited buttons. I’m rambling now.


More Creators