Wednesday, March 28, 2007
Saturday, February 17, 2007
Site Seeing DQs: 7-11
1. Proximity, Similarity, Continuance and Closure? How they are used in design:
2.What is visual hierarchy?
Visual hierarchy creates a center of interest that attracts the viewer’s attention. It creates a sense of order and balance. It also establishes a pattern of movement to guide a viewer through a composition. Elements within a visual hierarchy have an easily identifiable order of importance or emphasis. Some things get noticed first, second, and so on. We often depend on the visual hierarchy to make sense of the information.
3. What is visual weight?
Visual weight can be loosely defined as the degree to which an element demands our attention and keeps our interest. Large red type has more visual weight, for example, than small black type. The distribution of visual weight within a layout is the key to creating an informative visual hierarchy. These elements determine where our story begins. They form the center of interest or focal point.
4. What is color coding?
Reusing colors and design motifs within the different elements on each page can make a distinct layout. For example, using the green from your company logo as a background color for your navigation buttons. Color-coding each subsection of your site is a common way to communicate position. It is most effective when the sections of your site have distinct differences. The various colors of the sections provide an indication that your audience has made a distinct change in goals.
- Proximity: Tells us that elements place closely together, when compared to elements far away, will be perceived as a new element: a group. The closer they are, the more likely they are to be seen as a unique visual group.
- Similarity: elements with a lot of common visual characteristics are likely to be grouped together, whereas distinct elements are not. Similarities in size, shape, color, direction, and texture work to group distinct elements together visually.
- Continuance: Tells us that several different elements are likely to be grouped together if their differences are the result of a basic pattern. For example, a series of identical circles progressively deceasing in size.
- Closure: Says that we have a tendency to group elements by filling in the space between them to create larger, more simple forms. We fill in the gaps.
2.What is visual hierarchy?
Visual hierarchy creates a center of interest that attracts the viewer’s attention. It creates a sense of order and balance. It also establishes a pattern of movement to guide a viewer through a composition. Elements within a visual hierarchy have an easily identifiable order of importance or emphasis. Some things get noticed first, second, and so on. We often depend on the visual hierarchy to make sense of the information.
3. What is visual weight?
Visual weight can be loosely defined as the degree to which an element demands our attention and keeps our interest. Large red type has more visual weight, for example, than small black type. The distribution of visual weight within a layout is the key to creating an informative visual hierarchy. These elements determine where our story begins. They form the center of interest or focal point.
4. What is color coding?
Reusing colors and design motifs within the different elements on each page can make a distinct layout. For example, using the green from your company logo as a background color for your navigation buttons. Color-coding each subsection of your site is a common way to communicate position. It is most effective when the sections of your site have distinct differences. The various colors of the sections provide an indication that your audience has made a distinct change in goals.
Sunday, February 11, 2007
Site Seeing DQs: 5-6
1.)What are the The two complaints of web site users?
"i can't find what i am looking for" and "it takes too long." People want to find what they are looking for online, and in a timely, efficient manner.
2.) Links::
External Links: provide paths from your site to specific sites you have determined to be informative or relevant to your audience's goals. Also serve to supplement the content you are providing with additional or supportive information.
Internal Links: the most common links. These link within your site or navigation system. Unique because their positioning and presentation is responsible for orientating your audience and more.
Embedded (internal) Links: They direct your audience to relevant or supplementary info elsewhere within your site. They are much closer in function and appearance to external links than to navigation menus. They simply supply additional or related info relevant to specific portion of text they happen to be reading.
Download Links: Links that lead to any file that might not display within a Web browser window. They are used to provide information in formats more appropriate for particular content and support the need to go beyond what is possible with standard Web pages and images. Examples::PDFs, DOCs, AVIs, WAVs, and more
Action Links: Links that trigger events other than browsing. "submit" or "reset" buttons are common, as well as "go" or "search" next to input fields. They complete a transaction or activate dynamic content.
"i can't find what i am looking for" and "it takes too long." People want to find what they are looking for online, and in a timely, efficient manner.
2.) Links::
External Links: provide paths from your site to specific sites you have determined to be informative or relevant to your audience's goals. Also serve to supplement the content you are providing with additional or supportive information.
Internal Links: the most common links. These link within your site or navigation system. Unique because their positioning and presentation is responsible for orientating your audience and more.
Embedded (internal) Links: They direct your audience to relevant or supplementary info elsewhere within your site. They are much closer in function and appearance to external links than to navigation menus. They simply supply additional or related info relevant to specific portion of text they happen to be reading.
Download Links: Links that lead to any file that might not display within a Web browser window. They are used to provide information in formats more appropriate for particular content and support the need to go beyond what is possible with standard Web pages and images. Examples::PDFs, DOCs, AVIs, WAVs, and more
Action Links: Links that trigger events other than browsing. "submit" or "reset" buttons are common, as well as "go" or "search" next to input fields. They complete a transaction or activate dynamic content.
Thursday, February 8, 2007
Site Seeing: DQs 3-4
1) What is a webmark?
Webmarks: visual "buttons/symbols" that act as icons for web navigation. Just like driving directions, some people need visual maks in addition to street and address names. An example of this would be the small pencil icon at the bottom of this post.
2) Why do macs and PCs display differently?
The difference in monitors is that each monitor has its own settings, the gamma differences between operating systems make windows appear darker than on a Mac. Also, not all web browsers display the same code in the same ways. Typefaces, interface elements, and text sizes are all subject to change between different operating systems.
Webmarks: visual "buttons/symbols" that act as icons for web navigation. Just like driving directions, some people need visual maks in addition to street and address names. An example of this would be the small pencil icon at the bottom of this post.
2) Why do macs and PCs display differently?
The difference in monitors is that each monitor has its own settings, the gamma differences between operating systems make windows appear darker than on a Mac. Also, not all web browsers display the same code in the same ways. Typefaces, interface elements, and text sizes are all subject to change between different operating systems.
Friday, January 26, 2007
Site Seeing: DQ's 1-3
1) Who is Luke Wrobleski and how is he qualified to write about the web?
Luke Wrobleski heads the interface and new media design efforts at the NCSA. He’s designed interfaces for HP, IBM, and Kellog’s. His is also the founder and creative director of LukeW Interface Designs. He studies the theory that explains how people communicate, comprehend, collaborate, and create. He is educated in graphic design, human factors, and computer science.
2) Does LW adhere to a strict sense of rules? (In the preface and 'how to use this book')
Not really, he notes that each site’s unique goals and audience set the guidelines to which you should adhere. He has considerations: points and possible solutions. We are not designing sites for ourselves, therefore we must repeatedly test our web solutions on our target audience to confirm correct decisions.
3) How do you plan on categorizing the info for your portfolio?
Who is your audience and how do you define them?
I plan on creating primary navigation “paths” which sort my works into categories arranged by either medium or by class title. I will possibly have subcategory navigation moving from general to specific. I aim for this portfolio site will be at other students and/or people just interested in creativity. My audience: from teachers to students to friends.
Luke Wrobleski heads the interface and new media design efforts at the NCSA. He’s designed interfaces for HP, IBM, and Kellog’s. His is also the founder and creative director of LukeW Interface Designs. He studies the theory that explains how people communicate, comprehend, collaborate, and create. He is educated in graphic design, human factors, and computer science.
2) Does LW adhere to a strict sense of rules? (In the preface and 'how to use this book')
Not really, he notes that each site’s unique goals and audience set the guidelines to which you should adhere. He has considerations: points and possible solutions. We are not designing sites for ourselves, therefore we must repeatedly test our web solutions on our target audience to confirm correct decisions.
3) How do you plan on categorizing the info for your portfolio?
Who is your audience and how do you define them?
I plan on creating primary navigation “paths” which sort my works into categories arranged by either medium or by class title. I will possibly have subcategory navigation moving from general to specific. I aim for this portfolio site will be at other students and/or people just interested in creativity. My audience: from teachers to students to friends.
Subscribe to:
Posts (Atom)


