1

The right-hand configuration side of my current connection dialog looks reasonable enough at the moment:

before

However, with the addition of several (very handy!) options, it is starting to look too busy:

enter image description here

What are some techniques I can apply to make it less so?

3

The technique you are looking for is called Progressive Disclosure.

Interaction designers face a dilemma:
• Users want power, features, and enough options to handle all of their special needs. ...
• Users want simplicity; they don't have time learn a profusion of features in enough depth to select the few that are optimal for their needs.

Progressive disclosure is one of the best ways to satisfy both of these conflicting requirements.

From nngroup.com.

How to apply this technique is way too broad to answer here. Also to answer that we need a lot more context. But if you read into it and search for examples I’m sure you will come up with ideas yourself.

2

You need a “Connection options” link which opens another part of the UI.

Optionally, you can experiment with little triangles for expanding and collapsing sections.

What belongs where can be decided by a quick card sorting experiment with all the fields as separate cards, using optimalsort and asking 10 users to fill it out as they see fit.

  • Say Connection options opens a little context menu? A no-window-controls thing? – Vadim Peretokin Oct 6 '18 at 17:45

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.