Settings UI Rejuvenation

[carlos-zamora]

@cdobrzynski_microsoft and @carlos-zamora have been working together over the past few months to redesign the settings UI. We've done some user research testing to get some initial feedback. Now we're looking to get some feedback from the GitHub community!

The mockups are presented after with some notes from our sessions. There's some open questions there so feedback on those would be very appreciated. 😊 Hope y'all like it!

Mock-ups with more notes

Overall

• Positive feedback on having settings be a separate window
• The top-level navigation view has a lot of entries. See below for how we're planning to reduce them.
• Novice users appreciate body text in relation to headlines (the text underneath the setting names). Experienced users didn't mind it.
• auto-save is expected as the modern default
  • however, some users want reassurance (indicator, preview, undo safety)
• live previews and visible changes increase confidence

Startup

• The main thing here is the groupings: "Launch behavior" and "System & input defaults"
• Convert toggle button on right side to check boxes on left side (i.e. "Launch on machine startup")
• When a profile is shown in the combo box, we'll still show the icon.
• Whoops! "New instance behavior" shows "PowerShell". That should show the ones we have today.

Interaction

• new groupings: "Clipboard and paste behavior", "Text selection & editing", "Window and layout behavior"
• Convert toggle button on right side to check boxes on left side (i.e. "automatically copy selection to clipboard")

Personalization

• new groupings: "Visual style", "Tabs and Layout"
• Convert toggle button on right side to check boxes on left side (i.e. "automatically copy selection to clipboard")
• "Personalization" sets expectations (themes, fonts, visuals) that aren't met.
  • This is still a fairly open question. Some ideas:
    1. move some stuff from (Defaults) Profiles > Appearance here.
    2. Link (Defaults) Profiles > Appearance here to direct people to the right place?
    3. Change name to something that is more clearly referring to the app's appearance (vs the profile's appearance)

Compatibility

• new groupings: "Compatibility" and "Rendering"
  • the idea is to consolidate the two separate pages that exist today
• "reset to defaults" is a strong safety net
• "Compatibility" feels advanced/vague/intimidating. What's something else we can name it?

Actions

• Update styling for showing the associated key chords
• Update styling for each action to be a "setting container" kind of wrapper
• How to display/handle multiple key chords on the same action?
  • the current mockup shows a few options:
    • "View all key bindings"
    • show a single key chord
    • show a single key chord and a "..." button that will show you all of the key chords (CURRENT FAVORITE)
• "Actions" causes hesitation. "Shortcuts" would be better

Actions > Edit Action

• add setting containers
• new groupings: "key bindings" and "additional customizations"
• Actions > Edit Action worked well
• Users tend to not rename their actions. Might be worth moving down.

Dropdown Menu

• rename from "new tab menu" to "dropdown menu"
  • "Dropdown menu" is intuitive and well understood
• Move preview to right side (tested well in user research)

Profiles page

• Add navigator for "Defaults", "Color schemes", and individual profiles
  • removes them from top-level elements in the navigation view
• dynamic profiles are consistently valued
• "Defaults" (with regards to profiles) is widely misunderstood. Generally interpreted as initial terminal setup. What's something else we can name it?
• Experienced users want reuse, ordering, and duplication for the new profile page
• "profile" is interpreted as a user account
• "Color Schemes" in "Profiles" page wasn't noticed. Users want it in "Personalization"

Profile base page

• new groupings: " profile", "Visual/UI Affordance"
• replace toggle switches with checkboxes

Profile > Appearance subpage

• new groupings: "Typography settings"
• Dropdown menu preview was a strong success because now you can always see the preview. How can this be achieved with the Profiles > Appearance preview?