61
Designing a non-distractive center-stack interaction Christoffer Kopp December 7, 2010 Master’s Thesis in Computing Science, 30 credits Supervisor at CS-UmU: H˚ akan Gulliksson Examiner: Per Lindstr¨ om Ume ˚ a University Department of Computing Science SE-901 87 UME ˚ A SWEDEN

Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

  • Upload
    others

  • View
    10

  • Download
    0

Embed Size (px)

Citation preview

Page 1: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

Designing a non-distractivecenter-stack interaction

Christoffer Kopp

December 7, 2010Master’s Thesis in Computing Science, 30 credits

Supervisor at CS-UmU: Hakan GullikssonExaminer: Per Lindstrom

Umea UniversityDepartment of Computing Science

SE-901 87 UMEASWEDEN

Page 2: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December
Page 3: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

Abstract

Car brands are today competing over having the most advanced technology intheir cars. The drivers today control the stereo which include radio, CD, MP3and satellite radio. They also control the climate, the GPS, surf the Internetand show a DVD for the kids in the backseat and so much more from the center-stack. All these functions have clattered the center-stack with buttons, ”smart”interaction knobs as well as scroll wheels. The buttons feel the same andthereby force the driver to change focus from the main-task, which is driving,to the center-stack. The same attention demanding situation are with theinteraction knobs. In order to see the feedback the interaction knob provides,the driver needs to look at a screen located somewhere in the center-stack.World wide driver inattention causes around 60.000 deaths each year. Thismaster-thesis describes the process of designing a non-distractive center-stackinteraction. The reader will be introduced to the background of the problem,the different design suggestions that were taken into consideration as well as agiven full presentation of the final result. The paper also presents an in-depthstudy that provides a few guidelines for designing a detached touchscreen inputfrom output.

Page 4: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

ii

Page 5: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

Contents

1 Introduction 1

2 Problem description 3

2.1 Assignment . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4

2.2 Methods . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4

2.3 Related work . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6

2.3.1 Competitive in-vehicle information systems . . . . . . . 6

2.3.2 Different types of interaction . . . . . . . . . . . . . . . 7

3 Designing a touchscreen with detached output 11

3.1 Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11

3.1.1 The future of touch displays . . . . . . . . . . . . . . . . 12

3.2 Touch display interaction . . . . . . . . . . . . . . . . . . . . . 13

3.3 Detached input and output . . . . . . . . . . . . . . . . . . . . 14

3.3.1 Overall design patterns . . . . . . . . . . . . . . . . . . 14

3.3.2 Design patterns specific for detached input and output . 15

3.3.3 Touchkeyboard interaction . . . . . . . . . . . . . . . . 16

3.4 Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17

4 Design work 19

4.1 Needs and requirements . . . . . . . . . . . . . . . . . . . . . . 20

4.2 Finding the right interaction concepts . . . . . . . . . . . . . . 22

4.3 Building the car-simulator . . . . . . . . . . . . . . . . . . . . . 25

4.4 User tests . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26

4.5 Design iterations . . . . . . . . . . . . . . . . . . . . . . . . . . 28

4.5.1 Colors . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29

4.5.2 Animations . . . . . . . . . . . . . . . . . . . . . . . . . 31

4.6 Implementation . . . . . . . . . . . . . . . . . . . . . . . . . . . 31

iii

Page 6: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

iv CONTENTS

5 Results 33

5.1 Menu design . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 33

5.1.1 Colors . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34

5.2 The interaction flow . . . . . . . . . . . . . . . . . . . . . . . . 35

5.3 Remaining issues . . . . . . . . . . . . . . . . . . . . . . . . . . 37

6 Conclusions 39

6.1 Test-bed . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39

6.2 Animations . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39

6.3 Future work . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40

7 Acknowledgments 43

References 45

A Scenario 49

B Personas 51

B.1 Persona 1, primary persona . . . . . . . . . . . . . . . . . . . . 51

B.2 Persona 2, secondary persona . . . . . . . . . . . . . . . . . . . 51

B.3 Persona 3, secondary persona . . . . . . . . . . . . . . . . . . . 52

Page 7: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

List of Figures

2.1 The car-simulator. . . . . . . . . . . . . . . . . . . . . . . . . . 5

2.2 Audi MMI System and BMW iDrive. . . . . . . . . . . . . . . . 6

2.3 Ford myFord. . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7

2.4 1st and 2nd generation iDrive Knob. . . . . . . . . . . . . . . . 8

3.1 The interface of the 8pen concept. . . . . . . . . . . . . . . . . 17

3.2 The interface of the Swype concept. . . . . . . . . . . . . . . . 17

4.1 The design process. . . . . . . . . . . . . . . . . . . . . . . . . . 19

4.2 Citroen C6 and Volvo S80. . . . . . . . . . . . . . . . . . . . . . 21

4.3 Volkswagen Passat and Toyota Prius. . . . . . . . . . . . . . . . 21

4.4 Ford myFord. . . . . . . . . . . . . . . . . . . . . . . . . . . . . 22

4.5 The speech, write and pie concepts that were under considera-

tion after the second workshop. . . . . . . . . . . . . . . . . . . 24

4.6 One of the UI-flows that was created for my system. . . . . . . 25

4.7 The third workshop. . . . . . . . . . . . . . . . . . . . . . . . . 25

4.8 The first steps towards a car-simulator. . . . . . . . . . . . . . 26

4.9 The finished car-simulator. . . . . . . . . . . . . . . . . . . . . 27

4.10 Conducting a user test. . . . . . . . . . . . . . . . . . . . . . . 27

4.11 The low-fi test setup. . . . . . . . . . . . . . . . . . . . . . . . . 28

4.12 Mid-fi, climate menu and fan slider activated. . . . . . . . . . . 29

4.13 Two different designs regarding highlighted icon in a pie menu. 29

4.14 Highlighted green and orange icon in a pie menu. . . . . . . . . 30

4.15 Main menu old design. . . . . . . . . . . . . . . . . . . . . . . . 30

4.16 Orange outlined icon and purple outlined icon. . . . . . . . . . 31

4.17 Green filled icon and black outlined icon. . . . . . . . . . . . . 31

5.1 Screenshot of the main menu. . . . . . . . . . . . . . . . . . . . 33

v

Page 8: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

vi LIST OF FIGURES

5.2 Screenshot of the climate menu. . . . . . . . . . . . . . . . . . . 34

5.3 Screenshot of the fan placement menu. . . . . . . . . . . . . . . 34

5.4 Black outline and green background . . . . . . . . . . . . . . . 35

5.5 The colors that were finally chosen. . . . . . . . . . . . . . . . . 35

5.6 Gesture feedback. . . . . . . . . . . . . . . . . . . . . . . . . . . 36

5.7 The touch display visualization. . . . . . . . . . . . . . . . . . . 37

A.1 Chevrolet AVEO5, 2010. . . . . . . . . . . . . . . . . . . . . . . 50

A.2 Audi A8, 2010. . . . . . . . . . . . . . . . . . . . . . . . . . . . 50

B.1 Persona 1. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52

B.2 Persona 2. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 53

B.3 Persona 3. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 53

Page 9: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

Chapter 1

Introduction

From a quick glance at a center stack of today’s more high-tech cars one cansee multiple buttons or a touchscreen with multiple buttons on and around it.All the buttons look and feel the same and demand full visual attention fromthe driver in order to interact with it.

The question that this thesis is trying to answer is; ”can it be possible tointeract with the in-car technology and get feedback without being distractedwhilst driving?” In order to answer the question a prototype has been developedtogether with The Astonishing Tribe in Malmo. The prototype allows the driverto control the in-car climate in a non-distracting way.

The Astonishing Tribe, TAT is a Swedish software technology and designcompany offering products and services that enhance the user experience ofportable devices. TAT is also working on creating rich user interfaces for theautomotive industry, and were thereby interested in the thesis question.

The thesis report is divided into seven chapters.

– Chapter 1, ”Introduction”, shortly introduces the report and work donein the thesis.

– Chapter 2, ”Problem description”. This chapter gives the reader a fullunderstanding to the nature of the problem. The chapter also describesthe different methods that were used during the development of the pro-totype. In the last section of the chapter related work will be presentedto the reader.

– Chapter 3, ”Designing a touchscreen with detached output”, is an in-depth study about what to have in mind when designing a touch interfacewith detached output.

1

