WordPress.org

Make WordPress Core

Opened 4 years ago

Last modified 10 months ago

#36656 new enhancement

Improve UX on Add New User screen

Reported by: swissspidy Owned by:
Milestone: Future Release Priority: normal
Severity: normal Version:
Component: Users Keywords: ui-feedback ux-feedback
Focuses: ui, administration, multisite Cc:
PR Number:

Description

While working with Multisite recently, I noticed that the Add New User screen can be quite cumbersome to work with.

The screen currently serves two purposes:

  1. Add existing user to site
  2. Create a new user and add them to the site

It may make sense to have two different forms for that, but these are currently nearly identical, leading to user confusion. Here's an example:

https://cldup.com/FSMdB2Gtdp.png

I'd love to improve the UX on this screen, ideally by combining these forms and then use some JavaScript to conditionally display/hide the email field only needed when creating a new user. Alternatively, tabs could be leveraged to have each form on a separate page.

Thoughts?

Note: I also wrote a simple proof-of-concept plugin called Simple User Adding that could be used as a playground for this enhancement.

Change History (23)

#1 @karmatosed
4 years ago

  • Keywords ui-feedback ux-feedback added

@swissspidy totally agree this area could do with some consideration. I would suggest though that tabs maybe aren't the solution that's best - it could be, but we just don't have the evidence yet to say that. What I would love to see would be some research into what this has as common uses. What is needed? What isn't needed? Maybe also ask beyond one interpretation?

I'm going to add some feedback / design tags to this as would love to see some explorations as to what this could iterate to.

#3 @jeremyfelt
3 years ago

Big +1 for work being done here. This is a very poor experience for users and drives me crazy almost every day. :)

I would like to see the two forms combined into one. If a user does not exist (or exists), we should be able to make an educated guess or present the administrator with some guiding information. Also related, #18163, which highlights how different the Add New User form in the network admin is from the single site experience.

This ticket was mentioned in Slack in #core-multisite by jeremyfelt. View the logs.


3 years ago

#5 @shah.neel
3 years ago

+1 for this feature. A friend of mine has also written a plugin to solve this issue and is multisite compatible. It is worth checking https://wordpress.org/plugins/custom-add-user/

#6 @paaljoachim
3 years ago

Here is a wireframe suggestion.

http://i2.wp.com/easywebdesigntutorials.com/wp-content/uploads/Network-Add-New-User-add-user-to-site.jpg

The tricky part right now is finding a good way to show the sites. As checkboxes will not work for a larger number of sub sites. I am also working on finding a good way to select multiple users, to have a specific role and then adding the users to specific sites.

Will a multi select drop down work?

Last edited 3 years ago by paaljoachim (previous) (diff)

#7 @paaljoachim
3 years ago

Here is a wireframe with a multi select drop down.


http://i2.wp.com/easywebdesigntutorials.com/wp-content/uploads/Network-Add-New-User-multi-select-drop-down.jpg


Here is a wireframe for adding roles and users to sub sites through the all users screen.

http://i2.wp.com/easywebdesigntutorials.com/wp-content/uploads/Multisite-Network-All-Users-screen.jpg

This ticket was mentioned in Slack in #core-multisite by paaljoachim. View the logs.


3 years ago

#9 @iamfriendly
3 years ago

I’ve always found it weird (and a little frustrating) that the ‘Existing User’ is below the ‘New User’. I’ve heard multiple reports (and have done it myself in the past) of people not even knowing the ‘Existing User’ section is there.

Couple'a thoughts:

1) Roll the two into one form. And if the person types in an email already in use (could do an ajax call on blur if a full email address is entered) then offer the 'add to sites' fields.

or

2) A 'tab' interface at the top. Default to Add New User.

Either way, I think better inline help text needs to exist here. Perhaps directly below the 'Add New User' title with a link to the 'Add existing user' section embedded within the text of that help. "You can add a completely new user to the network or <link_here>add an existing user to one or more sites<end_link_here>". Something like that.

