A Posture HCI Design Pattern for Television Commerce Based on User Experience

Abstract

Television commerce represents a significant opportunity for worldwide market due to the digital TV transition in several countries. In order to provide a design guidance for these applications, we developed a T-commerce Posture HCI Design Pattern based on user experience research. Three focus groups are composed of twenty-five participants and an experiment with eight volunteers were performed. The results are described as a design pattern template composed of four types of t-commerce applications. Each type presents a recurrent problem, a proven solution and a context. The developed design pattern helps designers to decide the t-commerce main interactions focusing on better user experience.

Keywords

1 Introduction

Digital television transition is being implemented in several countries with different deadlines to finish this process. Interactive Digital Television (IDTV) offers many opportunities through interactive applications. One of these opportunities is the electronic commerce or e-commerce known as television commerce or t-commerce. An e-commerce transaction is the sale or purchase of goods or services conducted over computer networks for receiving or placing of orders [1]. In contrast to the e-commerce on websites, the t-commerce business model is not completely defined. It means that the t-commerce remains heavily underexploited. One of the reasons might be the lack of design guidance for this type of service.

In 2012, there were 55 % of worldwide households with digital TV receivers [2]. In absolute terms, 380 million households with digital TV in developed countries. In the same year, worldwide B2C (Business-to-Commerce) e-commerce sales grew 21.1 % to top 1 trillion dollars for the first time and the top five countries were the United States, China, United Kingdom, Japan and Germany [3]. This given scenario presents a potential worldwide market for t-commerce.

In January 2014, the first known integrated t-commerce and advertising was broadcasted [4] and it allowed viewers to purchase the featured products using the TV remote control. It was an experiment with t-commerce interactive advertising. However, this experiment raises a few questions: Is this the first existing t-commerce application? How do users think about the t-commerce? In which contexts can we apply the television commerce? How to choose the best way to sell products in t-commerce applications?

Answers for these questions can be resumed in a HCI design pattern, which helps designers to choose a good solution for their applications. A design pattern is a proven solution for a problem in a context. Each pattern is a three-part rule, which expresses a relation among a certain context, a certain system of forces that occurs repeatedly in that context, and a certain software configuration, which allows these forces to resolve themselves [5].

We purpose a posture design pattern to help designers to choose a t-commerce type for a specific business goal. A posture pattern is a high-level pattern in hierarchy problem scale in interaction design. When we talk about top-down design, it means that, usually, our first activity is to start understanding the users and their tasks, technical environment, business, context etc. Every system or application has a reason for existence [6]. A posture pattern describes what the essentials of that posture are: what kind of application is used consistently, which elements are typically necessary and what are the main experiences that are offered to users.

HCI research has one major aim, which is to create good experiences while interacting with an interface. Research in this area is often referred to as UX research (User eXperience) [7]. In order to achieve positives experiences on t-commerce applications, we developed a t-commerce posture design pattern using a user-centred design approach.

Section 2 presents a background about digital TV and its context. Some related works about television commerce are presented in Sect. 3. In Sect. 4 we present our method and techniques. Section 5 describes the HCI posture design pattern for television commerce developed in this paper. The last section is reserved for conclusions and future work.

2 Background

To develop a design pattern, it is necessary to define quality criteria for identifying proven design solutions. Since we chose the user experience (UX) as quality criteria, three factors [8] affects UX: the context around the user and system, the user’s state, and the system properties.

Currently, there are four digital TV distribution technologies [9]: Digital Terrestrial TV broadcasting (DTT), Digital Cable TV (CATV), Internet Protocol TV (IPTV), Direct-to-home Satellite (DTH). To a certain degree, the present t-commerce pattern is for DTT technology, but it may be extended for the other TV distribution technologies. One of the requirements for DTT is a set-top box that allows a viewer to receive digital signal that includes digital data from TV applications.

We have to consider several context of IDTV [10] such as viewing distance, environment, number of user and user engagement. TV is a social tool, in a familiar environment that is watched from long-range distance. All UX aspects were considered in the t-commerce application interaction as we show in the following sections.

3 Related Work

Some researches provide definitions about television commerce [11–13]. These findings describe traditional and interactive application t-commerce categorization from the general to specific.

According to Lin et al. [11], a television commerce comprises all the transaction behaviors via TV including the traditional TV shopping. The authors categorize t-commerce in four types: TV shopping, direct response TV, travel shopping and TV applications. Summing up, they classify t-commerce into these three traditional t-commerce types and one using an interactive TV application.

E-commerce involves transactions of goods or services, t-commerce applications include other types of digital transaction, such as banking, gambling, video on demand, donation services. Yu et al. [12] consider that t-commerce has two types of home services: homeshopping and homebanking.

