i have to design a page where the user (after login for first time) must change the password but its optional to change the username. I am not sure which is the best approach from UX perspective, if its better to show all the fields indicating which are mandatory and which ones optional or making a two steps process. These are the two options that I've made:
Honestly, I don't like any of these.
Repeating the username would be an unnecessary action for the user, especially if this is applied to an optional field. We don't really want to occupy the space of two input fields for a secondary/optional feature. The usage of checkboxes can be easily avoided too, by simplifying the mechanism.
I would propose the following as a solution:
- New Password *: (empty field)
- Repeat New Password *: (empty field)
- New Username: (field populated with the current username)
- Submit (button)
- The "New Username" field should be populated by default with the existing username, so that no effort is required by the user in case there's no need to edit the username.
- You should make sure that the content of the "New Username" field gets fully selected on click; so that, although the field is populated by default, the user only has to click and type to insert a new value.
- Very simple interface (three fields, a button)
- Very clear hierarchy
- Minimal interaction required