Jump to content

You can’t spell User Interface without U & I


Nesses

Recommended Posts

cbKqVsB.png

Greetings, forum-goers! I’m Ness, the Art Director here at Intercept, and I’m interrupting your regularly scheduled UpNate to bring you a special broadcast. Let’s talk about KSP2’s User Interface, the most meta of all game art disciplines! 

UI must surface moment-to-moment information and actions to players in either text or clever visual shorthand. When making a simulation game like KSP, an even greater burden of information is placed on the UI, since we need to supply players with a mountain of information and choices without overwhelming either the player or their screen’s real estate. It’s a fascinating and sometimes frustrating balance to strike and I am consistently impressed by our UI/UX team’s ability to analyze abstract, un-implemented features and translate them into visuals. Jordan and Colton from our UI/UX team at Intercept work tirelessly to make rocket science digestible and slick-looking!   

Before we dive into future plans for KSP2’s UI, I’d like to first take a quick look at KSP1’s. Its UI went through several distinct stages over the course of KSP1’s history, the most radical changes happening early in development. One thing that I love about videogame UI is that on top of all the information it must convey, it’s visual styling can suggest subtle narrative and worldbuilding—something that KSP1 has absolutely utilized and that we will continue to evolve in KSP2. 

Some very early unreleased examples of KSP1 0.2’s UI can be found on HarvesteR’s dev blog. We can see a mix of fonts, both handwritten and geometric sans serif, as well as a barebones parts catalogue. The mix of fonts here is the most interesting detail to me; the handwritten altitude and speed readouts suggests a theme of "DIY" that applied to both the Kerbals in the game and the developers making the game. 

j0rhCC8.png

A later iteration of the UI around KSP1 0.3 introduces the familiar grey that stuck around for the rest of development, as well as a precariously-stacked flight heads up display. This cobbled-together “junkyard” readout was an evolution of the Kerbal narrative of a DIY space program using salvaged parts.

XkGLwEh.png

By the time KSP1 0.7.3’s public release rolled around, the staging stack had moved to the left side of the screen, we had a flight cluster, and Kerbal live-feed portraits all carefully spaced around the edges and wrapped in that grey pseudo-metal that we saw back in 0.3. Gone was the junkyard aesthetic, and the skeuomorphic gauges were carefully lined up.

Rl7dpVy.png
Ty to @Whirligig Girl for the image above

MwLZpEg.jpeg
And finally, a shot of KSP1’s UI as of 1.0 

We’re all familiar with the symbiotic effect that mods had on KSP1, and I believe that by keeping the UI simple and grey, it allowed modders with limited artistic ability to easily match the look of the canonical UI and maintain a level of visual consistency which ultimately cuts down on cognitive load and increases immersion. This is absolutely something we on the art team are aware of in KSP2, and when it comes time to roll out additional modding tools the UI team will also share our internal style guide for modders interested in mimicking KSP2’s UI.

Now onto what I think most of you all are here for; what’s in store for the future of KSP2’s UI now that For Science! is out the door. In the weeks since release, we’ve enjoyed following along as new and returning KSP2 players have checked out the missions, discovered points of interest, and put all of our flight systems through their paces. As thrilling and satisfying as it’s been to see all of the impressive feats you’ve achieved since the For Science! update, we’re also been watching and documenting your reactions to the user experience and the user interface in particular.

We’re excited to see that many elements of our UI have facilitated a smoother first-time user experience, but with your help we’ve also identified several areas of confusion that we are actively tracking. These improvements include:

  • Fonts can be hard to read for a variety of reasons (size, scaling, color, contrast, etc.)
  • The maneuver gizmo can be difficult to interact with, and precision maneuvers are especially difficult
  • Trajectory tag markers can be difficult to differentiate or identify
  •  Trajectory tag stems can get tangled with one another in ways that cause significant visual confusion
  •  SOI transit "bullseye" indicators are too bright, too big, and too prominent relative to other map elements (this is a personal bugbear of mine)
  •  Rearranging the staging stack order when selecting the bottom-most stage is difficult
  • The Part Manager presents several usability issues including but not limited to; observing many parts at once, using the Resource Manager as a separate app to specifically track fuel on a per-part basis feels awkward, associating a viewed part in the manager with the actual part on the ship
  • We are not adequately communicating that "Revert to VAB" causes a loss of recent progress, and there are situations when reversion should not be accessible at all
  •  It is not obviously clear, especially to new players, when a vehicle is recoverable
  •  The audio-only countdown on launch presents both accessibility and legibility problems 
  •  When in any time warp state other than 1x, the UI does not adequately communicate the state change. The tendency to interpret an under-warp failed control input as a bug has caught out quite a few members of our own team, and is likely responsible for quite a few bug reports
  •  Visual styling for some UI elements is not completely unified 
  •  It would be very handy to be able to see mission requirements in the VAB while constructing a vehicle