Ghisi et al. [13] suggest a t-commerce categorization including this other digital transactions and different forms that are linked to advertising. They proposed four presentation models for t-commerce: Sales Channel, Program Related, Interactive Advertising and Other initiatives. This categorization is most suitable to our study because it suggests low-level types for digital television commerce applications. However, the provided elements in this model do not have specific design guidance on development of each t-commerce type and do not include user expectation regarding user experience.

In this paper, we show design guidance for four t-commerce type, which is similar in certain degree to the Ghisi presentation model [13]. Our categorization is based on user expectations and is an improvement on the current model because it better describes each t-commerce type in a pattern. Since interactive advertising were included in these models and there are different ways to attract viewer’s attention and to provide specific information [14] (for instance advertising that aim to reward the viewer with coupons or discounts) our study is limited to advertisings that aim at increasing sales and provide online purchase functionality.

Several t-commerce applications were found on Internet from different countries and companies, which the interfaces are illustrated as follow on Fig. 1.

Fig. 1.

T-commerces from left to right (Top): YuBuy (Portugal), HSN shop by remote (USA), Brava tcommerce [13] (Brazil), Rovi advertising (USA), CJ TMall (South Korea); T-commerces from left to right (bottom): Domino (USA), H&M (USA), IcueTV (USA), History shop (USA), This.co (South Korea)

We used these t-commerce interfaces as bases for designing prototypes and for exemplifying the posture pattern developed in this paper. In brief, all the presentation models [13] fits to each t-commerce application illustrated, however we notice that some of them have different contexts that could not fit very well to this categorization. We believe that another set of t-commerce types can be better than the current model.

4 Method and Techniques

We developed the t-commerce pattern based on user experience research (focus group & experimental testing with video demonstrations) and existing t-commerce applications. All study volunteers signed consent forms before the beginning of each study and all sessions were recorded using a video camera.

In order to select the appropriate participants (sample) for focus group and experiments, preliminary criteria were defined. The volunteers recruited must have made at least one online purchase, and there were not any distinction on gender, age, education level or income. This profile allowed us to understand the expectations of t-commerce users. It is worth mentioning that the digital t-commerce at Brazil is not as popular as other countries, like UK or USA. Thereby, we believe the selected sampling is good to collect the expectations and responses about the anticipated use of t-commerce.

Useful anticipated experiences were collected, such as expectations on how t-commerce works and how it should behave for users. After this study, we design an experiment in order to validate the users’ statements collected.

4.1 Focus Group

Focus group is a technique that collect feelings, beliefs and opinions about a given subject through collective interview composed of seven to twelve participants. It is a discussion led by a moderator using a script with predetermined topics.

There were 25 volunteers for the three focus groups sessions, in which 17 were male and 8 female. The groups are heterogeneous comprising different ages. Half of the participants (50 %) were between the ages of 18–24 years old, more than a third (38 %) were between the ages of 25–30 years old, 8 % were between the age of 31–45 and a very small number (4 %) were over 45 years old. They are from different professional areas (social communication, design, education, architecture, banking, computer science, social science, sales and account executive). Three focus groups sessions were performed as can be seen in Fig. 2 below.

Fig. 2.

Focus groups sessions

First, the sessions started with an introduction about t-commerce. Second, participants were asked about their expectations and ideas about the possibility to do shopping on TV using remote control. Then, they were asked about how a t-commerce works for them, questions such as: How to purchase an offer? How to interact and how to pay? Third, the participants wrote keywords or statements about their feelings and requirements that are important to do television commerce on sticky notes. Fourth, participants watched some video demonstrations of t-commerce and commented about them. Finally, participants were thanked for coming and helping.

4.2 Experimental Testing with Video Demonstrations

In order to understand hypothesis about the television commerce types that arouse on the focus group sessions, we designed an experiment that consists of two steps. First, an introduction about t-commerce was presented to a volunteer. Second, a pair of t-commerce videos demonstrations were shown and the participant was enquired to comment about what he had seen on these videos.

In this experiment, the independent variable are the t-commerce types and the users’ statements are the dependent variable. The controlled variable are the same goods presented on a set of video demonstrations. For instance, a certain company’s jeans is offered in both t-commerce situations sales channel and interactive advertising.

To ensure a fair test, we looked for videos with products that were possible to fit different t-commerce types as possible. Thereby, nine videos demonstrations were designed as illustrated in Fig. 3.

Fig. 3.

(A) C&A Fergie Jeans 1 -virtual mall, (B) C&A Fergie Jeans A2 - virtual mall, (C) C&A Fergie Jeans – related TV program 1, (D) C&A Fergie Jeans - related TV program, (E) I-Steamer Conair – virtual mall 1, (F) I-Steamer Conair - interactive advertising, (G) I-Steamer Conair - enhanced infomercial, (H) TopTherm - related TV program, (I) TopTherm - enhanced infomercial

