CHI 2019 Late-Breaking Work CHI 2019, May 4–9, 2019, Glasgow, Scotland, UK

ML-Process Canvas: A Design Tool to Support the UX Design of Machine Learning-Empowered Products

Zhibin Zhou Qing Gong Alibaba-Zhejiang University Joint Institute of Key Laboratory of Design Intelligence and Frontier Technologies, Zhejiang University Digital Creativity of Zhejiang Province Hangzhou, China Hangzhou, China [email protected] [email protected]

Zheting Qi Lingyun Sun Alibaba-Zhejiang University Joint Institute of Alibaba-Zhejiang University Joint Institute of Frontier Technologies, Zhejiang University Frontier Technologies, Zhejiang University Hangzhou, China Hangzhou, China [email protected] [email protected]

ABSTRACT1 Machine learning (ML) is now widely used to empower products and services, but there is a lack of research on the tools that involve designers in the entire ML process. Thus, designers who are new to ML technology may struggle to fully understand the capabilities of ML, users, and scenarios when designing ML-empowered products. This paper describes a design tool, ML-Process Canvas (see Fig. 1), which assists designers in considering the specific factors of the user, ML system, and scenario throughout the whole ML process. The Canvas was applied to a design project, and was observed to contribute in the conceptual phase of UX design practice. In the future, we hope that the Canvas will become more practical through continued use in design practice.

Permission to make digital or hard copies of part or all of this work for personal or classroom use is granted without fee provided that copies are not made or distributed for profit or commercial advantage and that copies bear this notice and the full citation on the first page. Copyrights for third-party components of this work must be honored. For all other uses, contact owner/author(s). CHI’19 Extended Abstracts, May 4–9, 2019, Glasgow, Scotland UK. © 2019 Copyright is held by the author/owner(s). ACM ISBN 978-1-4503-5971-9/19/05. DOI: https://doi.org/10.1145/3290607.3312859

LBW1420, Page 1 CHI 2019 Late-Breaking Work CHI 2019, May 4–9, 2019, Glasgow, Scotland, UK

KEYWORDS INTRODUCTION Machine learning; user experience; design tool; design method Machine learning (ML) is now widely used to improve the quality of user experience (UX) in existing products or service, and even to develop new forms of UX[14]. However, recent research indicates that UX designers are not sufficiently prepared to leverage ML capabilities[3]. Issues

such as the anthropomorphism[8] and interactivity of ML-empowered products bother designers because of the unpredictable and ever-changing nature of ML. Existing studies on the integration of UX and ML include attempts to understand users[1, 11] as well as design methods and processes [12, 13]. In particular, several researchers noted a lack of understanding of the user in the design of ML systems and advocated “power to the people”. These researchers allowed users to freely pick and modify the training data [1] or personalization labels [11] so that the ML systems could better understand the user preferences. The UX community also encouraged designers to involve users in the whole ML process, including data annotation, model construction, training, inference, and model updating, as a means of gaining valuable insights. Recent research offered some perspectives on the design value of ML [12] and demonstrated a design process without radically changing design activities. The process identifies the problem for ML to solve, validates technical feasibility of solution, and then iterates the ideation process [13]. The existing practice consists of reasonable methods that support the UX design of ML- empowered products, including valuing users, improving UX in the whole process of ML, and retaining familiar design activities. However, there was only limited research on specific UX issues related to ML and how to design interactions that may avoid such issues. Therefore, we present a brief summary of the issues we are aware of (see Fig. 2). In addition to the description of Holmquist et al. [6], who basically summarized almost all UX issues in the ML context, we also draw on the work of Yang et al. [13], Forlizzi et al. [4], and Dove et al. [3]. As ML technology is quite new to designers, they may be unaware of the information required to overcome the above UX issues, and may not have viable tools or methods for participating in the whole process of ML. However, there are different UX issues at various stages of the ML process, and overcoming these issues requires designers to participate in the entire ML process to Figure 1: ML-Process Canvas. understand how ML works and what innovations may be possible at each stage of the process. Therefore, the design tools should be tailored to the context of ML-related UX issues and should give designers the chance to participate in the entire ML process. Otherwise, designers will struggle to fully understand the limitations and capabilities of ML, and will have no suitable way of analyzing information about users and scenarios to deal with the specific UX issues. In this paper, we describe ML-Process Canvas (see Fig. 1) that assists designers in gathering essential information throughout the whole ML process without changing the familiar design activities. The Canvas identifies the specific UX issues caused by ML, and then summarizes the factors related to the user, scenario, and ML system that may influence those UX issues. The Canvas allows designers to organize and illustrate their findings related to those factors in order to seek potential design opportunities in the conceptual phase of UX design. Finally, we describe the application of the tool to a real design project and the feedback obtained for further improvement.