KSP2’s Early Access is delivering exactly the kind of active feedback loop we were hoping to see, and we’ve now got a nice collection of feedback items to help guide our work priorities. We’re excited to continue improving on the UI. In the meantime, we’ve been working away on a few UI improvements of our own! In the upcoming v0.2.1.0 update you’ll not only see us begin to work through the 2024 bug list, but you’ll also see the following changes:

VfsqcGR.png

We’ve adjusted the iconography and visuals of intersect nodes to make them easier to interpret (and hopefully easier to learn). We’ve also adjusted the colors of the planned trajectory line to further differentiate from your current trajectory, and shifted the colors on intercept nodes to make it more clear what relation your craft has to celestial bodies. 

Time and space are weird, but through these and future trajectory improvements we’re working on, we hope to make parsing orbital mechanics more approachable!
 

wVBHLkg.png

Aaaaaalso as a sneak peek for something that’s coming beyond the v0.2.1.0 update, Jordan has been diligently combing through and adjusting KSP2’s UI in a giant unification pass in order to align some of our disparate visuals. The shot below represents the first wave of style unification on the highest traffic areas of the game:

RHWkZj4.png

I’m looking forward to sharing more UI improvements with you all in the future! 

---

Finally, we’ve got an exciting announcement! We’re working on a new promotional video for KSP2, and we want YOU to share your favorite creations with us. It doesn’t matter if it’s a rocket, a plane, a rover, a boat, a giant mechanical turkey, or whatever your heart desires—if you love it and you’re proud of it we want to see it! If we end up using your submission in the video, you’ll be credited and have eternal bragging rights

If you’d like to submit, send an image of your creation along with a craft file (.json) to [email protected]. Please also include your preferred name so we can credit you! (can be real name or username). A bit of fine print here: by submitting your creation, you’re agreeing to let us use the craft file in any and all future marketing materials. Thanks!

We’ll release more details as the trailer project moves forward. We’re excited to take your vehicles out for a spin!

Ness
 

Link to comment
Share on other sites

I'm glad to see the UI/UX team is working on unifying the UI and making it more legible. I hope some of that work extends to removing the "serifs" (the slashes and dots) from the middle of 0s. That should help a lot with legibility, as this quick mockup hopefully shows:

2WUX6uh.png

The main reason that some coding fonts have zero "serifs" is to distinguish them from the letter O, but since these UI fields are only used for numbers, this doesn't seem necessary. Being able to see at a glance that a zero is a zero (and not an 8 for example) will be more useful for most players.

Thanks for keeping us in the loop!

Edited by TROPtastic
clarified
Link to comment
Share on other sites

So glad to see attention put on UI feedback. I think UI is the #1 item holding me back from playing as much as I want, so this gives me hopes personally.

As personal feedback, if this is read or considered at all, I still think that:

1) Certain UI elements, both in Flight and on VAB should be pushed a bit more towards the screen borders instead of just floating many pixels away from it. KSP1's style relied on keeping UI elements tied to the screen borders and allowed for much greater visibility. Or at least I'd conform myself with a reason for why it's the way it is so I could at least understand the artistic decision behind it.

2) I'm hoping that, down the line, players will be able to manually move UI elements around and save their layout as they please, just like the mod "I Wish They Made UI Customizable" allows you to do, but in a vanilla, slightly more fancy manner. Scaling is already there, but it's a global option and doesn't do wonders.

3) That color manager is desperately asking for arrows that allow you to copy and switch selected colors around, hex code text fields and a way to color agency and kerbals separately. Please. Please I need this in stock game!

Edited by MARL_Mk1
Link to comment
Share on other sites

The action group manager seems to still be missing the correct icons that the parts manager got back in patch 4(?). It’s a minor thing that bugs me a bit lol

RHWkZj4.png

Edited by Suppise
Link to comment
Share on other sites

20 minutes ago, Nesses said:

RHWkZj4.png

Am I imagining things or is this a much tighter interface (in terms of less "whitespace")? That's one of my bigger gripes, just how much space is wasted on the screen.

Either way, the fonts are looking much, much better, great work, looking forward to playing the result!

Link to comment
Share on other sites

33 minutes ago, Nesses said:


 

wVBHLkg.png

Please also fix the pixelated icons and raw / thick lines. They look crisper and cleaner in KSP1. It's like they have a slight pleasant glow.

Spoiler

screenshot22.png

Djd4qOyUcAAXBgd?format=jpg&name=large

 

Edited by Vl3d
Link to comment
Share on other sites

Unification of UI elements is always good, especially by having a consistent design language that helps users quickly find what they're looking for.

