This document provides examples and advice related to graphic design, fine art, and web interface design. It discusses concepts like Cubism, Bauhaus, logo design, type design, use of color, contrasts in density and rhythm, mise-en-scene, original artwork, stylistic conceits, movement in 2D surfaces, learning from others, and symmetrical vs asymmetrical presentations. Examples of websites, sketches, and artworks are referenced throughout to illustrate principles of effective visual communication and design.

1. Kick-ass styling tips
20 Rules for Good Design
From Samara, Design Element: A Graphic Style Manual

3. Fine Art
Leonardo da Vinci
Concept of Flight
Concept of Feminine Beauty

4. Commercial Art
Coco Chanel sketch

5. Web Interface Design!!
http://amusement-
construction.com/
mini.htm
Example
provided by
Luke!

7. Fine Art
“Form Carries Meaning.”
Cubism 1908-11: instead of depicting objects from one viewpoint,
Braque and Picasso depicted their subject from a multitude of
viewpoints to represent the subject in a greater context.

8. Graphic Art
The Bauhaus
The design innovations commonly associated with Walter Gropius
and the Bauhaus - the radically simplified forms, the rationality
and functionality

9. Web Interface Design!!
http://www.ohhcrapp.net/
Examples provided by
Aaron!

11. Fine Art
Good design + aesthetics assumes that the visual language of the
piece -- its internal logic -- is resolved to address all its parts so they
reinforce, restate and reference each other.

12. Graphic Art
Ad “Campaigns”
Integration and consistency in ad campaigns helps promote a
consistent design message across media and across platforms.

13. Web Interface Design!!
http://www.volkswagen.com/
vwcms/international_portal/
virtualmaster/en.html
Example provided by
Bree!

15. Graphic Art

16. Graphic Art

17. Web Interface Design!!
http://www.mtv.com
Example-ish provided
by
Ben!

19. Fine Art
Focus the viewer’s attention on one important thing first and then
lead them through the rest.

20. Graphic Art
Emphasis
Emphasis is the idea that some things are more important
than others. Must establish a focal point and a visual
heirarchy.

22. Fine Art
Know what colours might mean to your audience.

23. Graphic Art
Logo design
Colour carries an abundance of psychological and emotional
meaning.

25. Fine Art
Malevich: The more stuff jammed into a given space,
the harder it is to see what we’re supposed to be seeing.

26. Graphic Art

28. Film Mise En Scene
Hitchcock: Space calls attention to imminent narrative action.

29. Graphic Art

30. Web Interface Design!!
www.commarts.com
Example provided
by
Adam!

32. Type needs to relate compositionally to everything else in the design.

34. Web Interface
Design??
http://
www.indianpad.com/
pics/230587/pictures-
made-of-text/
Example-ish provided
by
Kyle!

36. Graphic Art
Type must still transmit information.

37. Web Interface Design??
or can be Web “Art.”
THIS
Example-ish provided
by
Savanna!

39. Graphic
design comes
with an
agenda.

42. Create
contrasts
in density
and
rhythm.
Give
spaces
between
things a
pulse.

43. Create
contrasts
in density
and
rhythm.
Give
spaces
between
things a
pulse.

44. Web Interface Design??
This
Example-ish provided by
Brianna!

48. Web Interface Design??
http://vandelaydesign.com/
blog/design/photoshop-
lighting-effects/
Example-ish
provided by
Savanna!

50. A great deal of the process of understanding visual material is the ability to
distinguish the difference between things.

52. Designers need to perceive the visual presence — weight, texture, movement,
angularity, transparency, contour.

53. Web Interface Design??
Example-ish provided
by
Marissa!

55. Make what
you need or
pay
someone
else to
make
original
artwork for
you.

56. Web Interface Design??
This
Example-ish provided
by
Brianna!

58. Design and
style a
project
around the
meaning, not
the
audience’s
expectations
of current
stylistic
conceits.

59. Web Interface Design!!
h"p://www.future‐
farm.com/
Example
provided by
Angela!

61. Designers have to work hard to give 2 dimensional surfaces the
sense of movement.

62. Web Interface Design??
Example-ish provided
by
Shannon!

64. Learn from the work of others but give it your own spin.

66. Web Interface Design!!
h"p://
www.thebeatlesrockband.com/
videos/tvcommercial
Example provided by
Nathan!

68. Symmetrical presentations are often static and offer little movement.