The Impact of Animation on Individual Performance A Web-Based Experiment

The Impact of Animation on Individual Performance:

A Web-Based Experiment

Ping Zhang and Nelson MassadSchool of Information Studies

Syracuse UniversitySyracuse, NY 13244

pzhang@mailbox.syr.edunmassad@mailbox.syr.edu

Introduction

Multiple presentation modes, or multimedia, have

become a very common feature of user interfaces,especially web pages. For example, text, graphics, andimages may all appear on one screen during a user’sinformation seeking and processing. When surfing theInternet using a web browser, one can easily access manypages with vivid animation jumping on the screen.Certainly animation enriches the web pages, and rapiddevelopment of web design facilities makes web pagesmore colorful and even more attractive. On the otherhand, since human peripheral vision is very good atperceiving moving objects, animation may also causevisual interference that affects information seekingperformance. For example, one may find that it is hard toconcentrate on the pertinent information when there is ananimation around the information. Thus it may takelonger to get the information correctly.

Few research results can be found that reportanimation effects on individual information seeking andprocessing performance. Thus it remains questionswhether animation can really decrease performance andto what extent animation affects one’s performance.In this paper, we report a study that answers thesetwo questions. The study is believed to be valuable inguiding web page designers to use animation carefully inweb environments. The study also suggests that thedesigners of any type of user interfaces should considerpossible visual interference sources that may affect anindividual’s performance.

correctness of the answers and the time spent to get theanswers are then used as measures of performance.In this study, animation is designed to provide noextra information for the user’s information seekingtasks. According to Allport (1989), the meaning ofunattended visual stimuli is generally processed. It isvery likely that animation causes visual interference andthus affects the individual’s visual information seekingperformance. This is our first hypothesis.

• Hypothesis #1. If an animation does not provide

useful information for a user’s information seekingand processing tasks, it will deteriorate theparticipant’s performance.Literature also indicates that the degree ofinterference has to do with the similarity of the distracterand the attended stimuli. The more similar they are, thegreater the interference is. In our case, we introducesome animation that has similar content with a user’stask (moving strings) and some that has absolutelynothing to do with the tasks (arbitrary images). Webelieve that:

• Hypothesis #2. Animation that is similar to a task

has more negative impact on performance thananimation that is not similar to the task.According to Lavie (1995), a distracter has lessimpact on a more difficult task than on a simple task. Inher study, participants were asked whether a target letterappeared in a string of one or six letters after the stringwas exposed for 50ms. The one letter condition wascalled a simple task, the six letter condition a difficulttask. Lavie argued that a difficult task requiredparticipants’ more cognitive effort, thus their cognitivecapacity was utilized with less room left for processingirrelevant information (that is, distracter).

We believe that Lavie’s finding can be applied to theweb based tasks. In order to test this, we divide tasks into

Research Hypotheses

The research is designed as a focused attention task(Eysenck & Keane 1995). Participants are to count howmany times a target string appears in a given table ofstrings (attended stimuli) on a web page. A string is arandom combination of one to four letters. Animation(unattended stimuli) is added to the web page. The

167

Proceedings of the Americas Conference on Information Systems, August 15-17, 1997, Indianapolis, IN. Editor: Jatinder Guptasimple and difficult ones. After some trials, we foundthat one letter strings are too easy to count, and anystring with more than four letters is extremely difficult towork with. We decide that in this study, a simple task isa target string with two letters, and a difficult one is atarget string with four letters. The correspondinghypothesis is:

• Hypothesis #3. As the difficulty of the task increases,

the participant’s performance will be less affected bythe animation.Hirohiko Mori and Yoshio Hayashi (1995) studiedthe impact of peripheral windows on information seekingperformance. They found that a peripheral windowcaused more interference when it was closer to the taskthan when it was farther away from the task. Theimplication of this conclusion is that distance may havean effect on the interference and thus affects aparticipant’s performance. We wonder if this is also truefor the web based tasks. In this study, we carefullyarrange the location of the target strings in the table sothat all the target strings in one table can be consideredeither within a small distance from the animation orlarge distance.

• Hypothesis #4. Animation has a stronger negative

effect on a participant’s performance if it is closer inspace to the target strings than if it were furtheraway from the targets strings.Another factor we consider is the color of animation.We believe that animation with bright color makes itmore noticeable and thus more distracting thananimation with dull color. This is our last hypothesisabout the impact of animation:

• Hypothesis #5. Animation with bright color has a

stronger negative effect on a participant’sperformance than animation with dull color.Table 1 lays out the four factors in this study, plusthe baseline condition where no animation is used in theweb pages. Each of the 20 tables represents one uniquecombination of conditions. Tables 03, 06, 17 and 20 areused as practice tables with different target strings.

