/ Documentation

Notes on profile redesign

Nav in settings

The challenge of mobile navigation is big when designing settings. Animation can help the user understands where she is in the app but clear iconography is important too.

Back arrow or cross + "V"?

Some setting changes don't require a validation for the user to know it is saved. For example, changing the state of a switch is an action important enough, with a short animation that also can be changed back very easily. On the other hand, changing a password or other input fields takes more time and one may forget what was in the field as one types something different, whence the importance of a cancel button instead of a simple back arrow.

As there may be buttons in the page itself, to download picture for example, the validation of the changes is done with a button in the top nav too in order to avoid any confusion.

This validation button shall be designed in three different state. A disable black one when no action has been done and that the fields are empty, a normal black one when no action has been done but there're already filled fields (same as cancel button in that case) and finally a green one when something has been done in the page.