Introduction We, as humans, are genetically hardwired to perceive the visual scenes in a pattern. We look for a trend to organize the information we receive from the world around us. With a deeper understanding of the pattern perception process inside t he human brain, designers can navigate the users attention in the most complex interface/system interface/system designs. Information
processing in the human brain takes place in three steps: Biologically, Pre-
attentively and Cognitively. Once a signal is detected, our visual sensory system is able to integrate local features to form a perception of a pattern. Psychophysical data suggests that the process of perceptual grouping is mediated at an early stage of visual processing (Sugita Y 1999). Patterns are processed in parallel by a certain set of receptors that respond to properties such as color, orientation, size, spatial frequency or movement (Treisman A 1982). However, objects that have conjunction of these features are serially processed in our brain. To stay within scope of this paper, I will only talk about parallel processing. Preattentive processing is a stimulus to any static or moving object outside the focus of attention that tends to organize and gives structure to the random information we receive from the world around us. And amazingly, it takes place within 250ms. Preattentive vision assists the visualization process in detecting spaces and boundaries and helps us discriminate the stimulus attributes. The power of discrimination enables us to detect changes in luminance across space and even detect changes over time (flicker). As a result, we are able to able to spot a green circle between a chain of red triangles, without imposing any significant cognitive load on our minds. (Pomerantz J.R and Portillo M 2011) The focus of this paper is on grouping and organization of visual information.
I
will discuss
different paradigms involved in grouping perception, i.e. Spacing and Symmetry, Similarity and Depth. In the current approach,
I
will consider space as perceptually linear where
distance between any two points fall in one plane.
I
will outline the importance of each
paradigm and discuss the implications for a designer to consider when designing interfaces/systems.
I
will use Microsoft Office Word (MS Word) for Mac to illustrate the
effects of the aforementioned variables that influence users navigation in the tool. By
evaluating the visual aesthesis of MS Word, the aim of this paper is to highlight the importance of presenting visual information in an effective manner.
Grouping Grouping is an innate capability of the human brain to extract relations and a structure from the primitive image features without prior knowledge of the content. We as humans, psychologically segment stream of information within proximal stimulus into chunks and make it more comprehendible. Evidence suggests that in the process of visual search, interactions within a display have a significant affect on the visual search performance (Duncan and Humphreys 1989, 1992). Studies showed that the responses in cells in primary visual cortex (V1) and the posteromedial lateral suprasylvian area tend to be synchronized when visual stimuli in receptive fields of cells are moved at the same speed and in same direction. This finding suggests that temporal coding of neural responses is a possible mechanism of the grouping process. (Engel, Kreiter, König, & Singer, 1991)
Spacing & Symmtery Objects that are spatially spatially close to each other perceived to be related. Law of proximity is one of the most important Gestalt laws for organization of information. Shihui Han, using fMR I (functional magnetic resonance imaging), recorded that evenly spaced grouped elements indexed stronger activations in grouping-related neural activities as compared to uniform stimuli. Response rate of the complex cells cells in the V1 shoots up by 40% when a second nearby, collinear collinear object is placed in the excitatory core of the receptive fields. (Kapadia, Ito, Gilbert, and Westheimer 1995). It was
clarified early on that spontaneous organization is based on perceived proximity in
phenomenal phenomenal space, rather than proximity of stimuli st imuli on the retina (Corbin 1942; Rock, I., & Brosgole, L. 1964). Taking the case of MS Word, the alignment for the top three (1) and bottom three (2) buttons, in the Figure 1, illustrate how the adjustment of spacing can help communicate the relation between the elements in the window.
Figure 1
As shown in Figure 1, the buttons that flush right off the text boxes, form a group and helps the user to seamlessly relate this group to the box on its left. (Pomerantz J.R. & Portillo M.C. 2011) At the bottom of the window, the three buttons (3) form a separate group because of the spacing and the horizontal alignment. The text boxes, indicated by the orange dotted lines, form a perfect symmetry with exactly same widt h. Figure 1 serves as a good example to prove the proximity and alignment principle. principle. Evidence suggests that horizontally aligned objects form a stronger sense of grouping for our visual system, as compared to vertically Steward, 1970;
Fi ure 2
aligned objects. (Cairns and Hershenson and Ryder, 1982)
In the Figure 2, the first three icons form one group and t he fourth form one on its own.
Here is how. Although the size and the stylization of the icons are consistent in this panel,
but because of the alignment of THEMES and the icon itself, which is slightly pushed above, user is able to detect the existence of two groups.
Similarity Apart from the proximity, human perception is also affected by the context of the stimuli. Human brain involuntarily relates relates to objects that have similar sensor attributes such as hue, brightness and contrast. Besides the aspect of color, which is the strongest way to suggest relationship, size and shape of the objects also give a sense of similarity (Gestalt). Wang et al (1996), who conducted a study by optically imaging in inferotemporal inferotemporal cortex, found that regional clustering of cells respond to similar features in an image. In the perceptual system, dissimilarity tends to grow with the number of unique features present in the subsequent images.
As shown in the yellow box in Figure 6 below, each r ibbon is perceived as a different group because of styling of the icons and the variation in color. Icons in the Yellow box are bigger and have a difference in depth when compared to the icons in the Blue box. Similarity in the texture and pattern of the buttons in the Red box also emphasizes that elements are related and posses a similar function.
Figure 6
Depth It
has been one of the greatest challenges to represent the three-dimensional (3D) world
using two-dimensional (2D) drawings and images. The human brain picks up the geometrical and contrasting properties of an image and forms the boundaries and the surface representations. In the case of images, contrast is one t he critical factors that gives a near versus far perception. Along with contrast, variation in luminance or brightness also helps rendering an effect effect of relative visibility (Yantis & Jones 1991). 1991). Studies have shown that binocular disparity is one of the most important factors for the depth cues perceived by visual system (Qian 1997). The process is called stereoscopic depth perception in which our brain uses horizontal disparity to estimate the relative depth of the objects. Experiments showed that the disparity (depth) sensitivity of the simple cells in the visual cortex from left-right receptive field shifts causes the vision to perceive the 3D features from a 2D object. Going back to the Figure 1, the grey edges of the white boxes make the text boxes appear as figures sitting over the background. Even with the Check Grammar check box, the check mark within the box has higher contrast and gives the sense s ense of figure-ground perception. Conclusion
Parallel processing parse the word into objects, objects that contain basic set of features. It helps us categorize these features (color, size and orientation) and find distinctions between objects, while sacrificing the fine-grain details of the attributes. (Jeremy M. Wolfe, 1992). Primary purpose of parallel processing is to direct attention to locations containing stimuli of interest. Top-down perceptual process of the visual search has a limited processing capacity to execute intricate tasks. Considering the neurological complexity involved in this process, it is imperative for the designer to use parallel processing sparingly. Age-related differences also affect the pattern perception process of the human brain. Studies show that different cortical regions are activated inside the human brain, after a certain age. All these biological factors should be considered w hen making design choices.
In
case of MS Word, pattern perception has been considered as part of the design. Although
it presents an overwhelming amount of controls on the homepage, designers have given close attention to the concept of grouping throughout the menus and the toolbars. An application that caters to the demands of a population with high age variance, MS Word serves as a perfect example of various g rouping concepts discussed in this paper.
Reference:
Cairns, N. U. and Steward, M. S. (1970). Young childrens orientation of letters as function of axis of symmetry and stimulus a lignment, lignment, Child Development 41, 9931002 Duncan, J. (1984). Selective attention and the organization of v isual information. J ournal ournal of experimental psychology. General , 113(4), 113(4), 501-17. Retrieved from http://www.ncbi.nlm.nih.gov/pubmed/6240521 Gray, C. M., Engel, A. K., König, P., & Singer, W. ~1989!. Oscillatory responses in cat visual cortex exhibit intercolumnar synchronization which reflects global stimulus properties. Nature, 338, 334337. Han, S., Jiang, Y., Mao, L., Humphreys, G. W., & Gu, H. (2005). Attentional modulation of perceptual grouping in human visual cortex: c ortex: functional MRI studies. Human brain mapping, (4), 424-32. mapping, 25 (4), doi:10.1002/hbm.20119 Kramer, a F., & Jacobson, a. (1991). P erceptual organization organization and focused attention: the role of objects and proximity in visual processing. Perception & psychophysics, psychophysics , 50(3), 50(3), 267-84. Retrieved from http://www.ncbi.nlm.nih.gov/pubmed/1754368 Pomerantz, J. R., & Portillo, M. C. (2011). Grouping and emergent features in vision: Toward a theory of basic gestalts. J ournal ournal of experimental psychology. Human perception and performance, performance , 37 (5), (5), 1331-1349. doi:10.1037/a0024330 Rock, I., & Brosgole, L. (1964). Grouping Based on Phenomenal Proximity. J ournal ournal of experimental (6), 531-8. Retrieved from http://www.ncbi.nlm.ni http://www.ncbi.nlm.nih.gov/pubmed/14155415 h.gov/pubmed/14155415 psychology , 67 (6), Solan, Z., & Ruppin, E. (2001). Similarity in perception: a window to brain organization. organization. J ournal ournal of cognitive neuroscience, neuroscience, 13(1), 13(1), 18-30. Retrieved from http://www.ncbi.nlm.nih.gov/pubmed/11224906 Sugita, Y. (1999). G rouping of image fragments in primary visual cortex. Nature, Nature, 401(6750), 401(6750), 269-72. doi:10.1038/45785
Treisman, a. (1982). Perceptual grouping and attention in visual search for features and for objects. J ournal ournal of experimental psychology. Human perception and performance, performance , 8(2), 194-214. Retrieved from http://www.ncbi.nlm.n http://www.ncbi.nlm.nih.gov/pubmed/6461717 ih.gov/pubmed/6461717 Treisman, a M., & Gelade, G. (1980). A feature-integration theory theory of attention. Cognitive psychology , 12(1), 12(1), 97-136. Retrieved from http://www.ncbi.nlm.nih.gov/pubmed/7351125 Tversky, A. (1977). Features of similarity. Psychological Review, 84, 327352. Yantis,S. and Jones,E. (1991).Mechanismsof attentionalselection:temporallymodulatedpr attentionalselection:temporallymodulatedpriority iority tags,Perceptionand Psycho hysics50, 166-178. Wang, G., Tanaka, K., & Tanifuji, M. (1996). Optical imaging of functional organization in the monkey inferotemporal cortex. Science, 272, 1665-1668. Wolfe, J. M., Cave, K. R., & Franzel, S. L. (1989). Guided search: an alternative to the feature integration model for visual search. J ournal ournal of experimental psychology. Human perception and performance, performance , 15 (3), (3), 419-33. Retrieved from http://www.ncbi.nlm.nih.gov/pubmed/2527952 http://www.ncbi.nlm.nih.gov/pubmed/2527952 Wolfe, Jeremy M. (1992). The Parallel Guidance of Visual Attention. Current Directions in Psychological Science, Science, 1(4), 124-128. doi:10.1111/1467-8721.ep1 doi:10.1111/1467-8721.ep10769733 0769733 Qian, N. (1997). Binocular disparity and the perception of depth. Neuron, Neuron, 18(3), 18(3), 359-68. Retrieved from http://www.ncbi.nlm.nih.gov/pubmed/9115731 http://www.ncbi.nlm.nih.gov/pubmed/9115731