Rules for registration form design

Rules for registration form design
I finished reading "Patterns for Sign Up & Ramp Up" a long time ago. The reason why I am writing my review today is that after reading it carefully, I found that it is more like a guide to building a community that attracts registrations and increases activity. It is a good material for studying active community membership.
Since I agreed to write a review, I will talk about some things related to registration from my perspective. I will first break down the structure of the entire article, and then talk about my current feelings based on the viewpoints in it.
Registration is actually a somewhat boring task. The point mentioned in Patterns for Sign Up & Ramp Up is:
Give the user good reasons to join
At first glance, it may seem a bit like marketing. The essence of things remains unchanged, but people’s emotions can be reversed - give users a good reason to sign up;
Make the sign-up process feel effortless
To change the boring and annoying feeling, that is what we need to do: make the form or the entire registration process easy and labor-saving;
Don't leave new users hanging
The significance of this point of view in the entire document focuses on ways to increase activity - users have not completed their mission by completing registration, and learning about new things in the community is just the beginning;
Accelerate initial connection-making
If activity started from the previous point, then here is how to enable users to start living in the community and establish connections, such as contacting friends through information they have previously posted, and truly experience the feeling of "there are friends all over the world, and the world is like a neighborhood."
The skeleton structure of the whole article is a step-by-step behavioral guide, which provides detailed annotations and guidance for the initial guidance of introducing members and maintaining community activity on Facebook, and can be used as a manual for reference. After reading, focus on the summary of the work and sort out several rules of registration forms:
    When the form structure requires multiple steps, it is important to provide clear navigation Use a progress bar to tell users the current location and the entire step Emphasize the logical connection between the steps, such as marking: step 1, step 2, step 3 Use meaningful pictures or icons or even titles to explain each step Use simple language or second-person descriptions of the action logic steps should preferably be limited to 3 steps User prompts during registration
      Tips should be displayed where help is needed or where there is a connection between previous and subsequent actions. Encouragement for users should be reflected in the process, such as a check mark icon for each completed input item. Try to avoid pop-up warning boxes. Avoid using warnings to make users feel frustrated. Use simple and easy-to-identify icons to mark tips, success, and errors. If there is an error when submitting a form, it is best to display the error reminder at the top of the entire form for long forms to guide users to correct the error.
    Regarding the quality of copywriting , it is more important than the quantity. Point out the highlights directly rather than listing them in a flat manner. Try to avoid copywriting with special meanings. If there are special nouns, please explain them clearly to avoid user confusion. Try to think about the highlights on the surface of the copywriting and what is most attractive to users. Sometimes the word "latest" is not necessarily what users are most interested in. In our previous projects, many data and practices emphasize that copywriting is really important. The layout of the form should use aligned fields, equal-length input boxes, and consistent visual styles to reduce visual interference. Try to limit the appearance of 3-6 fields and input boxes on one screen (mostly used in multi-step situations). If there are optional and required fields, indicate the difference. Categorize information with different concepts and separate optional and required fields as much as possible.

These general rules of form design are also covered in the comprehensive explanation of forms by LukeW from Yahoo in the United States. They are all the most commonly used. I will summarize them for your reference. There are still many points that can be explored in depth in guiding activity. We will not discuss this here and leave it for later analysis.

<<:  Docker starts the elasticsearch image and solves the error after mounting the directory

>>:  Detailed application of Vue dynamic form

Recommend

MySQL permissions and database design case study

Permissions and database design User Management U...

js+canvas realizes code rain effect

This article shares the specific code of js+canva...

How to install Maven automatically in Linux continuous integration

Unzip the Maven package tar xf apache-maven-3.5.4...

MySQL Optimization Summary - Total Number of Query Entries

1. COUNT(*) and COUNT(COL) COUNT(*) usually perfo...

MySQL common statements for viewing transactions and locks

Some common statements for viewing transactions a...

MySQL query sorting and paging related

Overview It is usually not what we want to presen...

Vue imports Echarts to realize line scatter chart

This article shares the specific code of Vue impo...

Detailed explanation of setting up DNS server in Linux

1. DNS server concept Communication on the Intern...

WeChat applet example of using functions directly in {{ }}

Preface In WeChat applet development (native wxml...

Share 8 CSS tools to improve web design

When one needs to edit or modify the website desi...

MySQL 8.0.22 installation and configuration graphic tutorial

MySQL8.0.22 installation and configuration (super...

Detailed explanation of Vue development Sort component code

Table of contents <template> <ul class=&...

Reasons and solutions for not being able to detect array changes in Vue2

Table of contents Workaround Why can't I moni...