LBW1420, Page 2 CHI 2019 Late-Breaking Work CHI 2019, May 4–9, 2019, Glasgow, Scotland, UK

Figure 3: Persona cards (a) and ML-Process Canvas I (b).

ML-PROCESS CANVAS ML-Process Canvas consists of Canvas I and Canvas II. Canvas I maps the specific UX issues caused by ML to the whole ML process (see Fig. 3b), which reminds designers of the issues they need to work on at certain stages of the ML process. Designers can also write their final solutions on the corresponding issues cards (see Fig. 3a) after using Canvas II. The content of these issues cards is consistent with the content in Figure 2, and some issues will occur several times at different stages. Canvas II (see Fig. 4b) guides designers through the organization and analysis of the essential information related to the UX issues among the ML process. We divided the relevant information into three categories: user, system, and scenario. Designers need to list relevant information in different categories of columns at specific stages of the ML process, such as data annotation or inference. Furthermore, the listed information about the user, system, and scenario will be further discussed and analyzed to provide a technically viable solution that meets the needs of the user and scenario. Similar to using a journey map[7], designers can participate in various stages of the ML process during the conceptual phase of UX design to propose creative solutions that address the specific UX issues.

Figure 2: UX issues caused by ML. Figure 4: Persona card (a) and Canvas II (b).

LBW1420, Page 3 CHI 2019 Late-Breaking Work CHI 2019, May 4–9, 2019, Glasgow, Scotland, UK

Table 1: Factors Related to the Scenario Research on human factors, such as user traits, that influence interactions with intelligent Factor Brief description systems is quite common, but the relationships between these factors and the identified UX issues Societal Culture, political system, are somewhat complex. However, we found that users can imagine the type of ML system they impact aspirations concerning want if asked the right questions. Users can clearly state their opinions on the anthropomorphism, safety and the future.[2] control, and etc. of the ML system, and the reasons for their choices. Thus, we provided Persona Task types Cognitive aids, control cards for designers to summarize the expectations of these user issues (see Fig. 4a). Sometimes, aids or perceptual aids, designers encounter different users at different stages of the ML process, and these users etc. occasionally have completely different expectations. Designers need to record the results of their Physical Light, noise, location, etc. user research on the Persona cards, especially the user traits and their preferences for UX issues, environment and then consider this content along with the system and scenario factors in determining potential solutions.

Tables 1 and 2 summarize the factors related to the scenario and the ML system [10] Table 2: Factors Related to the ML System respectively, which may influence the UX issues. Designers are encouraged to list all available information about these factors at the corresponding stage of the ML process, as this allows Factor Brief description information to be collected and enhances their understanding of the scenario and ML systems. At Level of Predictability and stability the conceptual stage of UX design, ML systems with different attributes are optional, and the automation of automation[9]. scenario can be freely changed based on the design practice. This enables designers to carefully Capability Types of tasks that the ML select the appropriate ML system and application scenario by considering and discussing all trade- system can support. offs within the available information on the Canvas. After repeated discussions and analysis, the Aesthetics Aesthetic appearance, designers fill in the issues cards of Canvas I with the final solutions. Therefore, the Canvas can also which is related to be used by designers to share their ideas and solutions. automation likeability and use[8]. APPLICATION & EVALUATION Mode of Fixed, adjustable (e.g., set by co-control the user), or adaptive (e.g., ML-Process Canvas was applied to a design project in which essential technical support was accounts for user’s state)[5] provided, and was found to contribute in the conceptual phase, including the ideation and Hardware Power supply, internet, iteration of design practice. computing capability (e.g., Procedure Two instructors and 30 novice designers (junior design students, M: 17, F: 13) were GPU) involved in the design project under the theme of “ML-empowered interaction design” (see Fig. 5). Learning Amount and quality of These novice designers have mastered general design processes and design methods, can use ability required data, the difficulty design tools such as journey map, but have only a rough understanding of ML. The designers were of iterative training, and the split into six groups, with the two instructors offering guidance to every group. The instructors required computing explained the concepts of the Canvas, but were not responsible for the design process. resources, etc. The novice designers were introduced to the UX issues, the factors they needed to determine, and how the Canvas could be used. According to the topic of the group, the designers then gathered essential information about their users, the ML systems, and the scenarios from user research and market research. Furthermore, the designers discussed the trade-offs of the optional solutions regarding the target scenarios and users. Finally, the Canvas was used to exchange and evaluate design ideas. We collected feedback through interviews in which the designers were asked about the ease of use and utility of the Canvas, and how the proposed tool improved their understanding of ML.

