1

We have a user config set up application where two steps need to happen and this is making the flow of screens quite voluminous and cumbersome for users.

This is how the design looks right now

When a user is "Enable"d, the card for that user expands and shows the options.

Expanded user image

When the user is set up and completed, the card for that user then shows clearly that the user is setup. Others look like they're still in the non-enabled default mode:

Enabled user

The challenge with this one-by-one set up for each user at a time is that it feels laborious, monotonous. So as a time saver we're thinking of a "copy settings" type functionality. See example for user 3 below:

Copy from another user

Clicking on that "prefill" option would pre-set User 3 to whatever selections had been made for User 2 above. However this is complex in both development terms and also tiresome for the user even with this little time-saver. There are other challenges -- what if a user setups User 2, then while setting User 3, cancels (Save/Cancel is not shown in this quick and dirty mockup), then DISABLES User 2, then opens up User 3 again. This time there's no "prefill" option unless we force a saved in-memory setup from the first user regardless of whether that user is now enabled or disabled. And so on.

Our alternatives.

1. Alternative 1: Make users into a dropdown

As shown below. This way, at least there will be less confusing jumping up and down the screen with collapse/expand of each user card. Instead the dropdown (not an HTML select box, just something that looks like a more modern DIV of a "dropdown") will look like cards. As we pick a user, the settings below remain the same, in the exact same location, but change according to whether the user is enabled or not.

This may be visually cleaner especially on smaller screens, but the issue with this approach is that the user will first need to be enabled, which would happen below the dropdown box itself. Perhaps in the same area as the actual configs? A sample of how this would work:

Option 1

Option 2: Make users tabs

Instead of a dropdown, we could potentially make users tabs. This allows us some ease of 'selecting' users quickly, and the settings appear for users in the same place on the right.

Here's an animated GIF of this option. The animation repeats...

Option 2

Option 3: Good old Spreadsheet style settings

This seems to be the simplest, but the challenge will be horizontal scroll on bigger screens, and on smaller screens we still need to solve the resolution..

enter image description here

Question:

Which of these options is the most usable for complex user config setup such as this? Spreadsheet style seems visually the easiest to us if the separation of each user is clean, but it does have the same info repeated. The repetition in some ways helps avoid the "Copy another user" functionality, but presents the screen scrolling challenge. The tabs on the left have some visual simpicity, but will present presentation challenge on small screens, or if we have, say, 9 users. The dropdown works, but is a two-step setup of first enabling a user and then configuring.

Would appreciate any pointers on how others have solved patterns of this three to four dimensional nature (each user -> enabled/disabled -> each setting type -> within each type each option).

Thanks!

2 Answers 2

1

This won't work for all types of settings, but another "model" to consider would be having a list of (editable) Configuration Settings. Instead of storing/editing each setting per user, store a list of "predefined" sets-of-settings and assign each user to one of those sets-of-settings.

This works best where there are many more users than sets of "distinct settings". Probably the best example would be controlling permissions: you set up several "access levels" (e.g. Administrator, Power User, Ordinary User, Guest), and then assign one of the access levels to each user.

It won't work if there is very little commonality between sets-of-settings.

1
  • Thank you so much. We have had this thought, and tried it visually. Our sets-of-settings are not that complex, and users are maxed to 10. So we can make some UI choices within those constraints. Sep 27, 2018 at 15:15
0

The drudgery of repeated data entry can be really soul destroying for users. I would definitely go for an option to bulk edit these fields.

What about something like the Bulk Edit Feature in Jira, where you can select a bunch of tickets and then edit the fields that they have in common.

enter image description here

3
  • Franchesca, thank you for the idea. Not sure I'd borrow anything from Jira's UX :and that screenshot is a testament to my fears :) Anyway, bulk editing is precisely what we're trying to avoid as it's a complex dev task, and the multi-stepping is something we'd like to stay away from. The more we can include in one screen, the better it is for us and hopefully the users. Sep 27, 2018 at 13:01
  • @NearlyNormal Are you designing a screen here, or a workflow? Some workflows are naturally limited to a single screen, and some are naturally multi-step processes. The options you have are probably fine for smaller data sets. If your users are managing hundreds, or even thousands of items then they will appreciate "power user" type features such as bulk editing.
    – Franchesca
    Sep 27, 2018 at 13:18
  • It'll be a maximum of 10 users. This is a part of a multi-step workflow as it is, so we would prefer not to have this become a multi-step thing in itself. Sep 27, 2018 at 13:36

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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