Page 10: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

2 Chapter 1. Introduction

– Chapter 4, ”Design work”, describes in detail the practical work thathave been done in the thesis.

– Chapter 5, ”Results”, presents the outcome of the practical work.

– Chapter 6, ”Conclusion”, brings forward important personal realizationsand points of interests.

– Chapter 7, ”Acknowledgments”, credit to people at TAT and Umea Uni-versity who has helped during this thesis.

Page 11: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

Chapter 2

Problem description

Sometime during the early nineties the car cluster and center stack changed.One major change was that the number of in-car technologies increased byseveral hundred percent, from a few settings such as temperature, fan andradio to GPS, in-car climate, CD, MP3 and so on. With the introduction ofmore and more technology the number of buttons on the center stack explodedsince the car industry still went in the direction of one button per function.After some time car manufactures realized that the situation was unbearableand introduced different systems that would simplify the interaction with thein-car technologies. These systems have one major shortcoming; the drivernow has the possibility to change almost every aspect of the car. So insteadof decreasing the drivers’ distractions they have increased it. A quick lookat the innovations regarding the car shows that the way to interact with thecar technology has not developed in the same pace as the rest of the in-cartechnology development.

To understand the impact this distraction situation has on the drivers’ onemay look at the figures that the WHO (World Health Organization) releasedin 2004 regarding what causes the most deaths throughout the world. Atfirst place came coronary heart diseases (7.20 million deaths), at sixth placecam HIV/AIDS (2.04 million deaths) and already at ninth place came roadtraffic accidents (1.27 million deaths). Of these 1.27 million deaths around 25percent of all car accidents involved some form of driver inattention[1]. Of these300.000 deaths about 20 percent were due to adjusting the music, talking in acell phone or interaction with some other device brought into the car. Thesenumbers shows the importance of finding a new kind of interaction type to thein-car technology. There is also of great importance to be able to present theinformation in such a way that the drivers focus still remains on the main task,which is driving.

3

Page 12: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

4 Chapter 2. Problem description

2.1 Assignment

The assignment for this thesis was to find an innovative way to interact withthe in-car technology and do this in such a way that it does not distract thedriver from the main task, which is driving.

After the first meeting with the TAT thesis supervisor it was decided thatthe thesis should focus on creating guidelines when designing an interface forcars that uses several different displays. Once the background phase started tofind out what has been done in the automotive business concerning this topic,one major issue was discovered. There is no easy and safe way to interact withthe in-vehicle infotainment system. This realization made the thesis go in adifferent direction.

Together with the TAT supervisor it was decided that the thesis should bedivided into two parts;’create an innovative interaction type and present theinformation in a non-distractive way.’

At an early stage decisions were made that the system would only handlethe in-car climate system, since that menu is shallow and of low complexity.Even if the safety issue is of great importance in this kind of projects no extrafocus was added to the safety issue. Instead the design followed the principles;

– A lot of information + difficulties to interact = hazardous driving situa-tion.

– Contextual information + easy to interact = safe driving situation.

The reason that safety was left out of the innovation process was due tothat it easily constrains and stalls the innovation process.

2.2 Methods

In order to have a satisfying work flow throughout the thesis a time schedulewith weekly deadlines were written. To start with a competitive analysis wasperformed both on the Internet and using field studies. This was done inorder to see what the market has to offer in in-car technology systems andwhat the pros and cons are with these different systems. This analysis gavea solid background and pointed out major interaction and display issues thathad to be taken care of. The background phase was followed by a sketch andinnovation phase. In this, multiple ideas and thoughts were put down to paper,covering everything from different kinds of interaction types to different typesof visualizations and different places to display the information. The ideaswere discussed and handled in different meetings in order to pick out the mostinteresting ones. Once the most interesting interaction type and display optionwere found the design phase started. Here the focus was not on the graphicaldesign but more on interaction design since the interaction design is the overallfocus of the thesis. It became obvious that without a proper test-bed the

Page 13: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

2.2. Methods 5

prototype would not be as good as it could be. This realization resulted in acar-simulator (see Figure 2.1).

Figure 2.1: The car-simulator.

As soon as the car-simulator was finished user testing started, the testswere done by the think-out-loud technique. This is a technique that encouragethe test persons to describe in words what they are doing and why they aredoing it. Think-out-loud creates a better understanding of how the prototypebehaves and is perceived by the test persons. The next phase in the realizationof the thesis was the implementation phase. The implementation followed theSCRUM technique.

The implementation was made in the TAT Motion Lab. Motion Lab isdescribed by TAT in the following words: ”TAT Motion Lab is an XML devel-opment environment for TAT Cascades. It speeds up the process of craftingrich user interfaces. TAT Cascades is a UI framework for the production of ad-vanced user interfaces. TAT Cascades makes it possible to quickly and easilycreate and customize unique user interfaces with unmatched graphical capabil-ities, giving consumers a richer and more dynamic experience.” [2].

The graphic was done in Adobe Illustrator version 12. The overall workfollowed a model of the design process (Figure 4.1) and was continuously doc-umented in a thesis diary.

The last phase of the thesis work was an in depth study. This study wasdone in order to get a better understanding of the car industry and to increasemy chances for further employment at TAT.

Page 14: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

6 Chapter 2. Problem description

2.3 Related work

In this section related work will be highlighted. As described in 2.1 the thesisproject is divided in two parts; interaction with the in-vehicle climate functionsand displaying the feedback in a non-distractive way.

These two parts are in this chapter viewed from into three perspectives.

1. Competitive in-vehicle information systems.

2. Different types of interactions.

3. Head-up display versus head-down display

2.3.1 Competitive in-vehicle information systems

In the market today there are several solutions for the in-vehicle informationsystems (IVIS) problem. BMW has the iDrive system (Figure 2.2, right) andAudi (Figure 2.2, left) use a similar interaction technique in their MMI (MultiMedia Interface) system. They both have a multifunctional knob on the centerstack. With this knob and several different buttons the driver can navigatethrough an advanced menu to control everything from the GPS to how longthe light should be left on after that last car door have been closed. Both thesesystems forces the driver to look at a screen located on the center stack, whichremoves focus from the main task, which is driving.

Figure 2.2: Audi MMI System and BMW iDrive.

Page 15: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

2.3. Related work 7

What both BMW and Audi have done with these systems is to create a wayto interact with multiple different parts of the IVIS from just one place, theinteraction knob. There are a few other interaction types on the way (Lexushas one), but none has been released on the market yet. Which makes themimpossible to test.

In 2011 Ford will release their new in-car technology system, called myFord(Figure 2.3). The most interesting aspect about this system is that it usesa touchscreen for the interaction. This screen is located on the center stack.With this system Ford has properly introduced touchscreens to the automotiveindustry. Ford is the first car brand that relies only on a touchscreen for theirIVIS. Several other car brands have a touchscreen but only as a complementto button interaction.

Figure 2.3: Ford myFord.

2.3.2 Different types of interaction

In this section the BMW iDrive system will be introduced and briefly discussed.The section is also introducing two different types of touchscreens interactions,both of which could be used in the automotive industry.

BMW iDrive

As earlier stated BMW uses a multifunctional knob for the interaction withtheir IVIS (Figure 2.4). BMW was the first car brand that used this kind ofinteraction device. With the BMW iDrive first generation they shocked the carindustry, introducing the concept ”on dial to rule them all”. It uses just oneknob and nothing else [3]. This system was presented in 2001 and was a totaldisaster. All of a sudden the driver had the opportunity to change and controlover 700 functions, and just one knob to do it with. So to change somethingin the IVIS the driver had to maneuverer through endless lists to find theright menu. This created a terrible driving situation and driving experiencesince it forced the driver to look at the center stack display for a very long

Page 16: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

8 Chapter 2. Problem description

time to find the right menu. This complex and almost rootless navigation treealso made the driver really frustrated which created a stressed and potentiallydangerous driver. BMW soon realized that the iDrive was impossible to useand released several updates to the system. One major thing that changedduring the different updates was that instead of just using a knob, shortcutbuttons were added as well. These shortcut buttons created a much better andeasier to use iDrive system, but once again several buttons were are added tothe center stack. So instead of removing all the buttons from the center stackBMW had introduced new buttons and a much more high tech and distractinginfotainment system.

Figure 2.4: 1st and 2nd generation iDrive Knob.

Touchscreen interaction

