The essentials of the design of the form and the shopping process

Source: Internet
Author: User

Key points for form design:

1. Overview

Forms are annoying to customers, but they are important for online processing, making it easy and quick to fill out a form so that the site can quickly gain potential benefits.

2. Question of the visitor

What problems do you usually have as a visitor in payment?

When visitors encounter a form, their problems focus on the appearance, the reasonableness of the required information, and the security aspects. After a quick glance at the form, they will think about the following questions:

1. Where do I start filling?

2, filling up very simple?

3, filling up very time-consuming?

4, the whole process is not a lot of steps?

5, page security?

6, the amount of information required by the form is reasonable?

Once the visitor starts filling out the form, he will have a few more questions:

1. Are these questions reasonable? Is it necessary to answer here?

2. Is my information secure?

3, I do not understand this question, the page has an explanation?

4, I fill in the form when the problem, how to get help?

5. What happens when I click on the Submit button?

6. How much do I have to fill in?

3. Forms-Specific problems

Looks like a problem.

Some forms of the elements are not very friendly, such as: Xu Xian input information text box is too short, the composition of the list of lines is too rigid, the font is black and small, as well as the imperative tone. Combine these together, the result makes the form look very complex, the page makes people feel troublesome, difficult to arouse the desire that the visitor fills in.

Insatiable

Forms that contain unnecessary fields are called greedy forms. Eliminate and compress non-essential and unnecessary fields.

4. Design points

For designers, form design focuses on functionality and practicality, not on fancy and entertainment.

Designing a form is not really an art creation, but more of a problem solving. How to create a useful form interaction page, this page is also very friendly, clear and good for visitors to fill out, is very important.

Remove the unnecessary fields. Make sure that the entire form is useful for each field

1 focus on the form area

The quicker the visitor can focus on the form, the quicker they know what to do and where to start.

Here are some ways to make your form stand out:

1, the form behind the setting of a light background (but pay attention to ensure the readability of the text)

2. Add a border around the form

3, the form area uses the color

4. Use arrows

Use borders outside the form and emphasize the color of the active form

Use a model gesture to give the user an indication of the role of the form

2 Use a clean, concise layout

Reduce the complexity and difficulty of forms, making the form layout clean and concise.

How do you make your form look clean and concise?

Space. In any color, leave enough space around the form and between the rows of the form to enhance readability.

Remove the useless elements. Everything around the form should help with the completion and submission of the form.

Proper retention of white, line spacing control

1, eliminate the blanks in fields and labels. Excessive whitespace in fields and labels can cause users to move their eyes horizontally. Putting labels and fields together can increase the correlation between the two.

2. Readability of text. Make sure that the visitor can see the text on the page without a magnifying glass. 12px or more. Form labels and fields should be of high contrast and simple text.

3, as far as possible left aligned and field area. Visitors generally find the starting end of a line of text from the left, and the right-aligned format makes it difficult to locate the beginning of a row, which significantly increases the complexity of the form. The left-aligned form-field area makes it easier to view the entire layout visually, and thus facilitates quick browsing.

In a right-aligned form, each line of text is not on the same starting point, and you have to read the labels to rotate many times.

When left-aligned, all text starts at a fixed starting point and scans directly to see all of the items you want to fill out.

3 Clear instructions to complete the steps and progress

If your form filling process is longer and there are no corresponding instructions, visitors are bored and give up.

4 provide security and confidentiality measures

Many visitors will not consciously find the "lock" icon on the page, see "Lock" will not determine the credibility of the link. So don't forget to add a lock to the form page while you're filling out your personal information.

Essentials of Shopping process design:

1. Overview

Any ecommerce site does not want customers to lose in the shopping process phase. Most visitors really want to buy something in their shopping cart, they need a clear and simple payment process without any obstacles.

2. Purpose of the settlement process

1, show the items to be purchased

2, collect logistics information and verify

3. Collect billing and payment information and verify

4, link to a payment interface, accept or process payment

5. General Questions for visitors

Issues in the preparation phase

1. Where do I start? How to settle?

2. Do you want to register?

3. What's my password?

4. Am I still in the shop just now?

5. How long will it take me?

The issue of the transaction process

1, is it safe?

2. How much is the mailing fee?

3. Support those payment methods?

4, what will happen after the submission?

4. Key elements of the settlement process

Elements that the closing step typically includes

1. Shopping Cart Preview

2, landing (for old customers);

3, registration (for new customers)

4, billing address/mailing address;

5. Payment Information

6. Payment Check

Confirm

5. Issues specific to the settlement process

Safety?

More tips for the security of customer pages

6. Design Points

The settlement process is usually designed in a number of steps, so any design must take into account the entire process and consider how each step changes will affect

Use basic Form Design essentials

1 The settlement process is essentially a form, so recall the main points of the form

1, delete the unnecessary fields.

2. Focus your attention on the form area

3, the use of clean, concise layout

4, clear instructions to fill in the steps and progress

5. Provide security and confidentiality measures

2 Help customers remember the items in the shopping cart

When shopping, you often forget to choose that thing, and worry about the size, color, and need for confirmation.

The best way to remind a customer is to place a thumbnail of each item in the cart, and secondly, to make the name of the item eye-catching and use a font that is good for reading. In addition, you should include information about the selected items, including color size, and so on.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.