And I too would like to see hex code text field(s) for the color picker.

Link to comment
Share on other sites

2 minutes ago, MARL_Mk1 said:

That color manager is desperately asking for arrows that allow you to copy and switch selected colors around, hex code text fields and a way to color agency and kerbals separately. Please. Please I need this in stock game!

Fully agree that we need some way of reproducing exact colours, but I think it will be more complicated than a hex code. The current colour selector uses Hue-Saturation-Value *and* metallicity/transparency (the vertical slider), so the devs will have to come up with a custom scheme that captures all 4 values in one code.

Link to comment
Share on other sites

Will spacecraft in KSP 2 have more classifications (Lander, Station, Plane, Relay, etc) that could be seen in the map screen like in KSP 1? Also I wonder when flags will be visible and accessible through the tracking station.

Link to comment
Share on other sites

23 minutes ago, NexusHelium said:

@Heretic391 You better give them your Dres station (or any of your other stuff). There is no way something as impressive as that wouldn't be featured.

Haha that would be like 7 or so craft files :happy:i wonder if anyone would be bothered to dock them all. Maybe I'll send them all as a challenge 

Link to comment
Share on other sites

Looks good! So far the biggest gripe with the UI for me are the HUGE points of interest/vessels icons, that often clip into the celestial bodies, or cover them completely when planning interplanetary transfers. Hope it's being worked on!

Link to comment
Share on other sites

58 minutes ago, Vl3d said:

Please also fix the pixelated icons and raw / thick lines. They look crisper and cleaner in KSP1. It's like they have a slight pleasant glow.

  Reveal hidden contents

screenshot22.png

Djd4qOyUcAAXBgd?format=jpg&name=large

 

I get that there is an art style that they are trying to go for here, but I agree.  Was trying to make a node earlier to Duna. I had 2 vessels in orbit of Kerbin, and when trying to make the node, I found myself mis-clicking on the other craft because the icon was so large even when I was zoomed all the way out. It should, like in the first game, almost prioritize the node and scale the other icons down. 

Link to comment
Share on other sites

>UI blog

>Ctrl+F "Navball".

>No mention.

All I needed from this thread honestly and it's not even mentioned. The unification is nice, but that really is 101 stuff if you aim for your product to at least look professional.

The same way you tightened the UI by apparently removing whitespaces? Do that to the Navball, and for the love of god let me put it where basic common sense dictates it goes.

Link to comment
Share on other sites

2 hours ago, Nesses said:

Jordan has been diligently combing through and adjusting KSP2’s UI in a giant unification pass in order to align some of our disparate visuals. The shot below represents the first wave of style unification on the highest traffic areas of the game:

RHWkZj4.png

A blessing to my eyes. Well, kinda, cuz I see that staging stack is not extended. But, all the unused space - gone. Wonderful.

As first step towards a readable future. (I'm still not a fan of mixing clear, smooth font with whatever pixelretro80's the other thing is (srsly, this needs to go, hopefully by the time of 0.3))

2 hours ago, Nesses said:

 

VfsqcGR.png

We’ve adjusted the iconography and visuals of intersect nodes to make them easier to interpret (and hopefully easier to learn). We’ve also adjusted the colors of the planned trajectory line to further differentiate from your current trajectory, and shifted the colors on intercept nodes to make it more clear what relation your craft has to celestial bodies. 

Time and space are weird, but through these and future trajectory improvements we’re working on, we hope to make parsing orbital mechanics more approachable!
 

wVBHLkg.png

Liking the new ship/target icons. But I hope that the markers won't disappear under each other and extended ones will be movable (sorta like PAW in KSP1, open, locked, still connected to the relevant item but in any position chosen by player). Cuz I already see that with further zoom, the An would disappear under vehicle intersect.
Oh and btw, left-clicking on body/vessel does not need to pin its name on the screen. It also quite often blocks the view.

Link to comment
Share on other sites

2 hours ago, Nesses said:

 It is not obviously clear, especially to new players, when a vehicle is recoverable

If you are slowly parachuting down to the surface of Kerbin, you should be able to recover a vessel. I get the fun of landing or splashdown, but let's be honest, that gets old quickly, and getting down to the surface takes sooooo long.

Link to comment
Share on other sites

2 hours ago, Nesses said:

 

VfsqcGR.png

First off, YAY for those changes. However, my first thought on seeing this screen was, "Which MUN PE is which?" There are 3 of them, and 2 of them are right next to a MUN AP icon. The third is behind the Mun.

May I suggest recoloring the target orbit so it is more of a different color than the primary ship's orbit? May I also suggest using the same color as that orbit for the text? Having the lines going from the orbit to the text be that color is nice, but having the text that color would make it far easier to see which label went with what, especially when they are close together.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...