mmd 2093-ch2 aranotes

8/7/2019 MMD 2093-ch2 aranotes

1/35

CHAPTER 2

Visual Design

SARAH NUR AHMADMULTIMEDIA COLLEGE (N) SDN BHD

SARAH NUR AHMADMULTIMEDIA COLLEGE (N) SDN BHD


2/35

Visual Design Elements

Line

Color

Typography

Form/Shape

Space

Texture

Value


3/35


4/35

Vertical Lines


5/35

Horizontal Lines


6/35

Diagonal Lines


7/35

Curved Lines


8/35

Color

Color has an immediate

and profound effect on a design.

Types

Warm Colors

Reds, oranges, yellows

Cool ColorsBlues, purples, greens

Colors can affect how humans feel and act.


9/35

Color


10/35

Keep it simple

Limit number of fonts per page and per site

Use the same fonts consistently throughout the site

Make good font choices

Sans serif vs. serif

Commonly installed fonts

Mood

Readability

USE CAPITALIZATION SPARINGLY


11/35

Font Moods

What mood does this font evoke for you?

What about this one? Is it formal? Casual?

Would this font give your page a professional look? Why or why not?

What assumptions about the content WOULD YOU MAKE FROM THIS FONT?

Can you even read what this says?If you had to read a whole page of

this, how would you feel?


12/35

Form and Shape

The shape, outline, or configuration of anything.

Examples

Squares

Circles

Ellipses

Ovals

Rectangles

Triangles


13/35

Form and Shape


14/35

Space

By incorporating the use of spacein your design, you can enlarge or reduce the

visual space.

Types

Open, uncluttered

spaces

Cramped, busy

Unused vs. good use

of space


15/35

Positive and negative space refers to the juxtaposition of figure

and ground in a composition. The objects in the environment

represent the positive space, and the environment itself is the

negative space.

white space is often referred to as negative space


16/35

Texture

The surface look or feel of something.

TypesSmooth surface

Reflects more light and, therefore, is a more intense

color.

Rough surface

Absorbs more light and, therefore, appears darker.


17/35

Smooth Texture


18/35

Rough Texture


19/35

Value

The relative lightness or darkness of a color.

Methods

Shade

Degree of darkness of a colorTint

A pale or faint variation of a color


20/35

Visual Design PrinciplesThere are five principles that encompass an

interesting design.

Balance

Rhythm

Emphasis

Proportion and scale

Unity


21/35

Balance

Parts of the design are equally distributed to create a sense of

stability.

There can be physical as well as visual balance.Types

Symmetrical or Formal Balance

Asymmetrical or Informal Balance

Radial BalanceVertical Balance

Horizontal Balance


22/35


23/35

Balance

Asymmetrical or Informal Balance

Parts of the design are not identical but are

equal in visual weight.


24/35

Balance

Radial Balance

Design Elements radiate

outward from the center.


25/35

Balance

Vertical BalanceThe top and bottom parts are equal.


26/35

BalanceHorizontal Balance

The left and right

parts are equal.


27/35

Repeated use of line, shape, color, texture or pattern.

Types

Regular rhythm

Graduated rhythm

Random rhythm

Gradated rhythm


28/35


29/35

RhythmGraduated Rhythm

The beats of the element become closer or further

apart as they move.


30/35

Rhythm

Random RhythmThe beats of the element are random

or are at irregular intervals.


31/35

RhythmGradated Rhythm

The repeated element is

identical with the exception

of one detail increasing or

decreasing gradually with

each repetition.


32/35

Emphasis

Points of attention in a design.

The feature in a design that

attracts ones eye.

The focal point.

Emphasis can be achieved

through size, placement, color

and use of lines.

The most personal aspect of a

design.


33/35

Proportion and Scale

Comparative relationships

between elements in a design

with respect to size.

3:5 ratio is known as theGolden Mean.

Scale

The proportions or size of

one part of the image in

relationship to the other.


34/35

Unity Unity is applying consistent use of lines, color, and texture

within a design.

To be harmonious.


35/35

Unity

mmd 2093-ch2 aranotes

Documents