preattentive processing and target.com

Running Head: PREATTENTIVE PROCESSING AND TARGET.COM 1

Preattentive Processing and Target.com

Armen J. Chakmakjian

Bentley University

PREATTENTIVE PROCESSING AND TARGET.COM 2

Abstract

This paper is an expert review of the current implementation of visual elements on the

Target.com home page through the concept of preattentive mechanisms. The paper starts with a

description of visual perception and very briefly touches on the concepts of saccadic motion and

signal processing that occur in the eye. In order to understand what the purpose of preattentive

processing is, the paper goes over relevant biological and psychological research on how the

visual sensory system uses preattentive processing to distinguish interesting groupings of

elements in the visual field. The paper uses the available research to describe preattentive

mechanisms such as constancy, color, relative size, and Gestalt properties including proximity,

similarity, alignment, continuity, and closure. This paper will then study the Target.com website,

concentrating on elements that stimulate preattentive grouping responses, as well as any

distractors. The paper closes with some recommendations for the Target.com site.


Preattentive Processing and Target.com

Visual perception relies on many stages of processing of signal data before ultimately

being used by higher cognitive functions. (Gazzanina, Ivry, & Mangun, 2002, p. 150) After

detection in the eye, preattentive processing allows the organization of stimulus being sent

through the visual sensory system. (Moore & Egeth, 1997) Preattentive processes involuntarily

and in less than 250 milliseconds signal the presence of a grouping of differences in the

environment confronting a sensory input and are recognized by sensory memory. (Yoo, 2007)

The preattentive mechanism seems to be there to attempt to process items so that they seem to

pop out of the background and allow the observer to choose to attend to them. (Gazzanina, Ivry,

& Mangun, 2002, p. 253). These impressions may be lost if active attention is not triggered,

possibly indicating a near term memory of patterns which informs preattention. (Yoo, 2007)

At the start the paper briefly describes the biological stages of visual sensory processing

including eye movements. In order to understand what the purpose of preattentive processing is,

the paper will go over both the biological and psychological research available in this area and

describes the processing that our visual sensory system uses to distinguish interesting elements in

the visual field. The paper then considers preattentive mechanisms such as constancy, color,

relative size, and Gestalt properties including proximity, similarity, alignment continuity, and

closure. This paper then investigates the use of elements on the Target.com website that stimulate

preattentive responses. The paper closes with some recommendations based on the survey of

research for the Target.com site.

Visual Perception, Gestalt Theory and the Preattentive Mechanism

Visual perception follows the process of visual detection that starts in the eye. Cornsweet

tells us that the eye is in constant motion due to voluntary scanning, involuntary tremors and

saccadic movements. Saccadic movements are drift of the object of focus and the eye’s reaction

to bring that object back to the center of the fovea. (Cornsweet, 1970, 400). Concurrently, the

rods that surround the fovea detect changes in light, and generate a movement called “pro-

saccades” or externally movement triggered towards the sudden appearance of a peripheral

stimulus. (Pierrot-Desilligny, Milea, Muri, 2004).

Once detected, the visual perception system behaves in a way that groups information for

efficient processing through systems called preattentive mechanisms. As Ware points out, the

preattentive mechanisms can be characterized by the Gestalt principles of grouping such as

proximity, similarity, alignment, continuity, and symmetry (as cited in Fekete, van Wilk, Stasko

& North, 2008). Pomerantz makes an argument that color should be accepted as a “psychological

primitive” (Pomerantz, 2006) since it may lead to a pop-out, in other words a signal that

something significant should be attended to in the visual field. Constancy is also thought of as a

preattentive mechanism and one research study points to data that describes how children


generate a preattentive memory of constancy of features (Molholm, Gomes & Ritter, 2001) In

this particular case there are some differences in opinion on whether the affects of constancy

precede or are part of an iterative grouping and processing mechanism. (Palmer, Brooks &

Nelson, 2003). Palmer and Rock argue that preattentive processes are a multi-stage event that

results in a concept of uniform connectedness. (Palmer & Rock, 1994). In their theory,

individually detected and perceived elements are grouped together by subsequent stages that are

both bottom-up Gestalt groupings and informed by pattern memory, indicating involvement of an

involuntary top-down process. (Palmer & Rock, 1994).

This variety of processing implies that biological systems inhibit a significant amount of

information. (Mattingley & Davis, 1997). The next logical question is why did a biological

mechanism evolve in which information is sorted and filtered before attentive processing is done.