In this section two interesting types of touchscreen interactions will be intro-duced and briefly discussed. These two interaction types are of great interestsince they as shown by experiments, may create a safer driving interaction.One interesting touchscreen interaction type is the pie menu interaction. Thepie menu is a menu that emerges wherever the user press down his/hers fingerat the touchscreen. The pie menu is shaped as a half circle around the finger,to choose an icon in the menu the user just drags his/hers finger over the iconand releases his/hers finger anywhere on the screen. R. Ecker et al. shows intheir study [4] that touch interactions that are based on a pie menu gives lessdistraction then a simple touch system. This is because when the user has be-come familiar with the system and learnt to navigate it he/she does not have tolook at the menu since the muscle memory remember where the different iconsare placed, which enables a blind interaction. Their study also shows that thepie menu has a steep learning curve but when the user is used to the systemthe interaction is significantly faster than using a simple touch list system. Astudy made in 2009 shows another interesting touchscreen interaction [5]. The

Page 17: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

2.3. Related work 9

scenery for this interaction is that there is a touchscreen mounted on the steer-ing wheel and the feedback for the input is presented on the dashboard. Whatthe driver can do with this touchscreen is to write the letters to the destinationhe/she wants to go to using the GPS system. In the study the authors showthat text input on the steering wheel makes the driver drive a little bit slower(up to 5 percent) and that the number of corrective actions are up to 25 percentless than text input on the center stack. These numbers gives a hint that inputon the steering wheel may create a safe driving situation. The authors end thepaper by saying that presenting the text input feedback on a head–up displaymay create an improved driving situation [5].

Head-up display versus head-down display

Today most in-car information is presented on so called head-down displays(HDD). These are often placed in the center stack or in the cluster. Every timethe driver interacts with the in-car system or needs to get some informationregarding the car he/she must removes his/hers eyes from the road. This createsa hazardous driving situation and the result could be a car accident. So, couldthe information be displayed at some other, safer place? Several studies [6],[7] show that the use of head-up display (HUD) creates less distraction for thedriver and thereby a safer driving situation. Some of the advantages for theHUD are that the interface output is very close to the drivers’ main focus, whichis the road. This results in less eye–from–the–road time. One additional benefitof the HUD is that there is a shorter accommodation time for the driver sincethe eyes do not have to focus on information that is very close to the driver,such as on the center stack. A major positive issue for the HUD is that it hasa very high user acceptance. Studies has also shown that by using HUD lessaccidents occurs [7].

Of course there are some setbacks with the HUD, as there are with every-thing around us. The most important issue is that the HUDs of today doesnot provides optimal contrast in every light condition [6], but there are majorresearch on this issue so solutions to this problem are not far away [8]. Anotherissue about HUD is that if there are information overload in the HUD, espe-cially with text output, there could be a cognitive capture effect [7]. Cognitivecapture is when the driver is too focused on an instrument and not on thewhole environment [9].

Overall the studies show that if a HUD is used in the right way, it gives amuch better and safer driving situation [6]. The main reason for this is that itminimizes the time that drivers keep their eyes off the road.

Page 18: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

10 Chapter 2. Problem description

Page 19: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

Chapter 3

Designing a touchscreenwith detached output

3.1 Introduction

When designing a detached input/output touch display system one could learnfrom the other interaction possibilities that are on the market today. Thisin-depth study will introduce different kinds of interaction devices and give afew guidelines that should be taken into account when designing a detachedinput/output touch display system for the automotive industry.

In order to discuss different types of interaction one should first define theword interaction. Richard Buchanan defines it in the following way; ”interac-tion is a way of framing the relationship between people and object designedfor them – and thus a way of framing the activity of design” [10]. All objectsaround us can be interacted with, not just computers.

Just as important as to know the meaning of the word interaction is tounderstand the meaning of the word feedback. According to Donald Normanthe word feedback is about sending back information about what action hasbeen done and what has been accomplished [11]. There are different types offeedback; audio, tactile, visual and of course combinations of these. Audiblefeedback is that the user gets some kind of sound feedback when interactingwith the system and the visual feedback is that something happens on thescreen when interacting with the system. Tactile feedback, also known as hapticfeedback, is that the user sense the feedback. For example, with a touch displaythe user feels a vibration when pressing on a virtual button, the vibrationindicates that the button has been pressed.

On the market today there are several different types of interaction, someof them are; the keyboard and mouse interaction, the tangible user interfaceinteraction and the touch display interaction.

The keyboard and mouse follows a paradigm that Beaudouin-Lafon [12]

11

Page 20: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

12 Chapter 3. Designing a touchscreen with detached output

calls the computer-as-tool paradigm. What this paradigm says is that theuser uses an instrument to directly manipulate something on the screen. Inorder to interact with the interface the user first need to learn a secondaryinstrument. Both the keyboard and the mouse interaction follow the computer-as-tool paradigm.

The keyboard uses a one-to-one mapping, which is that a certain button onthe keyboard represents a certain letter, number or special character. The usercan just by looking at the keyboard interpret what will happen when a certainbutton is pressed. When pressing a letter on the keyboard that letter does notoccur at the keyboard but instead on another display. The computer mousewas invented in 1964 [13]. What the user has to learn about the mouse is thata certain movement with the mouse represents a corresponding movement onthe computer screen. For novice users this could be pretty hard to understand.One other thing that is a bit confusing and hard to learn is that the effect frompressing a mouse button could change from time to time, depending on wherethe mouse pointer is positioned at the moment.

Over the years some more types of interaction instruments have been de-veloped. For example the tablet board which makes it possible for the user todraw on a tablet like if it was directly on a paper. What this kind of interactiondoes is to bring natural gestures into the human-computer interface. The onlything that the user needs to learn is that the output from the interaction willoccur on a display instead of on the tablet.

The tangible user interface (TUI) can be described as a way to grasp andmanipulate physical objects in order to change digital information [1]. Theinventors of the TUI interface, Hiroshi Ishii and Brygg Ullmer wanted to rejointhe richness of the physical world in human computer interaction [14]. Whendesigning a system that uses a tangible user interface it is of great importancethat the coupling between action and feedback is really strong [15]. The usershould for instance easily understand the buttons and the feedback that thebutton provides. The largest benefit with a good TUI interface is that the usersknow which kind of interaction that is needed for executing a specific actionwithout reading any written instructions [1].

One can say that the touch display interaction follows the TUI interfacesince it provides feedback exactly where the finger is pressed down and givesthe user the possibility to do intuitive manipulations of the interface. The firsttransparent touch display was invented 1974 [16]. The touch display encour-ages the use of natural hand gestures as well as direct manipulation of visualrepresentations [17]).

3.1.1 The future of touch displays

The future of touch displays is very interesting. There is today major researchbeing made on touch screens that are bendable [18] and on a combination ofresistive and capacitive touch screens [19]. If these two techniques are combinedthe way we interact with touch screens today can be completely different in

Page 21: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

3.2. Touch display interaction 13

the future. The screens can be located on almost every surface and could beinteracted with even if the user wears gloves. Furthermore for more accurateinteraction a smaller pen can be used. Another interesting future for the touchdisplays is the transparent ones. TAT has done a video that shows how to usetransparent touch displays in the future [20].

Touch display could be used in the same way as the keyboard or the mouse.That is providing feedback away from the input. What should the designerhave in mind when designing a touch display device that provides feedbackdetached from input? This will be discussed in the rest of this chapter.

3.2 Touch display interaction

Studies show that users find interaction with gestures more enjoyable and ef-ficient than using a keyboard or a mouse. The reason for this is because it isintuitive and has a larger degree of control compared to a mouse interaction.Gestures also allow the user to focus more on the interface rather than divertingthe attention between different input devices and visual elements [21].

There are several different interaction patterns for the touch displays. Thedirect input allows the user to interact with an interface of a program by justreaching out with the hand and touch it [22]. This type of interaction willreduce the users’ cognitive load as well as improve the fluidity of the user-content interaction [17]. One major setback with the direct input is that theoutput could be missed by the user. The reason that the user misses the outputis that the hand is covering the display and the feedback is then visualizedunderneath the users’ hand [22].

