1. Introduction
E-commerce is defined as the business activities relying on electronic devices and the Internet, which not only enables consumers to purchase goods more conveniently, but also reduces the cost of market expansion for enterprises and has become an important force in the global business field [
1]. With the growth of e-commerce, more attention is paid to its sustainability. The sustainability of e-commerce mainly includes three dimensions, i.e., economy, society, and environment [
1], in another word, e-commerce should promote economic development and improve people’s quality of life while reducing environmental damage. The related studies not only involve cross-border e-commerce sustainability [
2], and e-commerce cyber-security sustainability [
3], but also analyze the impact of IT tools on the sustainability of sales processes [
4]. As an e-commerce model, online customization can create additional profits and competitive advantages for manufacturing enterprises [
5,
6]. To strengthen the sustainability of online customization, it is necessary to satisfy the personalized demand of consumers to extend the product life cycle and slow down overproduction and resource consumption rates [
7]. Product configurator plays a key role in it [
8,
9,
10] because it is a window for consumers to deliver their needs, which can even affect consumers’ purchase intention and loyalty [
11,
12]. A product configurator is so important to the sustainability of e-commerce, it is, therefore, necessary to refine its design strategy to improve the customization experience of consumers, which is exactly the main motivation behind this paper.
A product configurator is an application that allows consumers to design their own products by selecting predefined components or attributes, and also provides instant feedback on the results of product design [
13,
14]. Many researchers have studied the interaction design principles and capabilities of product configurators. Walcher and Piller analyzed 500 existing product configurators in the market and pointed out four design features that product configurators should have, including visualization features, navigation features, customer support from the company, and design help from other customers [
15]. Trentin et al. conceptualized the design feature as five capabilities that a product configurator should have, namely focused navigation, flexible navigation, easy comparison, benefit-cost communication, and user-friendly product-space description capabilities, and developed a number of scales to evaluate them [
12]. Zhao et al. established an evaluation model for product configurator interaction design and evaluated the representative product configurators on the market. The results showed that most product configurators lack basic human-computer interaction principles [
8,
10].
However, there are two main problems in previous research. Firstly, they mainly focus on the product configurator on the desktop, the research on product configurator developed for mobile intelligent devices and its interaction design is still insufficient. With the surge of mobile Internet, consumers have become accustomed to shopping through mobile intelligent devices (such as mobile phones and tablet computers), but there are obvious differences between mobile terminals and personal computers dominated by gesture control in control mode [
16], thus leading to differences in cognitive load and decision-making behavior of consumers [
17,
18]. Secondly, these studies only give some general suggestions, and rarely conduct empirical research on a specific function on the product configurator to find out how the function is displayed better in the interface design. Therefore, we expect to explore the interaction design of specific functions of product configurators on mobile smart devices through empirical research to enhance consumers’ shopping experiences.
Interaction design is an interdisciplinary research field, which not only involves computer programming but is also concerned with users’ cognitive psychology in the interface operation process. Besides, it also relies on the effective arrangement of visual languages such as interface hierarchy, space, alignment, color, layout, etc. by design science to finally create a well-organized and pleasant user interface. In product configurator, interaction design mainly involves users’ cognition of the information system and consumer psychology, which is determined by the dual attributes of consumers as both information system users and shoppers [
19]. Therefore, we extracted one important interaction design factor from each of these two aspects for research and tried to understand whether they will affect each other. In conclusion, the present study aims to analyze two important interaction design factors of the product configurator, that is, navigation design pattern and pricing method, and try to understand the design approach which can create the optimal user experience.
In terms of navigation design patterns, the appropriate navigation design can guide and help users to efficiently access various contents and complete tasks in information systems [
20]. As far as the product configurator is concerned, the quality of the navigation design determines whether consumers can freely use various customization functions, which will further affect the perceived control of consumers in the customization process [
19], and finally cause consumers to make or give up the purchase decision [
21]. Although the usability of navigation design and user preference has always been the research focus of interface design [
22,
23,
24], the research on specific navigation design of the product configurator is still insufficient. Even if there are certain qualitative and descriptive suggestions [
25,
26,
27], it still lacks data support from empirical research.
As another study factor, pricing methods will also affect the online customization experience of consumers, because different pricing methods mean different price complexity, which will further affect the perceived product prices and purchasing decisions of consumers [
28]. Some scholars even suggest that consumers should not be told how much money is needed in every step of product customization but only should be notified of the total price after the customization is completed, so as to reduce the price complexity perceived by consumers [
29]. However, some scholars hold an objection to this, arguing that this will blur consumers’ perception of the costs and benefits of each customization step [
12], increasing the uncertainty of choice. Therefore, we hope to continue to explore the most suitable pricing method for consumers, especially in mobile customization scenarios.
In this paper, the impact of different navigation design patterns and pricing methods of product configurators on consumer customization experience was discussed, with a view to improving the customization experience and enhancing consumers’ purchase intention and loyalty, thereby contributing to the economic sustainability of online personalized customization. It does not aim to eliminate or stick to a certain interaction design, but to understand the advantages of different designs and how interaction design can enhance people’s shopping experience. Personalized customization has become an important trend in the development of the footwear industry. Major sports brands represented by Nike have launched their own online product configurators and have achieved good market feedback [
30]. This study takes sneakers as the customization object of the product configurator, trying to reveal the influence of navigation design pattern and pricing method on the consumer customization process and the relationship between them, filling the gap of research on the interaction design of product configurator on mobile smart devices, contributing to the theory and practice of online customization. This paper, there are six parts. Part I is the Introduction, in which the background and motivation of this study are introduced. Part II is Research Hypotheses, in which the existing research results and viewpoints on navigation design patterns and pricing methods are reviewed, and the hypotheses of this study are proposed on this basis. Part III is Materials and Methods, in which interaction design methods and experimental procedures of the product configurator are described to test the influence of different interaction design schemes on consumers’ mobile customization experience. Part IV and Part V are Results and Discussion respectively, in which the reasons for relevant data are explained and the opinions of other scholars are reviewed. Part VI is Conclusions, in which the research conclusions, limitations, and related suggestions on interaction design are put forward.
2. Research Hypotheses
Our research is inspired by flow theory. In this theory, flow is described as a pleasurable state of extreme concentration, which filters out any perceptions and thoughts unrelated to what is being done [
31,
32]. As for the field of online business and marketing, scholars have analyzed the interaction design method of product configurator based on flow theory and discussed the impact of different design schemes on consumer perceived control and perceived enjoyment, so as to provide consumers with a positive customized experience [
33]. Perceived control is the degree to which consumers think they can control the customization process and results, and perceived enjoyment is the pleasure perceived by consumers in the customization process [
33].
In addition to continuously adopting perceived control, and perceived enjoyment as indicators to measure the customization experience of consumers, we also pay close attention to system usability and flexible navigation capability of the product configurator. This is because system usability can reflect the effectiveness, safety, and enjoyment of human-computer interaction [
34], while flexible navigation capability reflects the consumers’ capability to modify the created product configurations [
35]. This capability not only has a significant positive impact on users’ satisfaction and purchase intention but also can increase their hedonic benefit and creative-achievement benefit [
12]. Complexity is consumers’ perception of the complexity of the customization process. It has been proved that the price presentation form of the product configurator, the range of customization options, and whether to provide a starting customization solution will all affect the complexity perceived by consumers [
33,
36].
The present study focuses on analyzing the Influence of interaction design of the navigation design pattern and pricing method on the mobile terminal product configurator on users’ customization experience, and six research hypotheses are put forward as shown in
Figure 1, which will be described in detail in
Section 2.1 and
Section 2.2.
2.1. Navigation Design Pattern
In the product customization process, consumers can create satisfactory products in “solution space”. The so-called “solution space” refers to a variety of custom attributes provided by the product configurator, and different options contained in each custom attribute [
8,
37]. For instance, when consumers customize a computer on a shopping website, they need to choose different custom attributes such as the size, screen, processor, etc., to balance the computer’s performance and selling price. Appropriate navigation design can guide consumers to make the best choice among different custom attributes and their options [
27,
35]. On the contrary, it may bring additional burdens and negative emotions to consumers [
11,
38].
To understand the navigation design patterns of existing product configurators, we used card sorting to classify all 45 mobile terminal footwear product configurators in a product configurator database (
www.configurator-database.com) for navigation design patterns. We invited 15 college students to participate in the card sorting, and they were asked to use each product configurator in turn. When they were done, they put together the samples that they thought had a similar navigation design (each sample was printed on a piece of A4 paper). We performed cluster analysis on the obtained data and finally classified them into two clusters named “tabs” and “dropdown menu with arrow buttons”. “Tabs” can display all customizable parts of the product at the same time in the product configurator, and the user can directly click on them to switch to the parts to be customized, while “dropdown menu with arrow buttons” only displays the parts that are currently being customized. If the user wants to switch the customized parts, they need to click the left and right arrow buttons or click the dropdown menu to bring up all customizable parts and then click the part they want to customize. To illustrate the differences between these two navigation design patterns more clearly, we plot their interaction design characteristics in
Figure 2.
The usability of tabs has been positively evaluated in previous studies. Burrell and Sodan [
22] found that tabs were more popular with users on the computer terminal because it was better than other navigation designs in terms of learnability. Harms et al. [
23] pointed out that the advantages of tabs on the computer terminal were extended to the mobile terminal, and this navigation design performed better in memorability, usability, overview, subjective preference, etc. The usability evaluation of dropdown menu with arrow buttons has not been found yet, but Breuninger et al. [
24] conducted a study on a similar navigation design (called page flipping with arrow buttons). It is considered that this navigation design performs the worst among all seven navigation design patterns in terms of the input speed, error rate, and user rating, and direct manipulation of a continuous list is the favorite navigation design of users. Therefore, the first hypothesis is made as follows:
Hypothesis 1. The product configurator using tabs is of better system usability than that using dropdown menu with arrow buttons.
The product configurator with flexible navigation capability can allow users to easily and quickly modify their product configurations created previously or currently, especially when the customization solution exceeds users’ budget [
35]. Specifically, the navigation design of flexibility should be provided with the following core features: (1) Consumers can freely choose various custom attributes in a desirable order rather than in a fixed order [
26]; (2) Consumers should perceive freedom and ownership in the customization process, thus stimulating their creativity [
39]; (3) Consumers can easily return from the new customization solution to the old one [
27]. In the present study, it is expected that the flexible navigation capability of tabs is better than that of the dropdown menu with arrow buttons because it is the most efficient for consumers to choose different custom attributes when using tabs. However, we are still curious about whether the dropdown menu with arrow buttons is advantageous in terms of ownership. Thereby, the second hypothesis is proposed as follows:
Hypothesis 2. The product configurator using tabs is of better flexible navigation capability than that using dropdown menu with arrow buttons.
Perceived control is the degree to which people feel that they can move freely in various ways in a specific situation [
40]. For product configurator, the uncertainty of the online customization process will reduce the perceived control of consumers and further affect the customization experience, while allowing consumers to freely choose the custom contents or steps can provide consumers with better-perceived control [
39]. In terms of perceived enjoyment, the research on human behavior shows that when the system endows consumers with full openness to the customization process, it will bring them more enjoyment [
41,
42]. In the present study, it is expected that different navigation design patterns will affect the perceived control and perceived enjoyment of consumers. In addition, the operation mode of tabs is more open, for example, when different product attributes are required, they can be selected directly by clicking when using tabs without relying on the left and right arrows like dropdown menu with arrow buttons. Therefore, the third and fourth hypotheses are put forward:
Hypothesis 3. The product configurator using tabs can provide consumers with higher perceived control than that using dropdown menu with arrow buttons.
Hypothesis 4. The product configurator using tabs can provide consumers with higher perceived enjoyment than that using dropdown menu with arrow buttons.
2.2. Pricing Method
An essential step in the online customization process is to show product prices to consumers, and how to strategically present the price in the product configurator has aroused the interest of scholars. Dellaert and Stremersch [
29] studied two pricing methods, namely, individual module pricing (marking the price of each custom part and the total price at the same time) and total product pricing (marking the total price only) and pointed out that consumers would feel more pecuniary loss and customization cost under the individual module pricing method. This is because it is pointed out in loss aversion theory that consumers perceive loss more strongly than benefits [
43]. Although total product pricing is simpler than individual module pricing in pricing strategy, and consumers prefer simple rather than complex pricing strategy [
28], some scholars have questioned that total product pricing is not as perfect as expected. Trentin et al. [
12] admitted that even if total product pricing made the price look less complex, it would obscure consumers’ perception of the cost and benefit of each custom part.
In addition to individual module pricing and total product pricing, there is another pricing method that is common in the current business environment, that is, adding “price details” on the basis of total product pricing so that consumers can know more about pricing details. It is called incomplete total product pricing. In the present study, the influence of the said three pricing methods on consumers’ online customization experience are explored, and their features in interaction design are shown in
Figure 3. When using individual module pricing, not only the total price of the product is displayed at the top, but the price of the option is also displayed next to the option. Incomplete total product pricing hides the price of each option but displays the price of the finished customized part in “price details”. Total product pricing is the simplest, which only displays the total price of the product at the top. Referring to the existing research conclusions, it is inclined to believe that the total product pricing strategy is relatively simple, but it also leads to opaque product pricing and further result in low perceived control of consumers. Thus, hypothesis 5 is put forward. Individual module pricing is the most detailed and the most complex. For incomplete total product pricing, although the price of each custom part is marked, it can be displayed only after consumers click the “price details”. This reduces the number of trade-offs (i.e., cognitive steps) consumers need to make during the customization [
29]. So, it is expected to have low complexity. Therefore, hypothesis 6 is proposed.
Hypothesis 5. Compared with the product configurator adopting individual module pricing and incomplete total product pricing, the product configurator adopting total product pricing will reduce the perceived control of customers.
Hypothesis 6. Compared with the product configurator adopting individual module pricing, the product configurator adopting incomplete total product pricing will reduce the complexity of customers.
6. Conclusions
In the present study, the influence of different pricing methods and navigation design patterns applied in the product configurator on system usability, flexible navigation capability, perceived enjoyment, perceived control, complexity, and task performance is explored. It aims to find the best interaction design solutions that can enhance consumers’ customized experience, thereby strengthening their purchase intention and loyalty, and ultimately promoting the economic sustainability of online personalized customization. In terms of navigation design patterns, our experimental conclusions match the research results of some scholars on tabs and arrow buttons [
22,
23,
24]. It should be pointed out that the evaluation indicators of tabs outperform those of dropdown menu with arrow buttons in most cases, but its advantages no longer exist under total product pricing, which may be because the special pricing methods of total product pricing change the user’s navigational goals by hiding the price of individual modules. In terms of pricing methods, the conclusion of this paper is different from the findings of Dellaert and Dabholkar [
29], indicating that not all product customization processes are the same and individual module pricing is more complex than total product pricing, which may be related to the type of customized product, and we should not ignore the impact of emotion on users’ perception of complexity [
41].
The main conclusions are drawn as follows: (1) Tabs are more advantageous than a dropdown menu with arrow buttons in system usability, flexible navigation capability, and perceived control of the product configurator. (2) Pricing method will significantly affect the perceived control of users in the customization process. Under the total product pricing method, users will be provided with the lowest perceived control, but there is no obvious difference between individual module pricing and incomplete total product pricing methods in the perceived control of users. (3) The combination of navigation design patterns and pricing methods will affect users’ feelings about the flexible navigation capability. Under the individual module pricing and incomplete total product pricing method, tabs have a higher flexible navigation capability than the dropdown menu with arrow buttons. However, under the total product pricing method, the dropdown menu with arrow buttons has a higher flexible navigation capability than tabs. (4) The combination of navigation design patterns and pricing methods will also affect the complexity perceived by users. Under the individual module pricing and incomplete total product pricing methods, users think that the dropdown menu with arrow buttons is more complex, but under the total product pricing method, tabs are of higher complexity.
Based on the research findings, it is recommended that enterprises should pay close attention to the following points during the design of mobile terminal product configurator: (1) Make use of tabs instead of the dropdown menu with arrow buttons, which can improve the system usability, flexible navigation capability and perceived control of the product configurator; (2) Avoid adopting the pricing method that only displays the overall product price, so as to prevent reducing the perceived control of users in the customization process; (3) Adopt the combination of individual module pricing or incomplete total product pricing and tabs, because, under the two pricing methods, tabs will have a higher flexible navigation capability and lower complexity.
There are also certain limitations of the present study. First of all, the number of subjects may limit our ability to make more extensive confirmation and expand the research findings. Secondly, the research conclusions in this paper are based on the product configurator of the sneaker, and whether the relevant design recommendation can be extended to other product types needs to be further verified. Finally, in order to control unnecessary influencing factors, a quiet experimental site is selected in this study, so the applicability of research conclusions in complex scenes (such as noise, learning while walking, etc.) still needs to be further verified. It is hoped that the present study can stimulate constructive debate on the interaction design of personalized customization.