We group the videos in pairs with different t-commerce types, in order to make a contrast among them. Videos were organized in six pairs: (A + C), (E + G), (H + I), (B + D), (C + D) and (F + G).

The experiment was performed using a laptop with a voice recorder software and connected to the HDMI input of digital TV (32” LCD). There were 8 volunteers, in which 4 males and 4 female from different professional area, age and background (computer science, sales, fashion entrepreneur, management, architecture, account executive, designer and advertiser). 3 out of 8 volunteers were between ages 18–24, the same number of volunteers were between ages 25–30 years old and a small minority (2 out of 8) were between 31–45 years old.

4.3 Design Pattern Template

A data analysis was performed using recorded videos from both UX research (focus group and experiment). A transcription of each participants’ statement was performed and they were categorized into related groups, then each group of assertions were summarized into a short description of problem or proven solution.

The results were organized on pattern template that we built on the structure of Kunert [15] and Obrist [16]. We describe each result in pattern structure described as follow.

• NAME: The name identifies the content presented in the pattern.

• CONTEXT: The context describes the use of the design pattern in the workflow of designing a t-commerce application.

• PROBLEM: The problem is formulated from user perspective and is related to how do users expect a certain system works. This pattern element is filled with results collected from focus group sessions in this research.

• SOLUTION: It provides alternative solutions for the design problem. Each solution is a core of solution that the designer has the freedom to implement in many ways. This field is filled out with user expectations results collected during the experimental testing, literature review and existing t-commerce application analyses.

• EVIDENCE: It provides where the solution came from. This field can be filled out with references to other literatures or results UX research results.

• EXAMPLES: Screenshots of existing t-commerce application and prototypes that show approaches to solve the design problem addressed.

5 Posture Design Pattern for Television Commerce

In this section, the knowledge gleaned from UX research, existing t-commerce application and other design guidance for t-commerce are summarized and presented on a design pattern template. The main posture pattern is illustrated below and the workflow continues according to the selected proven solution, in the following subsections.

PATTERN: Choose a t-commerce type.

CONTEXT: Designer has to decide how to sell a product on IDTV through a t-commerce application that solve his project and user requirements.

PROBLEM: There are four different t-commerce types for different goals: Related TV program, Interactive Advertising, Enhanced Infomercial, Virtual Mall SOLUTION: Choose the t-commerce type according to your business goals:

• (A) Related TV Program: If your goal is to convert a product placement¹on a direct sell, this type is the solution.

• (B) Interactive Advertising: If your goal is offer products, which is easy for impulse shopping, such as exclusive offer, air tickets, food, you should follow this type.

• (C) Enhanced Infomercial: If your goal is increase conversion sales rates during the infomercials,² this t-commerce type is the solution for it.

• (D) Virtual Mall: If your goal focuses on selling offers (products or services), a variety of products and details through a t-commerce application that can be used whenever you want or during a long time interval, then this type of t-commerce is the solution and it can be combined with the other types.

EVIDENCE: Participants of focus group reported the three t-commerce presentation models [13]. They also expect that a t-commerce can be available to interact whenever they want or, at least, for a long time interval (Virtual Mall). EXAMPLE: (Fig. 4).

Fig. 4.

T-commerce types: (A) Related TV program [13], (B) Interactive advertising, (C) Enhanced infomercial, (D) Virtual mall

5.1 T-Commerce Type (A): Related TV Program

PATTERN: Related TV program.

CONTEXT: The design requirement is to improve the user experience by selling products or services presented on a product placement during a TV program, such as soap operas, movies, series, talk shows, etc.

PROBLEM: A product placement linked to a t-commerce application during a TV show may not satisfy everyone, because the viewer focus might be on the TV show instead of the t-commerce application. However, some of them are willing to buy the offer advertised.

SOLUTION: The application could offer a good or service through a product placement.

• If the TV show has a plot and narrative story such as soap operas, movies or TV series, t-commerce should be done during commercial breaks. A ‘saving’ (or skipping) key [17] can keep a summary of content related products for later viewing. However, the access to the application for impulse shopping could also be available.

• If the TV show or scene does not need full focus of viewer, such as talk shows, the t-commerce application can be available for viewers during the TV program.

EVIDENCE: 4 out of 8 participants reported that they and other people would not like to change their focus, during a movie or soap opera, for doing shopping. Whereas the other half commented that the possibility to make a purchase during TV shows are interesting. Another evidence is the ad consuming method [17].

EXAMPLE: (Fig. 5).

Fig. 5.

This.co: related TV program t-commerce by Capstone media – South Korea

5.2 T-Commerce Type (B): Interactive Advertising