A development of the point touch display interaction is the multi-touchinteraction. With this type of interaction the user can use multiple fingers tointeract with the interface. This type of interaction is used in the MicrosoftSurface for example, which is a 30 inch display in the form of a table. Thisproduct also expands the multi-touch interaction to work with multiple userssimultaneously. With this type of interface and the possible interactions thereare of course a few pro and cons. One big issue is the loss of privacy, butit can also be seen as beneficial that multiple user can use the device at thesame time. Another benefit that also can be seen as a disadvantage is that thetable provide is a large surface area that can hold many different windows andapplications. The disadvantage of this is that it forces the user to reach acrossthe table to interact with certain icons, windows and so on. If this has to bedone for a long time it will strain the arm muscles [23]. The ergonomic problemis a major reason why touch displays cannot be used as the major interactiontype for example desktop computers.

Page 22: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

14 Chapter 3. Designing a touchscreen with detached output

3.3 Detached input and output

The benefits of having a detached input and output screen like with the key-board, mouse and the computer display is that the user always can see wherehe/she interacts but still have the same directness as with the touchscreen. Thefact that the user at all time can focus on the output screen is another greatadvantage of detached input and output.

On the market today there are a few devices that use the dual displayconcept. One is the Nintendo DS where the user interacts on one screen butget feedback on both of the screens [24]. Another dual screen prototype is theToshiba Libretto. In this prototype the user both interacts and gets feedbackon both of the screens [25]. This is just two of many devices that have dualscreens. These devices always have the screens close to each other, but whatare the effects be if the screens a far away from each other?

3.3.1 Overall design patterns

When designing a touch display interface there are some overall design guide-lines that should be followed. At first there are the Shneidermans eight goldenrules for interface [26].

1. Strive for consistency. By this means that the system should have identi-cal terminology in prompts, menus and help screens. The system shouldalso have consistent sequence of actions in similar situations.

2. Enable frequent users to use shortcuts. This could be done by addingshortcuts, hidden commands and macro facilities.

3. Offer informative feedback. There should be some feedback for each op-erator action.

4. Design dialog to yield closure. Sequences of actions should be organizedinto groups with a beginning, middle and an end. An informative feed-back after the user has completed a group of actions creates a satisfactionof accomplishment to the user. It also gives the user an indication thatthe system is ready for another group of interactions.

5. Offer simple error handling. The system should be designed in such away that the user cannot make a serious error. If an error is made thanthe system should be able to detect the error and offer simple solutionsto the error.

6. Permit easy reversal of actions. If this is designed correctly it relieves theanxiety the user may have while interaction with the system. The userknows that errors easily can be undone and thus encourages explorationof unfamiliar options.

Page 23: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

3.3. Detached input and output 15

7. Support internal locus of control. Since experienced users strongly desirethe sense that they are in charge of the system it is of importance to designthe system in such a way that the users are the initiators of actions ratherthan the responders.

8. Reduce short-term memory load. The system should not be designed insuch a way that the user needs to remember a long sequence of actionsand multiple pages in order to perform an action.

Shneidermans principles are a good starting point in order to design a gooddetached input/output touch interface. Some visual things to have in mindwhen designing such a system is to maintain focus on the main event. Thismeans that the designer should not use any extra design elements if it does notcontribute to the task. Even if the display that provides the feedback is largeit should not be cluttered with unnecessary design elements. Another thing tohave in mind is to avoid radical changes in the layout; submenus should havethe same design pattern as the main menu. As with the tangible user interfaceit should be very clear how to perform a certain action without reading anywritten instructions [27].

3.3.2 Design patterns specific for detached input and out-put

When design a touch display that presents feedback on another screen thereis a few extra things to have in mind, in addition to the ones just stated. Itis of great importance that the output screen shows a visual representation ofthe hand placement, this provides the user with information of where the userinteracts at the moment in the same way that the mouse pointer of the mouseshows where the mouse is at the moment [21].

Another thing worth remembering when the users interact with an interfaceis that the interface should give some kind of feedback. The feedback can be inthe form of a circle around the area that the input is at the moment or that theobject in the interface reacts in some way [21]. Except for the visual feedbackthat the system provides there is also of great interest to have some other kindof feedback, like audio or tactile feedback or a combination of these. A studyshows that that the use of tactile feedback is not enough in order to provide apositive confirmation to the user. But tactile feedback combined with audiblefeedback makes the touchscreen interface both easier and more pleasurable touse [28].

Shahzad Malik and Joe Laszlo suggest that the input device should be ofthe same size as the output device; this will help the user to navigate on theoutput screen. Also when using a detached input/output device it is of greatimportance that the navigation paradigm is easy. The pie interaction interfaceworks very well with the detached input/output idea since it uses the angle ofthe gesture in order to decide that object has been chosen. The pie interface is

Page 24: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

16 Chapter 3. Designing a touchscreen with detached output

an interface that occurs wherever the user puts the finger on the touch display.When the user touches the touch display a menu with several different buttonsoccurs around the finger. In order to chose a button the user just need to dragthe finger over the button and then release the finger from the touch display.The pie interaction need a short explanation and a little training to properlyunderstand but after that it is a fast and intuitive interaction interface [21].When navigating from a main menu to sub menus the system should onlyupdate the areas of the user interface that are changed due to the interactionand not the whole screen. The reason for this is that it creates a visual stabilitywhich helps the user to keep track of where they are in their task [27]. Alsowhen navigating through different menus animations can be of a great help,a well implemented animation will help the system tell to the user what theaction from the input will be, according to the iPad guidelines [27].

3.3.3 Touchkeyboard interaction

The biggest problem for detached interaction is text input. If a keyboard isvisualized on the output screen it demands a lot of screen area and if it isvisualized on the touch input it forces the user to look at the touch display andhe might miss what happens on the output screen. There are some interestingnew methods for the text input problem. One is the 8pen interaction (see figure3.1), which relies on gestures. The user starts the input by placing his/hersfinger in the middle of a four split square. Each sector of the square has 8characters in it, in order to choose a character the user move the finger to thesector where the character is in. Since the characters are placed in two differentlines, one on each side of the sector side the user knows how to choose it. Ifthe character is on the left side of the sector and in second place, then the usermoves his finger from the middle to the sector where the character is locatedand then to the second sector to the right and then back to the middle. If thecharacter is in the second place on the right side of the sector the user insteadmoves the finger to the left [29].

Another solution to the keyboard input is Swype (see figure 3.2), [30]. Thiskeyboard works such that the user does a swipe over the letters that buildsthe word. The Swype interaction demands a virtual keyboard on the inputdisplay but since it relies on swipe input the keyboard could be much smaller,not taking up a lot of screen space.

Both of the above mentioned keyboard solutions are quite new and havenot yet been properly tested. But they are still interesting solutions to thekeyboard issue since they are both fast and enable almost blind interaction.

The solution that Shahzad Malik and Joe Laszlo provide(see 3.3.2) is avery interesting solution to replace the mouse. The idea is that the user hasa touchscreen that recognizes the hand movements and shows a visualizationof the hand on the output screen. This provides the direct input of a touchdisplay but still does not hide the feedback from the user.

Page 25: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

3.4. Conclusion 17

Figure 3.1: The interface of the 8pen concept.

Figure 3.2: The interface of the Swype concept.

3.4 Conclusion

The biggest disadvantage with the touch display is that the user could missthe feedback that the interface gives during an interaction by hiding it. If thetouch interaction is separated from the output this problem could be avoided.In order to do this there are a few things that have to be solved.

The first thing is the keyboard problem. If the keyboard has to be visualizedin the old fashion way a lot of screen surface disappears. On the market todaythere are two interesting solutions to the problem, 8pen and Swype. Thesetwo interaction methods are quite new at the market and have not yet beenproperly tested.

Another challenge for the designer is to design the interface in such waythat the users understand and notice the feedback that is given. To make surethat the feedback is noticed one should use the combination of visual, audibleand haptic feedback. The animations when interaction with the system should

Page 26: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

18 Chapter 3. Designing a touchscreen with detached output

be done in such way that they tell the user what the impact of the interactionwill be.

Overall one could say that when designing a detached input/output systemthe designer has to sure that the user understands and perceive everything thathappens to the system. Otherwise the user will be lost and the interaction willfail.

Page 27: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

Chapter 4

Design work

This chapter will describe the practical work that has been made throughoutthis thesis, from the early concept stage to the final prototype.

The overall work during the thesis has followed a design process. Thedesign process helps the designer to iterate and to maintain focus on the userthroughout the work [31]. It is best described with the picture below (Figure4.1).

