CSE 686 Internet Programming Summer ‘06 PROXIMITY Aditya Kiran Kota

Principle of Proximity The principle of proximity states that group related items together and move them physically close to each other. Items or groups of information that are not related to each other should not be in close proximity (nearness) to the other elements.

Physical closeness implies a relationship My Flower List Marigold Pansy Rue Woodbine Daisy Cowslip Carnation Primrose My Flower List Marigold Pansy Rue Woodbine Daisy Cowslip Carnation Primrose

How many times does your eye stop to look at something? Does your eye stop 5 times? Where do you begin reading?

Even confusing… Now there are two bold phrases, where do you begin? Do you start in the upper left or from the center?

When several items are in close proximity to each other, they become one visual unit rather than several separate units. Now the card is organized both intellectually and visually. Thus it communicates more clearly.

Does any item of information seem related to any other judging from the placement? The two items on the top left are in close proximity to each other, implying a relationship. But should these two have a relationship? Here date and the issue information should be closer together since they both identify this particular issue.

With proper relationship Changed everything from all caps to lowercase, which gives room to make the title stronger and bolder Changed corners from rounded to straight, gives the piece more cleaner look Enlarged the airplane and let it break the boundary, a common graphics trick to open up the space.

Grouping like elements in close proximity Sometimes when grouping like items in close proximity, there is a need to make some changes, such as in the size or weight or placement of text or graphics Text does not have to be a 12 point! Information that is subsidiary to the main message, such as the volume number and the year of a newsletter, can often be a small as 7 or 8 point

An Example Chamber Concert Series Egley Junior College Friday February 8 to 8pm. Alexandra String Quartet Mozart,K387,Beethoven,Opus 59,#1 Friday, March 1,8pm. Trio Artaria Beethoven “Archduke” Trio, and trios by Haydn,violin Reception following concert in Egley Art Gallery. All concerts in Newman Auditorium, Emeritus Hall, Community Education Tickets $10 to $8 For Ticket information phone 315-3213

Proximity doesn’t mean that everything is closer together; it means elements are intellectually connected and have some sort of communication relationship. Chamber Concert Series Alexandra String Quartet Mozart,K387,Beethoven,Opus 59,#1. Friday February 8 to 8pm Trio Artaria Beethoven “Archduke” Trio, and trios by Haydn,violin Friday, March 1,8pm. Reception following concert in Egley Art Gallery. Egley Junior College All concerts in Newman Auditorium, Emeritus Hall, Community Education Tickets $10 to $8 For Ticket information phone 315-3213

The simple principle of proximity can make web pages easier to navigate collecting into logical groups.

Information grouped in logical clump

Summary of proximity When several items are in close proximity they become one visual unit rather than several separate units. Items relating to each other should be grouped together.

Be conscious of: Where your eye is going Where do you start looking What path do you follow Where do you end up Where does your eye go next You should be able to follow a progression through the piece, from a definite beginning to a definite ending.

The basic purpose: How to get it: The basic purpose of proximity is to organize. Organized information is more likely to be read and more likely to be remembered How to get it: Count number of visual elements on a page by counting number of times your eye stopped. If more than 3 to 5 times on the page, see which of the separate elements can be grouped together into closer proximity.

What to avoid: Avoid too many separate elements on a page. Don’t stick things in the corners and in the middle. Avoid leaving equal amount of white spaces between elements unless each group is part of subset. Create a relationship among elements with close proximity.

Reference Williams, Robin.,(2003),” The Non-Designer's Design Book, (2nd Edition)”, Peachpit Press, USA.

Any Questions