Visual Design is designed to enable students to gain an increasing accomplishment and independence in their representation of ideas in different fields of design and to understand and value how graphic, wearable, product, and interior/exterior design invite different interpretations and explanations.
Visual design is not just about making your application look pretty. Good visual design is about communication. A well-designed application will make it easy for the user to understand the information that is being presented, and show them clearly how they can interact with that information. If you can achieve all that, your application will look good to the user, even if it doesn't have any fancy graphics or spinning logos.
The primary purposes of graphic design are to:
- Create a clear visual hierarchy of contrast, so you can see at a glance what is important and what is peripheral
- Define functional regions of the page
- Group page elements that are related, so that you can see structure in the content
a) Consistency
Establish a layout grid and a style for handling your text and graphics, and then apply it consistently to build rhythm and unity across the pages of your site. Repetition is not boring; it gives your site a consistent graphic identity that creates and then reinforces a distinct sense of “place” and makes your site memorable. A consistent approach to layout and navigation allows users to adapt quickly to your design and to predict with confidence the location of information and navigation controls across the pages of your site.
If you choose a graphic theme, use it throughout your site. The Hiram College home page banner sets the graphic theme for the site and introduces distinctive typography and a set of navigation tabs. Note how the typography and the navigation theme are carried over to the interior banners.
b) Contrast
The primary task of graphic design is to create a strong, consistent visual hierarchy in which important elements are emphasized and content is organized logically and predictably. Graphic design is visual information management, using the tools of page layout, typography, and illustration to lead the reader’s eye through the page. Readers first see pages as large masses of shape and color, with foreground elements contrasting against the background field. Then they begin to pick out specific information, first from graphics if they are present, and only after this do they start parsing the harder medium of text and begin to read individual words and phrases
The overall graphic balance and organization of the page is crucial to drawing the user into your content. A page of solid text will repel the casual reader with a mass of undifferentiated gray, without obvious cues to the structure of your information. A page dominated by poorly designed or overly bold graphics or typography will also distract or repel users seeking substantive content. You will need to strike an appropriate balance between attracting the eye with visual contrast and providing a clear sense of organization, through the variations in contrast that result from proper proximity, groupings, figure-ground relationships, and headings. Visual balance and appropriateness to the intended audience are the keys to successful design decisions. The most effective designs for general audiences employ a careful balance of text and links with relatively small graphics. These pages load quickly yet have substantial graphic impact.
c) Color and contrast in typography
Color and contrast are key components of universal usability. Text legibility is dependent on the reader’s ability to distinguish letter forms from the background field. Color differentiation depends mostly on brightness and saturation. Black text on a white background has the highest level of contrast since black has no brightness and white is all brightness. Hue is also a factor, with complementary colors, such as blue and yellow, producing the greatest contrast. Be sure your color choices do not make it hard for users to distinguish text from background. Also, never forget that almost 10 percent of male readers have some trouble distinguishing fine shades of red from shades of green.
d) Contrast variability
Web pages viewed on mobile devices are usually compromised by the mobile environment: small screens, tiny text, lack of optimal screen resolution and color, and sun or other lighting glare all degrade the legibility of web pages seen outside the office or home environment. Even many laptops have displays that don’t do a good job of showing fine color or shade distinctions, and the colors on pages viewed via computer projector are normally washed out. Test your designs on a number of devices and laptops and in a variety of conditions, especially if you are using subtle colors to define important page functions or content. In general it’s best to use a more robust, high-contrast typography color scheme.
Horizontal rules, decorative graphic bullets, prominent icons, and other visual markers have their occasional uses, but apply each sparingly (if at all) to avoid a patchy and confusing layout. The tools of graphic emphasis are powerful and should be used only in small doses for maximum effect. Overuse of graphic emphasis leads to a “clown’s pants” effect in which everything is equally garish and nothing is emphasized.
Color palettes chosen from nature are an almost infallible guide to color harmony, particularly if you are not a trained graphic designer. Subtle, desaturated colors make the best choices for backgrounds or minor elements. Avoid bold, highly saturated primary colors except in regions of maximum emphasis, and even there use them cautiously.
e) White space
With today’s larger display screens and more complex graphic interfaces, your web page is likely to be sharing the screen with many other windows and desktop elements. Use white space to avoid crowding the edges of the browser windows with important elements of your page content. In fixed-width layouts, consider floating the page in the center of the browser window. If your page width is reasonable, this should produce some visual relief for your page even on a crowded computer screen.
All graphic design is ultimately the management of white space—the ground field behind all figure elements on the page. To understand graphic design, you must appreciate that the ground field around page elements is as active and important a part of the design as any figure element on the page. Filling all the white space on a page is like removing all the oxygen from a room—an efficient use of space perhaps, but decidedly difficult to inhabit.
f) Style
Don’t set out to develop a “style” for your site, and be careful about simply importing the graphic elements of another web site or print publication to decorate your pages. The graphic and editorial style of your web site should evolve as a natural consequence of consistent and appropriate handling of your content and page layout. Prefer the conventional over the eccentric, never let the framing overwhelm the content, and remember that the best style is one that readers never notice—where everything feels logical, comfortable (even beautiful) but where a heavy-handed design never intrudes on the experience.
g) Simplicity
All users benefit from clear and consistent web site design, but for some users it is critical. With a lack of spatial cues and with radically different approaches to navigation that must be relearned at every site, vision-impaired users can easily get disoriented or lost on the web. For people with cognitive disabilities, such as memory or learning disabilities, this difficulty is magnified many fold. Stick with a simple language and navigation applied consistently throughout your site, and everyone will benefit.
Reference: http://gd.tuwien.ac.at
No comments:
Post a Comment