Figure 4.1: The design process.

The design process starts with the designer finding out what the marketneeds and from this some requirements are established. The next step will beto start the design and in this first design phase multiple designs are generated,in an attempt to meet the needs that have been established in the previousphase. Often a few of the designs are implemented in some way (using sketchesor interactive prototypes). These prototypes are evaluated and either the design

19

Page 28: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

20 Chapter 4. Design work

is further developed, or the team needs to go back to identify the needs andset up new requirements for the prototype. The prototype could pass severaliterations until the team feels that the design is finished. When the design isgood, implementation of an interactive prototype starts. This implementationis also evaluated and either redesigned or decided the finished product [31].

4.1 Needs and requirements

To start this thesis off the first thing that had to be done was to identify themarket needs.

To find out what had been done in the automotive industry regarding inter-action with the in-car technology a field study was carried out. All the majorcar-brands such as BMW, Audi, Mercedes, Citroen, Lexus, Honda, Volkswagen,Toyota, Alfa Rome, Volvo, SAAB and Land Rover were looked at. Each in-teresting thing, regarding the interaction, was photographed and documented.Besides the field study, a major Internet study of what the future may holdfor the automotive industry was conducted. All the input from the field studyand the Internet study was gathered in a presentation. This presentation waspresented at TAT in order to give them an understanding and an insight ofwhat the automotive industry lacks in terms of interaction design.

The result of the field study was that there today are four different tracksfor the in-car technology interaction. The first track is the one that BMW,Audi and Mercedes use. These brands use a multi-directional knob for themain interaction. The knob is often surrounded by shortcut buttons for easyaccess to different main menus which are located at a screen in the center stack(as shown in Figure 2.4).

The other track of interaction is the one button or/and knob per functionparadigm (shown in Figure 4.2). Some of the car brands that use this paradigmare Volvo, Citroen and Saab. The feedback for each button or knob is oftenpresented on the cluster or in a small display on the center stack.

The third interaction paradigm that is on the market today is the mixof a touchscreen and physical buttons. This paradigm is used by Toyota, AlfaRomeo and Volkswagen. In this paradigm the driver can both use a touchscreenand buttons close to the screen for input (Figure 4.3).

On the market today there is also a fourth type of interaction, speech. Thisinteraction type is only used as a secondary interaction type and never as themain interaction paradigm. Many brands such as BMW, Honda, Mercedes andAudi use this technique to interact with some certain tasks, such as answeringthe phone, change the MP3 track and some other non-demanding tasks.

The Internet study revealed a new type of interaction type, using only atouchscreen. The first brand that is going to use this type of interaction isFord with their system called myFord Touch, which will be released in 2011.This system is going to use a touchscreen at the center stack for the interaction(Figure 4.4).

Page 29: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

4.1. Needs and requirements 21

Figure 4.2: Citroen C6 and Volvo S80.

Figure 4.3: Volkswagen Passat and Toyota Prius.

The Internet study also revealed some other possible future interaction tech-niques, gestures and eye-tracking. Both of these types of interaction are so farjust in a research state and are thereby excluded from the list of possible in-teraction types for this thesis. The reason for the exclusion is that one of therequirements for this thesis was that it should be possible to implement anduse the prototype in cars in the near future.

To summarize the different type of interactions at the market today andin the near future one major thing is that all the interaction types demandsquite a lot of focus from the driver. Whether the main interaction type is amulti-functional knob (BMW), multiple buttons (Citroen) or touchscreens andbuttons (Toyota) the driver needs to focus on a screen located at the centerstack or at the cluster in order to see what he/she is doing.

The worst interaction type according to the author must be the Citroen type

Page 30: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

22 Chapter 4. Design work

Figure 4.4: Ford myFord.

(one button per function), since the driver needs to sort between many similarbuttons to find the right one. What the myFord system has done is to createa new interaction type but using an old, distracting interaction paradigm. Inorder to change something in the car the driver really must focus on the screento locate the right button, since there is no way to feel which button that isthe right one.

The easiest interaction type to use is the BMW system, since the driverjust need to locate the knob and can then without looking at the knob navigatethrough menus and settings. But this interaction type demands that the driverhas his/hers eyes on the feedback screen and thereby distracts the driver fromthe road.

Thus, there should be a way to interact with the in-car technology withoutremoving the eyes from the road in order to see which menu I am in at themoment or which button I need to push to get the result I want.

These are the three requirements that were set up together with the TATsupervisor;

1. Find a non-distractive and intuitive interaction type.

2. Present the feedback in a non-distractive way.

3. Use technology that could be implemented in the next car model. Thismeans that the technology that would be used in the prototype are atthe market today or really close to be presented to the market.

4.2 Finding the right interaction concepts

In this phase, finding different interaction types, every little thought that cameto mind were written down on paper and after a while tons of different sugges-tions had surfaced. These suggestions were analyzed and discussed in a workshop. The participants, one interaction designer and one graphical designer

Page 31: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

4.2. Finding the right interaction concepts 23

from the TAT staff, where introduced to all the different design suggestions.Every positive and negative aspect of the design suggestions where put downon post-its. After the meeting the post-its and design suggestions were groupedinto larger categories in order to find common denominators between the dif-ferent suggestions. This resulted in five different interactions concepts calledgestures (written gestures), mouse pad, knob, speech and touch.

The next step was to thoroughly investigate the five different types of inter-action in order to find the positive and negative aspects of each concept. Thiswas done as a literature study, in order to find what the pros and cons of eachtype of interaction.

After each concept had been analyzed a second workshop was conducted.The result from this work shop was that the most interesting concepts werewrite, speech and pie. Figure 4.5 visualizes the interesting things with eachconcept.

– ”The speech concept”. In this concept the driver gets a visualization inthe HUD of the possible inputs that are available. The driver push downa button to activate speech input and gives the command ”climate” inorder to activate the climate menu.

– ”The write concept”. The idea behind this concept is that the driverwrites each command on a touchpad located on the steering-wheel. It isalways the first letter in the option that is written on the touchpad.

– ”The pie concept”. The idea of this concept is that the interaction occurson a screen located on the center stack. There are sliders along the sidesof the screen, the sliders are for the most used functions in each menu.When the driver press on the screen a pie menu occurs, in order to chosean option the driver moves his/hers finger over the icon and releases thefinger.

These three concepts became the foundation of the final prototype.Further work with the concepts started. In order to properly go through

the different concepts a scenario was created, so each concept was analyzed inthe same way. In summary the scenario described a situation where the systemshould be in exclusive cars, such as BMW or Audi, since more exclusive carcan use more expensive technology. The task for the driver was to change aclimate setting, more precisely the placement of the fan. The problem withasking for feedback regarding car interaction is that each driver has their ownrelationship with in-car technology. Some drivers use all of the technology allof the time, while some drivers do not have a clue what all the technology doand why it is there. This made the feedback very hard to interpret. From thisrealization personas were created. A persona helps the designer to keep thedesign centered on users at every step in the process. The personas also helpthe designer to share his/hers thoughts to test persons on who is going to usethe product and how they think, resulting in a more relevant feedback about

Page 32: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

24 Chapter 4. Design work

Figure 4.5: The speech, write and pie concepts that were under considerationafter the second workshop.

the product [32]. The personas as well as the scenario that were created forthis project is presented as an appendix.

To properly go through each concept UI-flows where created (Figure 4.6).An UI-flow is a rough flow chart over how the system should behave on certaininput.

The interaction-flows where discussed in a third work shop (Figure 4.7).

At this work shop the participants had different backgrounds; there werethree thesis workers, two web designers, one graphical designer, one interac-tion designer and one with special interest in the automotive industry. Theparticipants were introduced to the concepts and after each concept was intro-duced the participant had 10 minutes to write down each positive and negativethought they had about the concept on post-its and after the ten minutes thepost-its where discussed in the group. The result of the workshop was thatthe best concept was a mixture of the mouse pad and gestures concept. The

Page 33: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

4.3. Building the car-simulator 25

Figure 4.6: One of the UI-flows that was created for my system.

Figure 4.7: The third workshop.

speech concept was almost unanimously rejected because it felt unnatural andvery complicated. At the same work shop it was also decided that the feedbackshould be given on a head-up display. The reasons for this were that it is thefuture (as seen by the Internet study) and that it is much less distractive thanusing a head-down display [6].