#10 @harshit_ps
3 years ago

Thanks @shah.neel for your suggestion.
I think the above wireframes wouldn't work with large network -https://codex.wordpress.org/Function_Reference/wp_is_large_network

Here is how we have been using this plugin https://wordpress.org/plugins/custom-add-user/ at NYU for our multisite environment.

https://ps.w.org/custom-add-user/assets/screenshot-1.png

This single form handles both new user and existing user because in our case the usernames are always unique (e.g. university id). So the site admin (e.g. faculty) doesn't need to know if the user he is trying to add already exists in the network (the new user might already have his own site or he might have been added by any other faculty on a different site in the same network)

This could be modified to work with unique email ids in addition to/in place of unique username. So if a site admin adds a new user, WordPress will check if a user with same email id exists in the network and handle it accordingly.

Let me know what you think.

This ticket was mentioned in Slack in #core-multisite by jeremyfelt. View the logs.


3 years ago

#12 follow-up: @jordesign
3 years ago

Just throwing a thought out there... If the first field is the email field - can do an autocomplete search on that for existing users? Then we should be able to show the remainder of the form fields conditionally:

  • If the email address is already on the network - we are adding an existing user
  • if the email address is not on the network - we know we are adding a new user

How would that flow work?

#13 in reply to: ↑ 12 @swissspidy
3 years ago

  • Milestone changed from Awaiting Review to Future Release

Replying to jordesign:

Just throwing a thought out there... If the first field is the email field - can do an autocomplete search on that for existing users? Then we should be able to show the remainder of the form fields conditionally:

  • If the email address is already on the network - we are adding an existing user
  • if the email address is not on the network - we know we are adding a new user

How would that flow work?

This more or less what I had in mind. A prototype would be good for this. I actually have some work in progress code in my plugin, but it doesn't yet include all the JavaScript and accessibility magic.

#14 @Mista-Flo
3 years ago

Hello,

This ticket is really interesting, the actual UX is not good at all. I have seen many clients lost in this UX with the two forms, even me as a WordPress developer, I'm always lost in this UX, always asking me "which form is the good one yet ?".

So according to me, a good first step will be to avoid having two forms on a single page. The plugin developed by @swissspidy seems interesting, I would dig into it to see how we can help on this ticket.

This ticket was mentioned in Slack in #core-multisite by paaljoachim. View the logs.


3 years ago

This ticket was mentioned in Slack in #design by karmatosed. View the logs.


2 years ago

#17 follow-up: @melchoyce
2 years ago

What if these were two separate pages, instead of combined into one? "Add New User" vs. "Add Existing User."

@swissspidy's idea should still be prototyped out, though — could be more elegant.

#18 in reply to: ↑ 17 @Mista-Flo
2 years ago

Replying to melchoyce:

What if these were two separate pages, instead of combined into one? "Add New User" vs. "Add Existing User."

@swissspidy's idea should still be prototyped out, though — could be more elegant.

It seems good, because swisspidy's idea need some JS to enhance UX, but maybe the best UX (to keep it simple) should be two separate pages like you said.

Last edited 2 years ago by Mista-Flo (previous) (diff)

This ticket was mentioned in Slack in #core-multisite by florian-tiar. View the logs.


2 years ago

This ticket was mentioned in Slack in #core-multisite by flixos90. View the logs.


2 years ago

This ticket was mentioned in Slack in #design by boemedia. View the logs.


14 months ago

#22 @cathibosco1
14 months ago

We reviewed this in design meeting today - we have a question:

Is it possible to use one filtered entry to start with some conditional logic

For example:
ADD A USER with options for

-Create a New User
-Add and Existing User

and if you added an existing user rather than new user by error - it could defuat top "Oh hey it looks like that user already exists, would you like to add them as an existing user instead?

Is it possible to filter from the top down?
Thanks

#23 @swissspidy
10 months ago

#45961 was marked as a duplicate.

Note: See TracTickets for help on using tickets.