Cornsweet posits that because we have a system that can learn, only the stimulus that indicates

change needs to be passed along to higher cognitive processes. Unchanging conditions of the

sensory field are not processed thoroughly since it would be redundant to a learning system.

(Cornsweet, 1970, 443)

Research in Preattentive Mechanisms

In 1966, Beck ran an experiment in which fields of letters in different orientations were

presented to a subject for a short fixed amount of time via a shutter. The experiment found that

grouping by similarity was still possible despite changes in orientation of the letters in the visual

field. (Beck, 1966) Vuilleumier and Landis researched grouping and filling-in in 1997 on patients

with left spatial neglect (they were unable to detect attentively on the left side). In this study it

was shown that contours were perceived without explicit attention, meaning they were handled by

a preattentive mechanism. (Vuilleumier & Landis, 1997) Findings from infant research done by

Quinn, et al, show that 6 to 7 month-olds retain information about the elements presented in the

visual field as well as being able to form larger perceptual groupings such as rows and columns.

(Quinn, Bhatt, Brush, Grimes & Sharpnack, 2002) Later research by Beck, et al, shows that

detection of symmetry is preattentive since subjects’ neural activity was heightened even when

they were not attending to that symmetrical stimulus because a red dot was detected in the

stimulus field. (Beck, Pinsk, Kastner, 2005).

Finally, a 1997 study described a patient that had had a cardiac episode that left him with

normal speech and motor functioning but tests proved that his connection between his

preattentive grouping processes and his spatial attention had been impaired. (Vecera &

Behrmann, 1997, p. 30) The tests showed that for proximity, similarity, and closure that the

patient scored very close to a control subject. However, the patient had significant difficulty with

symmetry and continuity tests. (Vecera & Behrmann, 1997, pp. 39-42) From this research it can

be extrapolated that the brain can still do grouping of visual stimulus in many cases, but this may


indicate that preattentive processing allows it to be more efficient.

Preattentive Processes and the Target.com Website

Today’s e-commerce websites are full of rich, interactive information that convey a sense

of engagement with the user and Target.com is a typical example of this. This paper will analyze

Target.com to see what elements are present that stimulate preattentive mechanisms. The concept

of competition for attention and distraction and the malicious use of preattentive stimulating

elements will also be discussed.

On the left side of figure 1, the top of the landing page of Target.com that was available

on October 14, 2012 is shown. The right side of Figure 1 is skeleton sketch of regions that are

numbered to facilitate this discussion. We will navigate through the regions under 3 basic topics:

The Page Header, The Main Body, and Motion, Distractors and Competition for Attention.

The Page Header

Regions 1, 2 and 3, are the page header. Regions 1 and 2 are separated because the

background colors of white for region 1 and red for region 2 would lead to an obvious discernable

border. The subtle saturation difference in red between regions 2 and 3 would also get processed

preattentively and the fact that regions 2 and 3 are different would get registered. Because these

regions have a color difference, anything inside of those regions would be grouped together under

then mechanism of closure. Adding to this, the text items inside those regions run parallel to the

regional boundaries, the alignment Gestalt mechanism would further imprint grouping on the text

within those regions.

Items 13 and 14 are in these regions also. Item 13 is a search box, in white, inside of

Figure 1: Target.com screen capture (Left) and Skeleton region map (Right)


region 2. While being a normal part of the top of many web pages, and might be a pattern in

pattern memory that is normally grouped in this area of the screen, the color and shape of the

object are distinct enough from the text to achieve pop-out. Item 14 contains the shopping cart

and a number in black in the yellow bubble. Preattentively, this looks like items that are

superimposed on region 3 and while they might satisfy proximity, would pop-out because the

alignment of the cart crosses the boundaries of region 3 at an angle and the yellow bubble would

achieve pop-out since both by shape and color would be different than the contents of region 3.

By the strategic use of yellow here, the most visible color at different levels of luminance, the red

items in the page are grouped together, but the yellow becomes a distractor. Even with the color

difference the cart and bubble might be grouped with each other because of their proximity to

each other.

The Main Page Body

Regions 4 and 5 are long blank white regions without any content. There is no border

between items 4 and 6, but because of the alignment of the blue text in region 6, the preattentive

mechanisms would infer that a different region exists and a border would be filled-in between

them. Similarly, region 5 and the two abutting regions 10 and 9 would be subject to preattentive

filling-in. In this case, regions 5 and 9 are separated from each other with a thin gray line. That

