First, the product display diagram should not be too large, and the mouse hovers to show the details.
The picture display in the product details page is the first visual point after the user enters the page. Some designers may think that the size of this picture should be enlarged as much as possible, so that users can see the general situation of the product at a glance. However, as a designer, we should also take into account the importance of the text information on the right side to the user, and avoid a great deviation in the ratio between the two to reduce the visual discomfort of the user.
Because of the ratio of pictures to words, the whole IKEA website looks unclear, and the blank space around the pictures is in sharp contrast with the crowded words on the right.
When the mouse hovers over the picture, the detailed information of the product will appear on the right side of the picture, which is a very common function in the product details page. However, it will be found that even if the user's mouse unconsciously crosses the picture, the details will be presented immediately, which will affect the user experience more or less. IKEA's website naturally solves this problem.
Details of IKEA will not be displayed until you click on it, so don't let the picture of "coming as soon as you say it" hit ... The product details page is the most easily intersected with users in e-commerce websites, and the design of the details page is likely to directly affect users' buying behavior. Therefore, the design of the product details page will involve the operational level. On the basis of aesthetics and practicality, the information to be expressed is displayed as intuitively as possible, so as to consciously avoid the conflict between design and operation.
Second, satisfy the price comparison psychology of users.
"Shopping around" is the consumption habit of online shopping groups. Therefore, the design of the product details page should also be integrated into and meet the psychological state of the user's price choice. In consumer psychology, it will be mentioned that customers buy things mostly by personal feelings, and the price may not be really cheap, but businesses can make customers feel cheap.
The display of discount or discount amount can make subtle changes in consumers' psychology. Just as when, compare the original price with the discount price, and then directly indicate the discount. This kind of repetitive expression can deepen the user's feeling of discount strength.
Third, add a share button.
The power of social media can't be underestimated in today's marketing, so sharing buttons become essential. On most e-commerce websites, we can see:
The share button is set below the displayed picture or text, which mainly shares the goods on the current page. But in fact, the sharing that is really used for marketing promotion should not be limited to the goods themselves.
For example, the record of successful purchase, or interesting interactive evaluation between buyers and sellers, can be shared content, which may be more attractive than the goods themselves.
Fourth, the call to action.
Call to action can be interpreted as a call to user behavior, which is what we often call user guidance. Call ToAction generally starts from two angles: color and copy, and color is the most intuitive form of expression. Highlight with colors different from the page environment, attracting users' attention and making them more willing to click.
The price, label and "Add Shopping Bag" button all use bright rose; Shopping bags are also more active than shopping carts.
Five, the evaluation opinion is a necessary section.
Lack of trust in the network is a problem for most users, and other people's comments and suggestions can have a great influence on the purchase behavior at that time. Therefore, customers are not an option in e-commerce, but a necessity.
Tmall automatically summarizes customer statistics, making it more intuitive and convenient for users to view.
The product details page of MUJI website is lacking in this respect, perhaps it is bursting with confidence in its own products. Users don't need to listen to other customers' comments! But as a website, try not to be so cold.
Sixth, navigation follows
There are many contents in the product details page, which need to follow the navigation design. The appearance of product details page following navigation can provide great convenience for users, but designers need to master the size. Invisible and comprehensive navigation is what users really like.
JD。 The product details page of COM conforms to the user experience in navigation color and size, which is convenient for users to browse without affecting their visual experience.
The follow-up navigation of beauty appears in two forms. First of all, it is the main navigation of the website. After browsing to a certain area, the navigation automatically switches to the navigation of product details. In fact, this method seems a bit redundant. When users are already browsing a page, there is little need to jump. In addition, there is no need to design a secondary navigation in the following navigation, which will only narrow the user's line of sight.
Seven. Description of priority functions and uses
The brand plot of many product details pages is too obvious, which will make users feel too commercial and lack intimacy. There are usually new products or popular recommendations in the description of the product details page at the top of the fold, which is completely contrary to the user experience that businesses should pay most attention to, and this behavior will make users feel disgusted.
GAP's product details page has almost no redundant parts, and the contents in the page are all around a product, creating a good and comfortable shopping environment for users.
Eight, reduce copywriting and be good at displaying keywords.
Research shows that 60% users can't understand the text information on the Internet. From this, we can draw a conclusion that the copy on the Internet must be the most concise, and we should be good at grasping key words.
Gome Online first listed a series of key points that users really need to know on the product details page, and then introduced them in detail in the following part.
Nine, maintain page coherence
Regarding the product details page, from the user's point of view, they need to know all the information about the product clearly, or how to bring benefits to themselves. Therefore, the logical order of product description becomes particularly important, and designers can consider this point based on the cognitive law of product description.
The website of Suning. com is very smooth and clear in page coherence, so that users can follow the clues to find the parts they need.
Ten, the number of pages should not be too long
Mastering the page length is a very common problem to be solved in the design of commodity detail pages. Too long page length will not only slow down the loading speed of web pages, but also make users feel visual fatigue. Generally speaking, the PC display is within 20 screens, and the mobile terminal is controlled within 10 screen, that is, within 4 pages.
It is appropriate to control the page length of the product details page of Store 1, and try to explain the relevant matters clearly without adding other dispensable components.
Summary:
The design of product details page is not only a simple visual effect, but also a process of guiding users in conception and typesetting. To impress users and stimulate purchases, designers should use this idea to spread an illusion to users, not just to design a page.