repeated measures, thus each participant does a total of20 tables. Each participant has a unique sequence oftables which is pre-defined by the experimenters withconsideration for reducing the potential order effect.The computers used in the study are SPARC stationswith 19 inch monitors. The web browser is NetscapeNavigator Gold 3.01. The background color of all webpages is the default color, which is gray. The foregroundcolor is black. The string table is 10 rows by 8 columnsof randomly generated arbitrary strings of one to fourletters. The target strings can appear from one up to fivetimes on the tables. Prior to a table page, a so called“break page” shows what the target string for the nexttable is and a link to the table page. The table page (withor without animation) has the table of strings in thecenter of the screen, and an answer selection session atthe bottom of the screen. The participant can select ananswer and click the “Submit” button, which leads theparticipant to the next break page in the sequence. Thesize for all animations remains the same: 1.5 square inchon screen. The small distance is set as within 2 inches onscreen measure, and the large distance is beyond 3 incheson screen measure.

Participants are told that both break pages and tablespages have a limited duration and disappear from thescreen when time is up: a break page lasts 10 secondsand a table page lasts 20 seconds. They are also told thattheir performance score is determined by the time theyspend on 20 tables pages and the number of correctanswers. Both the time and the correctness are capturedby the server. The participants have a practice sessionwith four tables indicated in Table 1 before thecompetition starts.

The performance score of a table is calculated by thefollowing formula:

p_score = (CntAccuracy + 1 - Time/Longest)*1000where CntAccuracy is calculated by (1 -abs(CorrectCnt - SelectedCnt)/CorrectCnt), and theLongest is for this table among all the participants.Table 2 shows the paired t-test results. Of the fivehypotheses, three are confirmed by the study. In general,the performance of baseline conditions are significantlyhigher than the performance at animation conditions.Animation does affect one’s information seekingperformance. It is also true that animation has differentimpacts on different level tasks. The more difficult thetask, the less distracting the animation, and the higherthe performance score. The color plays an important rolein affecting one’s performance. Bright color (green,

Experiment and the Results

Participants are 24 undergraduate students inInformation Management and Technology major. Theyall have web use experience. The incentives include threelevel prizes at $30, $10 and $5, and a bonus for a coursethe participants are taking (either substitute anassignment, or get extra credit). The experiment uses

168

Proceedings of the Americas Conference on Information Systems, August 15-17, 1997, Indianapolis, IN. Editor: Jatinder Guptaorange, red, bright blue) animation worsens significantlymore performance than dull color (gray, black, white).

There is no difference found for similarity ordistance. Further study is needed on similarity impact.Since a participant has to go through the entire table tosearch for the target string, and the animation is placedon the border of the table, the distance from the marginof the animation to all target strings in the table may notbe the proper design to test the distance effect. Analternative design would be to control the distancebetween the animation and the table. Also, the differencebetween small distance and large distance may need to beenlarged in future studies.

The direct implication of the study results is that thedesigners of web pages and other user interfaces need tobe aware of animation as the source of visualinterference. Among several purposes of animation inuser interfaces, such as decorating, drawing attention,and visual explanation, one should examine carefully thepurpose of the entire web page or interface and the needto use animation.

References

Mori, Hiroshi and Yoshio Hayashi (1995), VisualInterference with Users’ Tasks on MultiwindowSystems, International Journal of Human-ComputerInteraction, 7 (4), 329-340

Lavie, Nillie (1995), Perceptual Load as a NecessaryCondition for Selective Attention, Journal ofExperimental Psychology: Human Perception andPerformance, Vol. 21, No. 3, 451-468

Allport (1989), Visual Attention, in M. I. Posner (Ed.),Foundations of Cognitive Science, Cambridge, MA:MIT Press

Eysenck, M. & M. Keane (1995), Cognitive Psychology:A Student’s Handbook, 3rd Edition, Psychology Press,UK

Conclusions

The primary goal of this study is to test if animationis a source of visual interference and to what extendanimation affects one’s information seekingperformance. In order to achieve this goal, many factorshave been eliminated from this study. For example, thespeed of an animation, many potential locations of ananimation (for instance, an animation inside the table),and the size of animations are not considered in thisstudy and will be in future studies.Table 1. A Structure of the Study.

AnimationSimilar to Tasks

Baseline (noSmallLargeanimation)DistanceDistance

Simple Tasks01 03 *05Difficult Tasks0204 06 *Simple Tasks111315Difficult Tasks121416*also used during the practice session with different target stringsTable 2. Paired t-Test for Means

Mean1196.391073.741014.271133.201097.101050.371146.111001.361082.701064.78

Variance20038179873043020184268212307222785238512634523184

Obv.24242424242424242424

AnimationDissimilar to TasksSmallSmallDistanceDistance07090810 17 *1918 20 *

dull

colorbrightcolor

BaselineAnimationSimple TaskDifficult TaskSimilarDissimilarDull ColorBright ColorSmall DistanceLarge Distance

df2323232323

t4.5125-3.40481.37204.85590.5333*** p < .001

p.000 ***.002 **.183.000 ***.599** p < .01

169