line does not extend upward to separate regions 5 and 10, but preattentively that line would be

drawn to satisfy closure of region 5.

Region 6 is interesting as all the blue text and picture items in the column are in

alignment with each other. This proximity and alignment would allow these items to be grouped

together within that contour. The icons in the lower half of this region, under the title “ways to

save” would also be grouped together because of proximity and similar color and size. However,

this region also has 2 unaligned items superimposed on it. Item 11 corresponds to a picture of the

circular sent to people’s homes. Since item 11 is tipped slightly, it pops out from the column

indicating that although it is proximate to that column it is unaligned and therefore another area

of interest for the user. The item also slightly occludes regions 4 and 7 further indicating

superimposition. Region 12 is superimposed on this column and corresponds to the Target brand

symbol. Because of closure, the concentric circles would be grouped together and since the top of

the circle is apparently occluded by region 3, preattentively the circles would be completed. If the

Target symbol were of interest to the reader, it would have already been processed as the full

symbol should the user wish to selectively attend to it.

The matrix of items in the middle defines region 7. This area might be detected as a

region of rows and columns of red items, all similar. In particular, the items change shape but

each is red and accompanied by similar blue text captions. From a preattentive point of view, this

region of squares would be viewed as a grouping because of similarity of the color red of the


items, the alignment of blue text to each item in a regular pattern and the fact that each one seems

to be in a gray-bordered square. Within that region, one might expect some competition for

attention between the differently shaped items. As one study points out that the arrangement of

products in a list or a table will offer different amounts of competition for attention and that the

tabular form of presentation offers less competition for attention than the list format. (Weiyin,

Thong &Yan, 2004). It might be concluded that this format suppresses the preattentive

mechanism slightly so that the user can have a pleasurable experience searching the site, but this

paper closes with a alternative analysis and recommendation for this area.

Motion, Distraction and Competition for Attention

Region 8, just above region 7, has a gray-blue background, and contains text using 5

different colors and sizes. The dark black letters pop out and may cause them to be grouped

together to also seem to be competing for attention with the rest of the page.

Off to the right of region 7 is region 9, containing a Palmolive advertisement inside a

dark gray box. This indicates a differently shaped region from the matrix next to it. This

advertising region uses different colors than the ubiquitous red and blues of the site. In this case

the Palmolive bottles themselves being placed closely together in the ad would lend to grouping

items there. Further, the Palmolive brand banner appears large at the top of the region, and on the

bottles themselves. Preattentively these banners would signal a grouping based on similarity even

though the sizes of the banners were different.

Finally in region 10, just above regions 8 and 9, there is a revolving banner that updates

every 5 seconds. This area is defined by both the regions that create the perimeter around it, but

also by the motion of the banner. While the rest of the page attentively processed as static, Target

uses motion as a distractor in region 10. Some of the vendors that advertise in region 9 do the

same. In their cases, they are deliberately distracting a user from their current task. For example,

on a refresh of this page a Tide detergent advertisement appears in region 9 that has a significant

amount of motion (not captured in this screenshot).

Recommendations

Target’s website has some problems which will make for a less than engaging user experience.

There are many distractors on the page, even amongst things that might be grouped together

effectively by the preattentive mechanism. This competition for attention can lead to distraction

and anxiety because of the inability of the subject to ignore irrelevant data and would impair task

efficiency or speed of execution. (Derakshan & Eysenck, 2009). In their ubiquitous use of the red

brand color, they have created a lot of visual noise. In particular, since they made red a

background color, the color of action icons, and the color of objects representing different

departments and then further placed them in close grids, all the red starts to become a distractor.

A 1992 study showed that response competition was dependent on the proximity of objects to be


grouped but even more so when the target (in the visual field) and distractor of a similar color

were somehow connected or showed continuity. (Baylis & Driver, 1992). The recommendations

here are to vary the red product icons in the matrix using some other colors and to eliminate the

thin gray line that creates the separating effect of the matrix cells. While we have pointed out

previously that tabular presentation might offer less competition for attention than a list (Weiyin,

Thong &Yan, 2004), given the contents of the grid being the same colors, this may blunt the good

effect of the matrix.

Conclusion

This paper surveyed the relevant research on preattentive mechanisms and their role in

between the physical detection of stimuli by the eye and the later cognitive functions including

attention. The paper explained several mechanisms including Gestalt theory with respect to the

preattentive mechanism and the role of pop out and various types of grouping. The paper