PATTERN: Interactive advertising.

CONTEXT: The project requirement is to design positive experiences by improving an advertising, in order to increase sales conversion rates through t-commerce application.

PROBLEM: Converting viewers into paying customers through t-commerce application. The time of TV advertising is too short for making a purchase.

SOLUTION: An advertisement provides a trigger that can be accessed instantly (typically one-click button) by the viewer. The t-commerce purchase process should have few steps to finish an online transaction. The content of advertising should motivate a viewer to purchase a product at the first few seconds. A t-commerce requires an extended time that can be possible in following ways:

• 60-sec TV commercial: The traditional 30-sec commercials should have an extended time more than the usual, to allow viewers to purchase an offer.

• Impulse response: An advertisement provides a trigger for t-commerce application, which can be accessed as soon as a user presses a button on a remote control. Depending of the TV business model, it does not affect the normal program flow.

EVIDENCE: 2 out of 8 volunteers notice that there is a relationship between TV advertising time and application time.

EXAMPLES: (Fig. 6).

Fig. 6.

H&M: interactive advertising t-commerce by delivery agent and HSM - USA

5.3 T-Commerce Type (C): Enhanced Infomercial

PATTERN: Enhanced Infomercial.

CONTEXT: The project requirement is to design positive experiences by improving an infomercial, in order to increase sales conversion rates through t-commerce application

.PROBLEM: Improve the conversion rates by converting viewers into paying customers through t-commerce application.

SOLUTION: The infomercial video should be visible to the viewers during users’ interaction with the t-commerce application for sales improvement. In this case, the video should be resized and positioned in one corner of the screen, thereby products’ testimonials and details can continue to inform and motivate the customers to purchase while they are using the IDTV application.

Whereas, infomercial has longer time than a TV advertising, the t-commerce application should present more details such as user reviews and technical product specifications to provide information that help customers to purchase the infomercial’s offer.

However, some people does not like this type of TV show and they reported that it is not good to force them to interact with t-commerce application.

EVIDENCE: 5 out of 8 volunteers pointed out the advantages of the convenience of purchasing a product offered on infomercials.

5 out of 8 volunteers reported that they do not like infomercial and to be forced to do an impulse shopping.

EXAMPLES: (Fig. 7).

Fig. 7.

HSN shop by remote - enhanced infomercial t-commerce by HSN & Comcast - USA

5.4 T-Commerce Type (D): Virtual Mall

PATTERN: Virtual mall.

CONTEXT: The design requirement is to sell a variety of products like e-commerce websites.

PROBLEM: This t-commerce type can disturb the viewers’ attention while they are watching a TV show. There are many possibilities to access a t-commerce virtual mall application. It can be combined with other t-commerce types or it can be available according to TV station business model.

SOLUTION: A virtual mall can sell products from the TV station, TV show or online retail company. It can be presented to users in following ways:

• Combined with Related TV Program Type: if the TV show has a plot and narrative story such as soap operas or TV series, the t-commerce can be done during commercial breaks. If the TV show does not need full focus of viewer, the t-commerce application can be available for viewers during the TV program.

• Infomercial Virtual Mall: When TV advertisers buy a time to broadcast their infomercial, they can offer a virtual mall in this period with other company’s products.

• TV Station Virtual Mall: A TV channel can offer their products categorized by TV show during the whole day (24/7), so the viewers can interact whenever they want.

• Retail Company Virtual Mall: Since traditional TV business model works selling time for broadcasting TV shows, a TV station could sell time to online retail companies to offer their product through a t-commerce application.

In some cases, the task could be focused on making a purchase, using a full screen application to do this. Since the goal is to do shopping, we can do it better on this interface like we do shopping in e-commerce websites.

EVIDENCE: Existing t-commerce application and UX research insights.

EXAMPLES: (Fig. 8).

Fig. 8.

History shop – Virtual mall t-commerce by history channel - USA

6 Conclusions

In this study, we developed a posture design pattern for t-commerce application based on user experience. We improve the Ghisi presentation models [13] adding a virtual mall t-commerce type based on the users expectations. Furthermore, the design pattern developed provides a template that presents a context, problem and proven solution, which help designers to make initial decisions about designing t-commerce applications focusing on good user experiences.

Each context of t-commerce application has different problems and different solutions to achieve positive experiences. We find problems and solutions based on the focus group, experiments results and existing t-commerce applications. These findings provide insights into the first activities of the top-down design for t-commerce applications projects.

Further studies will be necessary to develop a complete pattern language for t-commerce applications. A pattern language is collection of patterns that has a hierarchy structure classified on four levels [6]: Posture, experience, task and action. Our findings only highlight the posture level pattern. Therefore, the other remaining pattern levels will need to be developed further in future studies.