An interaction-flow for the mixture of the two concepts was created andlow-fi pictures were created.

4.3 Building the car-simulator

While making the low-fi prototypes one major realization was that a propertest-bed was needed. The one that was available at the moment was just asteering-wheel made from paper and white-board to act as a windscreen. Toget the right car feeling a proper simulator had to be built (Figure 4.8).

The car simulator was built together with two other thesis workers, Magnus

Page 34: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

26 Chapter 4. Design work

Wilhborg and Mikael Knoos. The material, a proper sized steering-wheel andcar seat, were collected at a car junkyard. The cradle that is the foundation ofthe simulator is a ladder, and the windscreen is an acrylic glass window. Thesepieces together with car-game pedals and steering wheel were assembled andthe result was a proper test-bed (Figure 4.9).

Figure 4.8: The first steps towards a car-simulator.

The last piece of the puzzle was a proper car simulator game. Multiplecar games where tested and the one that was finally used was ”Need for speedunderground”, since that game had the best driving experience. The gameruns on a PC and is projected on a wall in front of the car-simulator.

Now the low-fi prototypes could be properly tested.

4.4 User tests

In order to discover flaws with the concepts a user test was conducted. Theuser test would also give answer to which kind of menu traversing that wouldbe the best, list or pie menus.

The test persons (ten people participated) where given an introduction tothe concepts. After the introduction the test person performed a few taskswhile sitting at a table, just to get to know the system. When the test personfelt comfortable with the concept they were introduced to the car-simulator.

Page 35: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

4.4. User tests 27

Figure 4.9: The finished car-simulator.

Before the user test started the test person were allowed to test the car simula-tor for approximate 5 minutes just to get a feeling of it. The method that wasused during the user tests was the think-out-loud method. This method en-courages the test person to tell the test conductor what she/he is thinking whileperforming the tasks and why he/she doing what she/he does. The methodgives good hints to the test conductor how the prototype is perceived.

The most interesting thing about the user test was that while not sitting atthe car-simulator eight of the test users thought that the list interaction wasthe most optimal one. But when testing the two different interaction typeswith the car simulator everyone thought that the pie interaction was the mostsatisfying one, because it was the less distractive one of the two. This showsthe importance of having a proper test-bed.

Figure 4.10: Conducting a user test.

Page 36: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

28 Chapter 4. Design work

Figure 4.11: The low-fi test setup.

4.5 Design iterations

From the user test the decision was made that further work would focus onpie interaction and a number of mid-fi prototypes where created in AdobeIllustrator (Figure 4.12, Figure 4.13 and Figure 4.14)

Throughout the design phase several smaller user tests were conducted andthe design went through several iterations. Some of the design iterations con-sidered how the highlighted icon should look and behave, see figures 4.13 and4.14.

One thing that returned in several user studies was that the main menu alsolooked like a pie menu, which made the participants believe that the interactionpattern for the main menu also was with pie gestures (Figure 4.15). Thismain menu was redesigned in order to remove any believe that it followedthe pie interaction pattern. The reason that the menu should not provide pieinteraction is that in the future it should be possible to navigate from the insideof a menu to another menu by doing a letter gesture. So the main menu screenis a way to learn and remember the different names and gestures to the differentmenus.

Page 37: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

4.5. Design iterations 29

Figure 4.12: Mid-fi, climate menu and fan slider activated.

Figure 4.13: Two different designs regarding highlighted icon in a pie menu.

4.5.1 Colors

The different colors that were under consideration for the interface were purple,red, blue, orange and lime green. The red one was removed since it indicatesthat something is wrong or danger. The color blue could be difficult to seesince the sky is blue. These two colors were removed from the design at anearly stage, for the reasons just stated, and thereby no mid-fi prototypes were

Page 38: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

30 Chapter 4. Design work

Figure 4.14: Highlighted green and orange icon in a pie menu.

Figure 4.15: Main menu old design.

