design principles applying principles to create appealing and professional printed and electronic...

19
Design Principles Applying principles to create appealing and professional printed and electronic publications Principles of Information Technology 1 Copyright © Texas Education Agency, 2013. All rights reserved.

Upload: sharyl-kelly

Post on 22-Dec-2015

213 views

Category:

Documents


1 download

TRANSCRIPT

Page 1: Design Principles Applying principles to create appealing and professional printed and electronic publications Principles of Information Technology 1Copyright

1

Design Principles

Applying principles to create appealing and professional printed

and electronic publications

Principles of Information Technology

Copyright © Texas Education Agency, 2013. All rights reserved.

Page 2: Design Principles Applying principles to create appealing and professional printed and electronic publications Principles of Information Technology 1Copyright

2

OBJECTIVES

List the four design principles

Define the four design principles

Identify characteristics of the four design principles

Identify publishing techniques that demonstrate the four design principles

Classify webpage designs according to the use of the four design principles

Copyright © Texas Education Agency, 2013. All rights reserved.

Page 3: Design Principles Applying principles to create appealing and professional printed and electronic publications Principles of Information Technology 1Copyright

3

BASIC DESIGN PRINCIPLES

Contrast

Repetition

Alignment

Proximity

Copyright © Texas Education Agency, 2013. All rights reserved.

Page 4: Design Principles Applying principles to create appealing and professional printed and electronic publications Principles of Information Technology 1Copyright

4

CONTRASTDefinition:

A method of design that emphasizes the differences between objects that are dissimilar; it purposely brings out their differences to set things in opposition.

Copyright © Texas Education Agency, 2013. All rights reserved.

Page 5: Design Principles Applying principles to create appealing and professional printed and electronic publications Principles of Information Technology 1Copyright

5

REPETITION

Definition:

A method of design that purposely duplicates elements or aspects of elements within the same document.

Copyright © Texas Education Agency, 2013. All rights reserved.

Page 6: Design Principles Applying principles to create appealing and professional printed and electronic publications Principles of Information Technology 1Copyright

6

ALIGNMENTDefinition:

A method of design that uses spatial properties to determine the optimal placement of objects or groups of objects.

Copyright © Texas Education Agency, 2013. All rights reserved.

Page 7: Design Principles Applying principles to create appealing and professional printed and electronic publications Principles of Information Technology 1Copyright

7

PROXIMITY

Definition:

A method of design that uses spatial properties to purposely place related items together.

Copyright © Texas Education Agency, 2013. All rights reserved.

Page 8: Design Principles Applying principles to create appealing and professional printed and electronic publications Principles of Information Technology 1Copyright

8

ASPECTS OF CONTRAST

Items must have opposing elements Needs to be strong to be effective Can be demonstrated using

Color Size Objects Alignment

Copyright © Texas Education Agency, 2013. All rights reserved.

Page 9: Design Principles Applying principles to create appealing and professional printed and electronic publications Principles of Information Technology 1Copyright

9

ASPECTS OF CONTRAST

Setting font color in opposition to background color

1

Setting font color in opposition to background color

2

Setting font color in opposition to background color

3

Setting font color in opposition to background color

4

Copyright © Texas Education Agency, 2013. All rights reserved.

Page 10: Design Principles Applying principles to create appealing and professional printed and electronic publications Principles of Information Technology 1Copyright

10

ASPECTS OF CONTRAST

1

2

Font style of

• title is same• use bold to create contrast

4

3Font s ty l e o f

• title is same• use kerning to create contrast

Font style of

• title is same • use size increase to create contrast

Font style of

• title is same• use combination of the above to create contrastCopyright © Texas Education Agency, 2013. All rights reserved.

Page 11: Design Principles Applying principles to create appealing and professional printed and electronic publications Principles of Information Technology 1Copyright

11

ASPECTS OF REPETITION

Items must have obvious similarities Needs to be strong to be effective Can be demonstrated using

Color Objects Alignment