LBW1420, Page 4 CHI 2019 Late-Breaking Work CHI 2019, May 4–9, 2019, Glasgow, Scotland, UK

Results At the end of the project, all six groups successfully produced designs varying from modular devices for distant family members to a virtual piggy bank for children. A completed Canvas is shown in Fig. 6a, including detailed information and solutions supporting the design of Cabe (see Fig. 6b), an AI robot that senses changes in human emotions and presents reactions to help users manage their emotions and achieve a nice learning experience. In the case of Cabe, the users are parents and children who are curious about possible feedback and are quite willing to cooperate with a ML system. As this scenario is not private and the ML system is offline, users would not refuse to share the facial data that help the robot monitor the emotions of children. Furthermore, the learning process and the data-marking process were integrated in an interactive game, because it is the children who contribute the data. However, the existing ML system cannot ensure that the outputs are always correct, so the reactions of the ML system are designed to be unobtrusive. Unobtrusive reactions such as shaking ears and facial expressions are used to interact with children, because these reaction types do not interrupt their study, even though the ML system may sometimes have failed. To support real-time interaction Figure 5: Working with ML-Process Canvas. between Cabe and human users, a tiny ML accelerator with a low-power architecture, called a Movidius neural compute stick, is used to decrease the delay caused by the insufficient computing

performance. From the interviews, we found that the Canvas helped almost all designers to imagine excellent ways to solve the UX issues. Nearly all the designers gained an increased understanding of ML after completing the Canvas, and learnt a lot about UX issues related to ML through analyzing and sharing the Canvas. By using the Canvas, they also gained a totally different perspective on the UX design of ML-empowered products, such as how to obtain appropriate data and how to involve users in improving a ML system. However, the feedback we obtained identified some limitations of the Canvas. Some designers stated that the expectation mapping of the Persona cards was challenging. To obtain meaningful insights, the users need to be well aware of the UX issues, so some of the designers used a storyboard to help users gain an increased understanding of the issues they were likely to encounter. In addition, the factors regarding the ML system and scenario were slightly ambiguous. The designers sometimes had a different understanding of the factors, so a lot of time may be spent determining how these factors influence the UX issues. Moreover, the ML process was still quite abstract for the designers, especially when they want to match a certain step of the ML process to the corresponding stage of the product lifecycle when finding a solution.

CONCLUSION AND FUTURE WORK In summary, the ML-Process Canvas helps designers to seek innovative opportunities in UX design Figure 6: Completed ML-Process Canvas by considering specific factors related to the user, ML system, and scenario throughout the whole (a) and Cabe (b). ML process. We applied the tool to the design project and found that the tool guided designers to ask the right questions and investigate the necessary information for UX design. Though our work is at an early stage, it takes us closer to leveraging ML in the UX design of ML-empowered products.

LBW1420, Page 5 CHI 2019 Late-Breaking Work CHI 2019, May 4–9, 2019, Glasgow, Scotland, UK

