Create an Account
Design Complete
Important Links
Introduction
If a server enables account creation, the mobile app will now have a flow to accommodate for user account creation through the app.
Design
The layout and aesthetics for this screen follow the Login and Add Server Screens.
iOS
Android
Back button
Tapping the Back button will push back to the Login Screen.
Must be a valid email address. Emails will be verified as next step.
Username
Valid usernames must follow pattern identified in system console.
Create Account button
This button is disabled until all required fields are valid.
Other Account Creation Methods
In the same way that users can log in using other authentication methods, accounts can also be created using other authentication methods. (OAuth, SAML)
Below the standard form fields a section shows with the available authentication methods. If there are more than two, all buttons show full-width and stacked on top of eachother (see next screen)
The transition from the Login Screen
Users can access this screen via a button in the top-right of the new Login Screen. Tapping this will push the user to the Create Account screen.
States
Default State
By default, the ‘Create Account’ button is disabled until all inputs have valid info
Field with Error
An error message with icon replaces the help text.
Button enabled
Once all inputs have valid info, the ‘Create Account’ button is enabled.
Email verification screen
When an account is created, a verification email is sent to the email address provided and the screen below is displayed along with a toast message at the bottom.
Open email app
Tapping this button will open the user’s default email app.
Resend email
Tapping this button will send another verification email. The same toast will show at the bottom (see next screen)
Toast
When landing on this screen, a ‘Verification email sent’ toast will show at the bottom. This toast will automatically disappear after 4 seconds.
Verification email
When tapping on the “Verify Email” button from the verification email, ideally we open up the login screen directly within the Mattermost mobile app.
Email verified
Toast
When landing on this screen, a ‘Email verified’ toast will show at the bottom. This toast will automatically disappear after 4 seconds.
Pre-populate email address
When coming from the verification email, the email address should ideally be prepopulated.