In this article you will learn how to think about the user profile and what are the best practices for managing it.
There are 3 main components to the user profile:
- the user info, such as name, country, etc;
- the authentication part, i.e. the password change;
- the interests.
As we’ve covered in a different chapter, the interests are managed separately. That leaves us with the management of passwords and user info.
Passwords are rather straight-forward, so we are going to gloss over them. Two things are important when changing a password:
- Always require the current password, the new password and the password confirmation
- Keep in mind that the user might have logged in with a 3rd-party Authentication provider such as Facebook or Google. In this case, there’s no previous/current password. This workflow needs to be handled and it’s up to you how, since there are many options (skipping the check altogether for such users, sending a password reset link to the users email and more)
The user info change is also rather straight-forward. Drop-downs or input fields for all entities are recommended. The only workflow that is a bit more specific is that for the avatar management. Users need to be able to remove the avatar, change it & crop it. We recommend using square avatars since they are the easiest to handle design-wise.
As a user, I want to be able to change my password
- there needs to be password confirmation
- if the user has an old password (they have logged in with email/pass and not 3rd-party provider) they need to provide it as a confirmation
As a user, I want to be able to change my user info
- I need to be able to change:
- name (required)
- country (optional, can be removed)
- gender (optional, can be removed)
- birth date (optional, can be removed)
- the example design does not provide UI for removing the optional data
As a user, I want to be able to change my avatar
- I need to be able to easily remove my avatar
- I need to be able to easily upload a new avatar with minimum dimension requirements (requirements are TBD per client)
- I need to be able to crop my avatar