created with these colors. The other colors that were still under testing wereorange, purple and green. User test showed that orange is easy to see on thescreen when driving on say a very gray, black road but when the backgroundbecome sand or dirt the color disappears (Figure 4.16). Purple and lime greenworks equally good from a visibility perspective (Figure 4.16 and Figure 4.17.Both of the colors almost never occur in the nature and are very easy to noticeon a screen. When it was decided that these were the best available colors to

Page 39: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

4.6. Implementation 31

use, a short user test session occurred in order to decide which one of the colorswere the best one. The user test also wanted the answer on which type of colorsetup, black outline or colored outline, which was the most appreciated.

Figure 4.16: Orange outlined icon and purple outlined icon.

Figure 4.17: Green filled icon and black outlined icon.

4.5.2 Animations

One thing of great importance is that the interface animations by themselvesexplain what happens within the system. So at a final phase I went throughall the animations to make sure that they all followed the same pattern. Onceyou chose an icon the pie menu disappears and the chosen icon moves intothe screen and the new menu comes out of the screen. When navigating backin the hierarchy the active menu moves into the screen at the same speed asthe driver does his down swipe, this in order to get the confirmation that thesystem reacts to the drivers input.

4.6 Implementation

The prototyped were implemented using Cascade Motion Lab, a program whichis created and sold by TAT. In order to have a nice implementation flow mile-stones where found and deadlined. Each milestone included several subtasksthat were written down on post-its and each subtask also had a time limit. Assoon as the time limit was reached that task was left and the implementationproceeded to the next subtask. If there was time left before a milestone dead-line more time was assigned into each subtask. The reason for this approachwas to make sure to deliver a fully functional prototype at the end. Some smallbugs in the prototype were preferred to a non-working prototype.

Page 40: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

32 Chapter 4. Design work

Page 41: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

Chapter 5

Results

5.1 Menu design

In order to remove the misunderstanding that the main menu followed the pieinteraction pattern it was changed to a circle. A new user test confirmed thatthis was the right way to illustrate the main menu (Figure 5.1).

Figure 5.1: Screenshot of the main menu.

The active menu now has a header with the name of the active category,instead of a half circle with all the different categories (see top of Figure 5.2).In the sub menus the menu header are visualized by an icon instead of thename of the menu. The reason that there is an icon instead of the name isthat an icon is much faster to interpret and thereby less distractive (see top ofFigure 5.3). When switching between icons and text for the header the userunderstands if she/he is in a main- or sub- menu.

In this project the main focus was on the innovative interaction type andvisualization placement as well on the interaction flow. No effort was made to

33

Page 42: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

34 Chapter 5. Results

refine the graphical design. In order to remove all chance of believing that thegraphical design was finished, all the icons were made to look like they were inthe sketch phase. In order to get this feeling the outline of each icon was justroughly drawn, which made the lines non-straight and not aligned (see Figure5.2 and 5.3).

Figure 5.2: Screenshot of the climate menu.

Figure 5.3: Screenshot of the fan placement menu.

5.1.1 Colors

The final main color that was chosen for the prototype was lime green. Theuser tests that were conducted also gave the answer that green outline andblack background (Figure 5.5) was much easier to understand and interpretthan black outline and green background (Figure 5.4).

Page 43: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

5.2. The interaction flow 35

Figure 5.4: Black outline and green background

Figure 5.5: The colors that were finally chosen.

5.2 The interaction flow

The final interaction works in the following way:

1. The driver taps the touchscreen at the steering wheel in order to activatethe system.

2. Once the system is activated the main menu occurs, in order to choose asub menu the driver writes the first letter in the sub menu name on thetouchscreen. The user gets feedback instantly as he/she starts to do theC gesture (see Figure 5.6).

3. A visualization of the possible interaction possibilities is shown on theHUD. On the touchscreen the sliders for fan and temperature are shown.This is the only visualization on the touchscreen. Since more visualizationwould distract the driver from the main focus, which is the road. Theslider visualization on the touchscreen also gives the driver a hint to wherethe pie interaction should occur.

4. To interact with the pie menu the driver touches the touchscreen andmove his/hers finger in the right direction. Once the driver touch thetouchscreen the pie becomes larger, indicating that the driver interactwith the pie menu.

5. When the drivers’ finger has reached the pie icon that icon enlarges andicons one icon away gets less opacity.

6. To chose an icon the driver releases the finger. That icon then disappearsinto the screen and a new sub menu emerges from the same place as thechosen icon disappeared.

7. In the sub menu the driver has two options, either chose a new icon orgo back to the previous menu. To chose a new icon the driver uses the

Page 44: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

36 Chapter 5. Results

same technique as in the former menu. To go back in the hierarchy thedriver do a down swipe on the touchscreen.

8. When the driver selects a final option that icon becomes green and en-larges even more before it disappears into the HUD. After the final selec-tions are made the main submenu is once again visualized.

A full visualization of the interaction can be seen on vimeo (search for Christof-fer Kopp under the people category).

Figure 5.6: Gesture feedback.

The focus of the interactionscheme is that it should be as easy as possibleto use and non-distractive for the driver. That is why the pie menu interactiontype was chosen as the main interaction type. This interaction type is slightlymore difficult to learn compared to list interaction but when the user getsfamiliar with the menus a blind interaction can occur, since the user uses his/hermuscle memory in order to remember where each icon is placed.

The same thoughts, ease of use and non-distractive, is behind the secondaryinteraction type, letter gestures. It does not matter how deep into the pie hier-archy the user is, he/she could always write the first letter of each menu nameand thereby enter that menu. Even here there is a learning curve, to remembereach menu name but once the driver learns the names blind interaction canoccur.

Easy and non-distractive interaction is the two words that are behind theminimal visualization on the touchscreen. If there is too much visualization onthe touchscreen then it will draw the attention of the driver. This was provedby several user tests. The touchscreen only consist of two different sliders, oneon each side of the screen. This helps the user to know where the pie interactionand the slider interaction occur (Figure 5.7).

Page 45: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

5.3. Remaining issues 37

Figure 5.7: The touch display visualization.

5.3 Remaining issues

There are a few issues with the car simulator. To being with the touchscreenthat is used is not very good, it easily looses connection with the finger. Theresult of this shortcoming is that the prototype does not always behaves as onemay expect.

The second shortcoming of the car simulator is that the screen that isused to reflect the interface to the windscreen does not have high contrast andbrightness resulting in that the reflection is not as good as it could be andthereby makes it a little bit harder to always see what is on the HUD.

The third issue is that there is no solution in Motion Lab that can detectletter gestures on a touchscreen. Because of this the letter interaction had tobe faked and could not be properly tested.

Page 46: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

38 Chapter 5. Results

Page 47: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

Chapter 6

Conclusions

In this chapter important personal realizations and points of interests will bediscussed. The chapter will also present my thoughts on future work.

6.1 Test-bed

During the thesis I understood the importance of having a proper test-bed.

While doing user tests without the test-bed I got one result, and whentesting with a test-bed the result was often completely different.

The importance of a proper test-bed was also shown while implementing theprototype and doing the graphic design as well as the animation design. Thatit looked and worked well on a computer screen was not a certain indicationthat it would work well in the simulator.

The reason the result differs as much as they do is due to that when usingthe prototype without the simulator the user can really focus on the interactionand on the graphic, but when using it together with the simulator the drivingis the main focus and thereby the users are not able to focus as much on theinteraction and design.

6.2 Animations

The importance of having animations that by itself explains what happens inthe system should not be underestimated. If not each type of interaction hasthe same animation type the user easily gets distracted and confused. So itis of great importance that the designer takes a step back and looks at theanimations from a new perspective, ”do I really understand the animationsand are they behaving the same at every similar action?”

39

Page 48: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

40 Chapter 6. Conclusions

6.3 Future work

Since the touchscreen that was used in this project was of low quality it is ofgreat importance to try out the concepts with a proper touchscreen so thatthe feedback from the user tests could be more accurate. The same is true forthe HUD, a HUD that provides better contrast may give some other results.A better HUD setup would make it possible to work in another way with thegraphical design. The graphical design could use shades, glow or other thingsthat make icons easier to spot and interpret.

It would also be interesting to try out the concept of using a touchscreenwith haptic feedback. I believe that by this the interaction should be easier,more pleasant to use and more non-distractive. This technique could interactwith the user by vibration and visual feedback for example indicating thatan icon has been chosen or that the fan strength has been changed. In thisthesis a rectangular touchscreen was used and when the steering wheel turnsso do the touchscreen which creates difficulties to interact while turning. Howabout using a round touch display that follows the steering-wheel movementand always keeps the interface in the right position? It is of my understandingthat this solution would both be the most esthetic one as well as the mostpractical.

Audio feedback is also a kind of feedback that should be implemented andtested. It is proven that several different types of feedback (haptic, audibleand visual) are preferred by the user than just for example haptic and visualfeedback [28]. If the user both can feel, hear and see changes that have beendone to the system misinterpretations should be much less common.

Another important thing that needs to be tested and implemented in theprototype is that the pie occurs wherever the user puts down his/hers finger.This means that the finger is always in the center of the pie. This howevercreates another problem that needs to be solved. What happens if the usertouches the screen somewhere near a corner? If this problem can be solvedin a good way the interaction will be even more non-distractive. In the samecategory as this it would be of interest to see if having a visualization of wherethe finger input is at the moment on the HUD would improve the interactionor not.

To have the possibility to try out gesture interaction could give a newdimension to the prototype. The thought today is that the driver can writethe first letter of each main category in order to enter that menu. This was notpossible to do in Motion Lab and had to be faked in the prototype. Therebythere is no way to know if the idea is working or not. But I think that thisis the right way to go in order to easily access another menu even if the useris deep down in a hierarchy tree. Letter gestures should also be nice to havewhen providing the GPS with an address.

One more futuristic idea that would be of interest to try out is to usethe discreet LED-lightning on the floor in the car in order to enhance thefeedback. For example when the driver decreases the in-car temperature this

Page 49: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

6.3. Future work 41

lightning could turn blue and red when the in-car temperature increases. Thisscenario would bring another depth to the prototype and I think enable theblind interaction.

Page 50: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

42 Chapter 6. Conclusions

Page 51: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

Chapter 7

Acknowledgments

I would like to thank my supervisor at TAT, Marcus Ericsson for excellentfeedback and help during this thesis. My thanks also go to Per Grimberg andthe rest of the TAT staff for great input and feedback during this project. Aspecial thank also to Michael Winberg, TAT, TML would have been a lot harderto understand without him. I would also like to thank Jonathan Peterson forthe proof-reading of this paper. At Umea University I would like to thankmy supervisor Hakan Gulliksson for great feedback during the writing of thisreport. Finally my thanks go to Per Lindstrom, the examiner of this thesis.

43

Page 52: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

44 Chapter 7. Acknowledgments

Page 53: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

References

[1] C. Kopp, “Can tangible user interface reduce distractions while driving acar?,” tech. rep., Departement of Computing Science, 2009.

[2] TAT, “Product and services,” 2010. http://tat.se/site/products/

overview.html, accessed 2010-10-12.

[3] E. Loh, “Then and now - bmw idrive no longer sucks,” November2009. http://blogs.trucktrend.com/6441529/vehicle-accessories/then-and-now-bmw-idrive-no-longer-sucks/index.html, accessed2010-10-03.

[4] R. Ecker, V. Broy, A. Butz, and A. De Luca, “pietouch: a direct touchgesture interface for interacting with in-vehicle information systems,” inProceedings of the 11th International Conference on Human-Computer In-teraction with Mobile Devices and Services, no. 10 in MobileHCI ’09, (NewYork, NY, USA), ACM, 2009.

[5] D. Kern, A. Schmidt, J. Arnsmann, T. Appelmann, N. Pararasasegaran,and B. Piepiera, “Writing to your car: handwritten text input while driv-ing,” in Proceedings of the 27th international conference extended abstractson Human factors in computing systems, CHI ’09, (New York, NY, USA),pp. 4705–4710, ACM, 2009.

[6] M. Ablassmeier, T. Poitschke, F. Wallhoff, K. Bengler, and G. Rigoll,“Eye-gaze studies comparing head-up and head-down displays in vehicles,”Multimedia and Expo, 2007 IEEE International Conference, 2007.

[7] V. Charissis and S. Papanastasiou, “Human-machine collaborationthrough vehicle head up display interface,” Cogn. Technol. Work, vol. 12,pp. 41–50, March 2010.

[8] S. Hollister, “Pioneer’s prototype laser hud could helpyou drive home, connected to an android smartphone,”October 2010. http://www.engadget.com/2010/10/10/

pioneers-prototype-laser-hud-could-help-you-drive-home-connect,accessed 2010-10-12.

45

Page 54: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

46 REFERENCES

[9] Wikipedia, “Cognitive capture,” October 2010. http://en.wikipedia.

org/wiki/Cognitive_capture, accessed 2010-10-27.

[10] H. Dubberly, U. Haque, and P. Pangaro, “What is interaction? are theredifferent types?,” Dubberly Design Office, 2009.

[11] D. Norman, The design of everyday things. Basic books, 1988.

[12] M. Beaudouin-Lafon, “Designing interaction, not interfaces,” in Proceed-ings of the working conference on Advanced visual interfaces, AVI ’04,(New York, NY, USA), pp. 15–22, ACM, 2004.

[13] M. Bellis, “Inventors of the modern computer. the history of the computermouse and the prototype for windows - douglas engelbart,” 2010. http://inventors.about.com/library/weekly/aa081898.htm, accessed 2010-11-05.

[14] b. Ullmer and H. Ishii, “Tangible bits: towards seamless interfaces betweenpeople, bits and atoms,” tech. rep., MIT Media Laboratory, 1997.

[15] T. Djajadiningrat, S. Wenseen, J. Frens, and K. Overbeeke, “Tangibleproducts: redressing the balance between appearance and action,” Per-sonal Ubiquitous Computing, vol. 8, pp. 294–309, September 2004.

[16] M. Bellis, “Touch screen,” 2010. http://inventors.about.com/

library/inventors/bltouch.htm, accessed 2010-11-03.

[17] C. Shen, K. Ryall, C. Forlines, A. Esenther, F. D. Vernier, K. Everitt,M. Wu, D. Wigdor, M. R. Morris, M. Hancock, and E. Tse, “Informingthe design of direct-touch tabletops,” IEEE Comput. Graph. Appl., vol. 26,pp. 36–46, 2006.

[18] D. Graham-Rove, “Flexible screens get touchy-feely,” 2009. http://www.technologyreview.com/computing/22232/, accessed 2010-11-16.

[19] intomobile, “Rim files patent for merged capacitive and resistivetouchscreen,” 2009. http://www.intomobile.com/2009/08/05/

rim-files-patent-for-merged-capacitive-and-resistive-touchscreen/,accessed 2010-11-16.

[20] TAT, “Future of screens,” 2010. http://mobileuserinterfaces.

blogspot.com/2010/09/future-os-screens-experience-video.html.

[21] S. Malik and J. Laszlo, “Visual touchpad: a two-handed gestural inputdevice,” in Proceedings of the 6th international conference on Multimodalinterfaces, ICMI ’04, (New York, NY, USA), pp. 289–296, ACM, 2004.

[22] J. Kennedy, Interaction design proposal - Amaon.com Designed for: MultiTouch Microsoft Surface. PhD thesis, Qantm College, 2010.

Page 55: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

REFERENCES 47

[23] T. Baudel and M. Beaudouin-Lafon, “Charade: remote control of objectsusing free-hand gestures,” Commun. ACM, vol. 36, pp. 28–35, July 1993.

[24] “Nintendo ds,” 2010. http://www.nintendods.com, accessed 2010-11-16.

[25] J. Loftus, “Toshiba libretto hand-on details dual-screenui, virtual keyboard layouts,” 2010. http://gizmodo.

com/5613304/toshiba-libretto-hands+on-details-dual+

screen-ui-virtual-keyboard-layouts?utm_source=

feedburner&utm_medium=feed&utm_campaign=Feed:+gizmodo/full+

(Gizmodo), accessed 2010-11-16.

[26] B. Shneiderman, Designing the User Interface: Strategies for EffectiveHuman-Computer Interaction. Reading, MA: Addison-Wesley Publisher,fourth ed., 2004.

[27] A. Inc., iPad Human Interface Guidelines, 2010.

[28] P. BMatthew, M. Williams, T. Wellings, and A. Attridge, “Assessin sub-jective response to haptic feedbac in automotive touchscreens,” Automo-tive UI’ 09, 2009.

[29] 3qubits, “8pen,” 2010. http://www.the8pen.com/index.html, accessed2010-11-06.

[30] S. Inc., “swype,” 2010. http://swypeinc.com/index.html, accessed2010-11-06.

[31] H. Sharp, Y. Rogers, and J. Preece, Interaction Design - beyond human-computer interaction 2nd Edition. Wiley, 2006.

[32] A. Cooper, R. Reimann, and D. Cronin, About Face 3 - The essentials ofInteraction Design. Wiley Publishing, Inc., 2007.

[33] M. Bellis, “History of the computer keyboard,” 2010. http://inventors.about.com/od/computerperipherals/a/computer_keyboa.htm, ac-cessed 2010-11-06.

Page 56: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

48 REFERENCES

Page 57: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

Appendix A

Scenario

When looking at today’s car industry, one can see that it is the more exclusivecar manufactures and models that adapt and tryout new technology. Compar-ing a Chevrolet AVEO5 (Figure A.1), which just has knobs and levers, with anAudi A8 (Figure A.2) that is packed with in-car computers, different interac-tive screens, multifunctional interaction knob and so on the different betweencheap and expensive cars becomes even more obvious. From this observationit is most likely that my new interaction prototype will occur in more exclu-sive and technical cars like Audi, BMW and Lexus. The target groups forthese brands are people in the age of 30-50 with a good education and a stableeconomy.

49

Page 58: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

50 Chapter A. Scenario

Figure A.1: Chevrolet AVEO5, 2010.

Figure A.2: Audi A8, 2010.

Page 59: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

Appendix B

Personas

B.1 Persona 1, primary persona

Andreas is a man in his early forties, living in a 4-room apartment downtownwith his wife and his 6 year old son. Andreas works at a stock market companyand is a senior-manager. His title and work makes him very concern of hisexterior, he want people to see that he has an important work. He alwayswears a suit to work, and when it is sunny he also wear the newest ray-bans.Andreas has the HTC phone, iPad and a Macbook pro. In this way he caneasily sync his calendar so he is always aware of what happens next and becausethese products look good and hip. He really loves his family but feels that hedoes not has enough time for them so much during the weeks so every weekendthey go by car to different activities, for some family bonding time. Once ayear the family goes by car to the Alps to do some skiing. Andreas likes toexercise and visit the gym a couple times a week and also goes out for a runa couple days a week. Except for the modern decorated apartment Andreasalso drives a BMW 550i because it is fast, comfortable and send the ”right”signals. Andreas likes to cruise with his car and uses every gadget that the carhas when he is bored along the highway. Andreas has good understanding incomputers and has no problem in interacting with an HTC phone, iDrive orsimilar devices.

B.2 Persona 2, secondary persona

Jenny is a 32 year single business woman. Jenny work really hard with hercarrier in the fashion industry where she is a freelancing designer. She wantsto wait to start a family because career is the most important thing in herlife at the moment. At her spare time Jenny likes to spend time with herfriends at different beer gardens drinking rose wine. She also works hard onher appearance and therefore exercises regularly. Jenny has a white iPhone 3gs

51

Page 60: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

52 Chapter B. Personas

because it is booth good-looking and helps her to organize her day. Whenmoving between different meetings throughout town she uses her Audi A4convertible. The reason she has chosen that car because it looks good andis fun to drive. Jenny likes to drive fast and always has a race with herselfbetween point A and B. When comes to electronic devises she can use themwithout problems but she does not care about them that much, she would notpay extra for some cool gadget.

B.3 Persona 3, secondary persona

Goran is 50 years old and have a wife and two kids. They all live on the countryside in a villa not too far from a larger city. Goran works at the office at asmaller industry. A job he is not to fund of but likes the stability that thejob provides. He thinks of himself as a cool dad, always buys new gadgets toimpress on his kids. The problem is that he never understands them and getsfurious because there is something wrong with them so the gadgets often endup in the hands of the kids. Goran spends every spare moment with his familyand they often goes on small trips and sightseeing. He owns a Lexus RX withall the extras that the manufacture provides. The problem is just that he doesnot understand any of the gadgets which his kids do. This makes him a bitirritated since this means in his mind that he is old.

Figure B.1: Persona 1.

Page 61: Designing a non-distractive center-stack interactionumu.diva-portal.org/smash/get/diva2:378667/FULLTEXT01.pdfDesigning a non-distractive center-stack interaction Christo er Kopp December

B.3. Persona 3, secondary persona 53

Figure B.2: Persona 2.

Figure B.3: Persona 3.