ACKNOWLEDGMENTS In the future, we will improve the Canvas according to the collected feedback. Most Project supported by the National importantly, we will study how the user, ML system, and scenario affect related UX issues, and Natural Science Foundation of China provide clear and detailed forms for designers to complete. Second, more hints and completed (No. 61672451), the National Basic Canvas examples will be provided to help designers learn about ML-related concepts and work Research Program (973) of China (No. with the Canvas. Finally, we hope that the Canvas will become more practical as designers become 2015CB352503), Zhejiang Provincial Key involved in its development and through continued use in design practice. Research and Development Plan of Zhejiang Province (No. 2019C03137), REFERENCES and the Alibaba-Zhejiang University [1] Saleema Amershi, Maya Cakmak, William Bradley Knox, and Todd Kulesza. 2014. Power to the people: The role of Joint Institute of Frontier Technologies. humans in interactive machine learning. AI Magazine, 35(4), 105-120. https://doi.org/10.1609/aimag.v35i4.2513 [2] Haydee M Cuevas, Stephen M Fiore, Barrett S Caldwell, and Strater Laura. 2007. Augmenting team cognition in human-automation teams performing in complex operational environments. Aviation Space & Environmental Medicine, 78(5), B63-B70. [3] Graham Dove, Kim Halskov, Jodi Forlizzi, and John Zimmerman. 2017. UX Design Innovation: Challenges for Working with Machine Learning as a Design Material. In Proceedings of the 2017 CHI Conference on Human Factors in Computing Systems. ACM, Denver, Colorado, USA, 278-288. DOI: https://doi.org/10.1145/3025453.3025739 [4] Jodi Forlizzi, John Zimmerman, Vince Mancuso, and Sonya Kwak. 2007. How interface agents affect interaction between humans and computers. In Proceedings of the 2007 conference on Designing pleasurable products and interfaces. ACM, 209-221. DOI: https://doi.org/10.1145/1314161.1314180 [5] Peter A. Hancock and Mark H. Chignell. 1988. Mental workload dynamics in adaptive interface design. IEEE Transactions on Systems Man & Cybernetics, 18(4), 647-658. https://doi.org/10.1109/21.17382 [6] Lars Erik Holmquist. 2017. Intelligence on tap: artificial intelligence as a new design material. Interactions, 24(4), 28-33. https://doi.org/10.1145/3085571 [7] Tharon Howard. 2014. Journey mapping: a brief overview. Commun. Des. Q. Rev, 2(3), 10-13. https://doi.org/10.1145/2644448.2644451 [8] Yung-Ming Li and Yung-Shao Yeh. 2010. Increasing trust in mobile commerce through design aesthetics. Comput. Hum. Behav., 26(4), 673-684. https://doi.org/10.1016/j.chb.2010.01.004 [9] Stephanie M Merritt, Heimbaugh Heather, La Chapell Jennifer, and Lee Deborah. 2013. I trust it, but I don't know why: effects of implicit attitudes toward automation on trust in an automated system. Human Factors, 55(3), 520-534. https://doi.org/10.1177/0018720812465081. [10] Kristin E Schaefer, Jessie YC Chen, James L Szalma, and Peter A Hancock. 2016. A meta-analysis of factors influencing the development of trust in automation: Implications for understanding autonomy in future systems. Human factors, 58(3), 377-400. https://doi.org/10.1177%2F0018720816634228 [11] Molly Wood. Hopes to Serve Up Music in a Novel Way. Retrieved December 27, 2018 from http://nyti.ms/1fr8LY5 [12] Qian Yang, Nikola Banovic, and John Zimmerman. 2018. Mapping Machine Learning Advances from HCI Research to Reveal Starting Places for Design Innovation. In Proceedings of the 2018 CHI Conference on Human Factors in Computing Systems. ACM, Montreal QC, Canada, Paper No. 130. DOI: https://doi.org/10.1145/3173574.3173704 [13] Qian Yang, Alex Scuito, John Zimmerman, Jodi Forlizzi, and Aaron Steinfeld. 2018. Investigating How Experienced UX Designers Effectively Work with Machine Learning. In Proceedings of the 2018 Designing Interactive Systems Conference. ACM, Hong Kong, China, 585-596. DOI: https://doi.org/10.1145/3196709.3196730 [14] Qian Yang, John Zimmerman, Aaron Steinfeld, and Anthony Tomasic. 2016. Planning Adaptive Mobile Experiences When Wireframing. In Proceedings of the 2016 ACM Conference on Designing Interactive Systems. ACM, Brisbane, QLD, Australia, 565-576. DOI: https://doi.org/10.1145/2901790.2901858

LBW1420, Page 6