navigated through the Target.com landing page suggesting areas that might stimulate preattentive

grouping and offered a few recommendations to reduce the number of distractors to improve the

page.


References

Baylis, G. C., Driver, J., (1992). Visual Parsing and response competition: The effect of

grouping factors, Perception & Psycophysics 51(2), 145-162 Retreived October 14, 2012 From:

http://www.springerlink.com/content/4071531p41hp0683/fulltext.pdf

Beck, J., (1966) Effect of orientation and of shape similarity on perceptual grouping,

ATTENTION, PERCEPTION, & PSYCHOPHYSICS 1(5), 300-302, DOI: 10.3758/BF03207395

Beck, D. M., Pinsk, M. A., Kastner, S., (2005). Symmetry perception in humans and

macaques, Trends in cognitive sciences 9(9), 405-406, doi:10.1016/j.tics.2005.07.002

Conti, G. & Sobiesk, E. (2010). Malicious Interface Design: Exploiting the User,

WWW2010, Raleigh, NC: ACM

Cornsweet, T. N. (1970). Visual Perception. New York, New York, USA: Academic

Press, Inc.

Derakshan, N., & Eysenck, M. W. (2009). Anxiety, processing efficiency, and cognitive

performance: New developments from attentional control theory. European Psychologist, 14(2),

168-176. doi:10.1027/1016-9040.14.2.168

Fekete, J, van Wilk, J. J., Stasko, J. T., & North, C. (2008) The Value of Information

Visualization, Information Visualization: Human-Centered Issues and Perspectives, Berlin,

Heidelberg, Germany, Springer

Gazzanina, M. S., Ivry, R. B., & Mangun, G. R. (2002). Cognitive Neuroscience - The

Biology of the Mind (Second ed.). New York, New York, USA: W. W. Norton & Company, Inc.

Mattingley, J. B., & Davis, G. (1997). Preattentive filling-in of visual surfaces in parietal

extinction. Science, 275(5300), 671.

Molholm, S., Gomes, H., Ritter W. (2001). The detection of constancy amidst change in

children: a dissociation of preattentive and intentional processing. Psychophysiology 38(6), 969-

978 doi:10.1111/1469-8986.3860969

Moore, C. M., & Egeth, H. (1997). Perception without attention: Evidence of grouping

under conditions of inattention. Journal Of Experimental Psychology: Human Perception And

Performance, 23(2), 339-352.

Palmer, S. E., Brooks, J. L., Nelson, R., (2003). When does grouping happen?, Acta

Psychologica, 114( 3), 311-330, 10.1016/j.actpsy.2003.06.003.

Palmer, S.,E. Rock, I. (1994) Rethinking perceptual organization: The role of uniform

connectedness. Psychonomic Bulletin & Review, 1(1), 29-55. doi:10.3758/BF03200760

Pierrot-Deseilligny, C., Milea, D, Muri, R.M. (2004), Eye movement control by the

cerebral cortex, Current Opinion in Neurology, 17(1),17-25

Pomerantz, J. R. (2006). Colour as a Gestalt: Pop out with basic features and with

conjunctions. Visual Cognition, 14(4-8), 619-628.

http://www.springerlink.com/content/4071531p41hp0683/fulltext.pdf


Quinn, P. C., Bhatt, R. S., Brush, D., Grimes, A., Sharpnack, H., (2002). Development of

Form Similarity as a Gestalt Grouping Principle in Infancy, Psychological Science, 13(4), 320-

328, Sage Publications, Inc. on behalf of the Association for Psychological Science, Retrieved

October 13, 2012, From http://www.jstor.org/stable/40063763

Vecera, S. P., & Behrmann, M. (1997). Spatial attention does not require preattentive

grouping. Neuropsychology, 11(1), 30-43.

Vuilleumier, P., Landis, T., (1998). Illusory contours and spatial neglect, Neuroreport

9(11), 2481-2484, Retrieved October 13, 2012 From:

http://labnic.unige.ch/papers/PV_NR1998.pdf

Weiyin, H., Thong, J. L., & Kar Yan, T. (2004). The Effects of Information Format and

Shopping Task on Consumers' Online Shopping Behavior: A Cognitive Fit Perspective. Journal

Of Management Information Systems, 21(3), 149-184.

Yoo, C. Y. (2007). Preattentive processing of web advertising. Youngstown, N.Y:

Cambria Press.

http://labnic.unige.ch/papers/PV_NR1998.pdf

preattentive processing and target.com

Documents