The mobile device is a device with high personal privacy, and the user can effectively protect the input password when operating;
The mobile device is carried with you, and the location is changed anytime, anywhere, and there are many unstable network conditions;
The display area of mobile devices is small, and the login and registration page usually has 3 pages (the M station is usually on one page), and the content consumer email list that the user needs to fill in should be simplified;
The input of mobile devices is more of a finger touch screen operation, and human-computer interaction has its own uniqueness, such as the design of virtual consumer email list keyboards and the design of special effects.
2. Thinking about APP login registration before design
Before you start designing a product, be sure to think about:
Who is login registration designed for?
Do you have to log in to register?
Do you need a separate account system?
Which operations require the user to log in?
3. Design steps for login and registration
Assume that the previous questions are clarified. Then let's design login registration.
The first step: sort out the brain map, sort out the existing login mode and information structure; (usually use xmind, the operation is simple and easy to use, and the most important thing is free)
Step 2: Sort out the business process, process each step of the operation, and do a good job of handling plans for various situations (it is very, very important to sort out the process);
Step 3: Draw a sketch/wireframe, and make a preliminary design of the page elements and layout;
Step 4: Interaction design, design for each page element, page jump, operation feedback, exception handling, buttons and various states of the page;
Step 5: Self-check test, carry out self-check on wireframe and interactive design, it is best to use interactive software such as Axure for interactive design operation, and establish your own self-check list;
Step 6: Output PRD, wireframe and interaction design draft.
Fourth, the design details
Since it takes time and energy to design each page, I will only make a brief summary.
Taking registration as an example, the general process of registration is to fill in the mobile phone number - get the verification code - fill in the password.
The account has no format requirements. If it is just a mobile phone number, does the front end need to verify the validity of the mobile phone number?
The mobile phone number is purely numeric. Is a pure numeric keyboard pop-up for users to quickly fill in and avoid users switching back and forth?
How are the digits of a mobile phone number presented? Which format?
2. Verification code
The format of the verification code is a four/six-digit verification code, or an English + digital verification code. Is English case-sensitive?
The default display state of the button and the color change effect of the button after the user enters the information, how to design it better?