We spent last week trying to recognize the need for something unique, but familiar.

2. We spent last week trying to recognize the need for something unique, but familiar.

3. Recognize our own knowledge level and limitation with: fonts, text & writing; graphics and artistic creations; photography; page layout; audio content development and production; video content development and production – ‘multimedia’ Understanding what appeals to people, and that we all have different reasons for doing different things: life cycles, demographics, experiences, personal characteristics…

4. Your site’s look and assets • Text for the pages – speculative copy • Needs analysis & treatment • Wireframes • Starting to plan for audio, image and video content • Starting to plan for graphics content

5. Content this week • Needs analysis and treatment • One page Résumé to go on your site • Wireframes to plan the look • ‘audio explanations’ – short ‘about me’ ‘click here to learn more’ ‘why this is interesting’ – speculative, but start focusing on final

6. Chapter 1: Understanding what the media are today versus what the media were: Multimedia Foundations Chapter 2: Understanding computer technology Chapter 3: Understanding creativity, the communication process and how we connect with an audience / users: Planning & Evaluation Chapter 4…Elements and issues of Design:

7. But we’ll move around a bit differently than the structure of the book… HTML, CSS and JavaScript ‘Web Page Assets’ – the ‘copy’ that goes on the pages, the still images, the fonts, the graphics, the audio content, the video content, the documents, etc. So we move after Chap. 4 to Chap. 8 (Text), Chap. 10 (Photography), then Chap. 5 (Page Layout)

8. Seeing and perceiving are two different things. Design is the method of putting form and content together. Design, just as art, has multiple definitions; there is no single definition. Design can be art. Design can be aesthetics. Design is so simple, that’s why it is so complicated. As we have said: come up with an idea, write up a Treatment, then start to visualize it with Wireframes

9. The congressional lawmakers who penned the Bill of Rights provided the content for this illustration of the First Amendment. A graphic designer created its form. Source: Courtesy of the Freedom Forum. Content and Form 

10. Content and Form Form is this what? Your Name

11. Content and Form Content &form are complementary components of a visual design. Both are required for success. Without good content, even the best designs and visual treatments fall flat. “Content is king” “Eye candy” describes something that is visually appealing but lacking in substantive value.

12. Content and Form Many tools at our fingertips that we can use to create an eye-catching first impression. -- the WOW factor, or hook, BUT… May get attention -- without meaningful content, people lose interest and move on. (radio commercial) No substitute for a good message, and in the absence of a compelling story or idea, good designs are nothing more than eye candy.

13. Aesthetics • We make perceptual judgments about visual beauty every day • In professional design, there are industry-specific rules and guidelines – applied aesthetics • Learning these guidelines is important – design choices influence choices made during production • Having an aesthetic framework draws you away from unfounded sensibilities and towards informed observations

14. A visual communicator’s job is to fill empty space with meaningful content that communicates a message.

15. Creating a radio commercial • Do you know the style, have the creative understanding, know what are good aesthetics, what is good form? • Apply same to other elements of multimedia • Most of you don’t – despite the classes you have already taken

16. How skilled are you at… • Drawing, art? • Photography? • Graphic Design? • Videography?

17. The Field of View A camera sees only what the photographer wants it to see. Not just the technical skills – that’s vocational school. Do you understand the theory and have skill with the art? ‘Cropping the image’ / visualization / ‘Niagara Falls’

18. Can you mentally then physically lay things out on the grid, properly? Our images are based on a grid of square ‘dots’

19. Can you place the subject versus the white space correctly in the frame?

20. Elements of Design Principles of Design Color Dot Form Line Pattern Shape Space Texture Unity: Alignment, Proximity, Similarity and Repetition Emphasis: Contrast, Color, Depth and Proportion Perceptual Forces: Balance, Continuation, Figure-Ground and Psychological Closure

21. Composing with DOTS… “The whole is greater than the sum of its parts…”

22. The element of line…

23. Lines add energy Lines guide the eye

24. The element of shape…

25. The element of form… How is the illusion of the 3rd dimension achieved here in a two-dimensional image?

26. Lighting, Texture, Pattern, and Color …are used in these images to achieve a desired effect or mood.

27. Boy or girl? What role does color play in your decision?

28. Observe how the designer of this layout for the U.S. Coast Guard website incorporated the laws of proximity, alignment, similarity, and repetition to achieve unity.

29. How are the principles of similarity and repetition put to use in these branded logos created to promote two related programs?

30. Proximity, alignment, similarity, and repetition… can you see it?

31. Contrast, color, depth, proportion

32. Balance / symmetrical & asymmetrical Proportionality… Depth

33. Color, contrast and balance…

34. Rule of Thirds

36. Some Chapter 4 terms

37. The portion of an image where no visual content exists. Negative space / white space

38. A continuous visual line that’s created by the real or apparent movement of subjects within the frame. Motion Vector

39. A cinematic technique that involves tilting the camera so the horizon is not parallel to the bottom of the frame. Dutch Tilt

40. The x-axis refers to the ____ plane from left to right, or width. The y-axis refers to the ______ plane from bottom to top, or height. The z-axis is _______ to the x- and y- axes and represents ___________. Horizontal / vertical / perpendicular / depth

41. A method of achieving compositional balance, whereby equilibrium is achieved using objects of similar shape, color, and size, equally weighted on opposite sides of the frame. Symmetrical Balance

42. A compositional tool for producing visually appealing images using asymmetrical balance by conceptually dividing up the design space into thirds both horizontally and vertically. Rule of Thirds

43. The portion of an image where visual elements reside (lines, shapes,forms, etc.). Positive Space

44. A continuous visual line that’s created by an object or subject that points conspicuously in a given direction. Index Vector

45. The color shade of an object as a single point on the color spectrum. We refer to colors most often by this. Hue (red, green, blue, etc.)

46. A method of printing photographs in newspapers, formed with black dots of various shades of gray. Halftone Image

47. A colorless image or object containing only variations of white and black. Grayscale

48. A boundary that defines the inclusive area of a design space where visual elements reside. frame

49. ____ is the tangible essence of a work: the stories, ideas, and information that we exchange with others, while ____is the manner in which content is designed, packaged, and delivered for consumption. Content / form

50. The combination and arrangement of visual elements in an artistic form. composition