Copyright © Texas Education Agency, 2013. All rights reserved.

Page 12: Design Principles Applying principles to create appealing and professional printed and electronic publications Principles of Information Technology 1Copyright

12

ASPECTS OF REPETITION

1

2 4

3Repeating Font

• style choice for • all text on document• creates unity

Repeating Colors

• in text and objects• creates unity

Random font

• style choices • creates conflict

Random Color

• choices for objects• creates conflict

Copyright © Texas Education Agency, 2013. All rights reserved.

Page 13: Design Principles Applying principles to create appealing and professional printed and electronic publications Principles of Information Technology 1Copyright

13

ASPECTS OF REPETITION

1

2 4

3Repeating images

• using a duplicate of an image, even resized, creates unity

Repeating images

• using different images, even with a common theme, is distracting

Repeating images

• using a duplicate of an image, re- colored, is acceptable

Repeating images

• using different images, even of the same object, can be distracting

Copyright © Texas Education Agency, 2013. All rights reserved.

Page 14: Design Principles Applying principles to create appealing and professional printed and electronic publications Principles of Information Technology 1Copyright

14

ASPECTS OF ALIGNMENT

Items must have obvious spatial placement Needs to be visually noted instantly to be effective All items should significantly support the purpose

of the publication Element placement should never be random Can be demonstrated using

Object rotation Text direction Line spacing Object size

Copyright © Texas Education Agency, 2013. All rights reserved.

Page 15: Design Principles Applying principles to create appealing and professional printed and electronic publications Principles of Information Technology 1Copyright

15

ASPECTS OF ALIGNMENT

1

2 4

3Arranging Text

• all text is left aligned• bullets are indented• but still aligned left

Arranging Text

• title is left aligned• bullets are

• right aligned

Arranging Text

• title is centered• bullets are

• centered as well

Text• text can be• arranged other than• horizontally

n

Arr

ang

g

i

Copyright © Texas Education Agency, 2013. All rights reserved.

Page 16: Design Principles Applying principles to create appealing and professional printed and electronic publications Principles of Information Technology 1Copyright

16

ASPECTS OF PROXIMITY

Provides organization for the viewer All elements are supportive of main purpose

Elements are then divided into subgroups depending on the subtopic points

Items related to each subtopic should be spatially grouped together in an arrangement

Can be demonstrated using Color Size Objects Alignment

Copyright © Texas Education Agency, 2013. All rights reserved.

Page 17: Design Principles Applying principles to create appealing and professional printed and electronic publications Principles of Information Technology 1Copyright

17

ASPECTS OF PROXIMITY

1

2 4

3Plumbing Emergency

• (210) 971-1352• James Madison• fast response time

James Madison

• Fast response time• Plumbing Emergencies• (210) 971-1352

(210) 971-1352

• Plumbing Emergency• James Madison• Fast response time

Plumbing Emergency(210) 917-1352

• James Madison• fast response time

Copyright © Texas Education Agency, 2013. All rights reserved.

Page 18: Design Principles Applying principles to create appealing and professional printed and electronic publications Principles of Information Technology 1Copyright

18

REVIEW

The four design principles Contrast—emphasizes the differences between

objects that are dissimilar

Repetition—purposely duplicates elements

Alignment—determines the optimal placement of objects

Proximity—places related items togetherCopyright © Texas Education Agency, 2013. All rights reserved.

Page 19: Design Principles Applying principles to create appealing and professional printed and electronic publications Principles of Information Technology 1Copyright

19

ACTIVITY #1 Using the Internet – navigate to various websites that

demonstrate use of the four design principles.

Place a copy of the screen snapshot into a word processing document.

Resize the snapshot if needed. Above the snapshot, place a label to identify the design

principle represented. Beneath the snapshot, create a textbox. The textbox should contain text that displays

the definition of the design principle listed AND A justification or reasons why the snapshot represents that

principle. Copyright © Texas Education Agency, 2013. All rights reserved.