03.08.2017 Views

2 Evolution

You also want an ePaper? Increase the reach of your titles

YUMPU automatically turns print PDFs into web optimized ePapers that Google loves.

The <strong>Evolution</strong> of<br />

Traditional to<br />

New Media<br />

FLOR P. PONCIO<br />

SENIOR HIGH SCHOOL<br />

BCHS-MAIN


Objectives<br />

Discuss the different media options<br />

available to graphic designers<br />

Explain how graphic communication and<br />

media are interrelated<br />

Explain how media can affect the<br />

delivery and perception of graphic<br />

content<br />

PONCIO, Flor P.<br />

Medial and Information Literacy<br />

2


What is media?<br />

“A medium is the delivery means or channel for<br />

communicating a written, verbal, or visual<br />

message” (220). The plural term is media.<br />

Print Media<br />

Electronic Media<br />

PONCIO, Flor P.<br />

Medial and Information Literacy<br />

3


Print media<br />

BOOKS<br />

ANNUAL<br />

REPORTS<br />

BILL<br />

BOA<br />

RDS<br />

MAGA<br />

ZINES<br />

BRO<br />

CHU<br />

RES<br />

NEWS<br />

PAPERS<br />

PONCIO, Flor P.<br />

Medial and Information Literacy<br />

4


Electronic media<br />

PONCIO, Flor P.<br />

Medial and Information Literacy<br />

5


Cave<br />

Drawings<br />

Hieroglyphics<br />

Pictograms<br />

(cuneiform)<br />

Alphabet<br />

The <strong>Evolution</strong> of Media<br />

Illuminated<br />

Manuscripts<br />

Movable Type<br />

Lithography<br />

Motion Pictures<br />

& Animation<br />

Radio<br />

Television<br />

Computer<br />

Animation<br />

New Media<br />

PONCIO, Flor P.<br />

Medial and Information Literacy<br />

6


Cave<br />

Drawings<br />

Hieroglyphics<br />

Pictograms<br />

(cuneiform)<br />

Alphabet<br />

Illuminated<br />

Manuscripts<br />

Movable Type<br />

Lithography<br />

Motion Pictures<br />

& Animation<br />

Radio<br />

Television<br />

Cave<br />

Drawings<br />

- Prehistoric people painted<br />

pictorial representations:<br />

• Animals<br />

• Humans<br />

• Symbolic shapes<br />

on the walls of caves.<br />

Computer<br />

Animation<br />

New Media<br />

PONCIO, Flor P.<br />

- Visual form to verbal content, a process called graphic<br />

communication.<br />

Medial and Information Literacy<br />

7


Cave<br />

Drawings<br />

Hieroglyphics<br />

Pictograms<br />

(cuneiform)<br />

Alphabet<br />

Illuminated<br />

Manuscripts<br />

Cave<br />

Drawings<br />

Movable Type<br />

Lithography<br />

Motion Pictures<br />

& Animation<br />

Radio<br />

Television<br />

Computer<br />

Animation<br />

New Media<br />

PONCIO, Flor P.<br />

Medial and Information Literacy<br />

8


Cave<br />

Drawings<br />

Hieroglyphics<br />

Pictograms<br />

(cuneiform)<br />

Alphabet<br />

Illuminated<br />

Manuscripts<br />

Movable Type<br />

Lithography<br />

Motion Pictures<br />

& Animation<br />

Radio<br />

Television<br />

Computer<br />

Animation<br />

New Media<br />

PONCIO, Flor P.<br />

Hieroglyphics<br />

Crude images evolved<br />

into simplified pictorial<br />

representations called<br />

symbols or<br />

hieroglyphics. The type<br />

of media used was<br />

paint on papyrus, a<br />

type of paper.<br />

Medial and Information Literacy<br />

9


Cave<br />

Drawings<br />

Hieroglyphics<br />

Pictograms<br />

(cuneiform)<br />

Pictograms<br />

Alphabet<br />

Illuminated<br />

Manuscripts<br />

Movable Type<br />

Lithography<br />

Motion Pictures<br />

& Animation<br />

Radio<br />

Television<br />

Computer<br />

Animation<br />

New Media<br />

PONCIO, Flor P.<br />

(cuneiform)<br />

• Evolved into more<br />

abstract, linear<br />

symbols.<br />

• The type of media<br />

used was<br />

inscriptions on clay,<br />

stone, metal, and<br />

other hard<br />

materials.<br />

Medial and Information Literacy<br />

10


Cave<br />

Drawings<br />

Hieroglyphics<br />

Pictograms<br />

(cuneiform)<br />

Alphabet<br />

Illuminated<br />

Manuscripts<br />

Movable Type<br />

Lithography<br />

Motion Pictures<br />

& Animation<br />

Radio<br />

Alphabet<br />

Later, the cuneiform<br />

script was reduced to a<br />

collection of 22<br />

characters, a precursor<br />

to today’s alphabet.<br />

Television<br />

Computer<br />

Animation<br />

New Media<br />

PONCIO, Flor P.<br />

Medial and Information Literacy<br />

11


Cave<br />

Drawings<br />

Hieroglyphics<br />

Pictograms<br />

(cuneiform)<br />

Alphabet<br />

Illuminated<br />

Manuscripts<br />

Movable Type<br />

Lithography<br />

Motion Pictures<br />

& Animation<br />

Radio<br />

Television<br />

Computer<br />

Animation<br />

New Media<br />

PONCIO, Flor P.<br />

Lithography<br />

During that period,<br />

visual communication<br />

began to evolve by<br />

integrating graphic and<br />

fine arts into<br />

communication pieces.<br />

• Lithography allowed<br />

artists to reproduce<br />

colored imagery by<br />

printing from inked<br />

stones.<br />

Medial and Information Literacy<br />

12


Cave<br />

Drawings<br />

Hieroglyphics<br />

Pictograms<br />

(cuneiform)<br />

Alphabet<br />

Illuminated<br />

Manuscripts<br />

Movable Type<br />

Lithography<br />

Motion Pictures<br />

& Animation<br />

Radio<br />

Television<br />

Computer<br />

Animation<br />

New Media<br />

PONCIO, Flor P.<br />

Illuminated<br />

Manuscripts<br />

Early forms of today’s<br />

media took shape during<br />

the Middle Ages when bibles<br />

and psalm books were hand-assembled for the<br />

wealthy class.<br />

These illuminated manuscripts were penned with<br />

a feather quill onto vellum, a thin sheet of calf or<br />

Medial and Information Literacy<br />

sheep skin.<br />

13


Cave<br />

Drawings<br />

Hieroglyphics<br />

Pictograms<br />

(cuneiform)<br />

Alphabet<br />

Movable<br />

Type<br />

Illuminated<br />

Manuscripts<br />

Movable Type<br />

Lithography<br />

Motion Pictures<br />

& Animation<br />

Radio<br />

Television<br />

Computer<br />

Animation<br />

New Media<br />

PONCIO, Flor P.<br />

Johannes Gutenberg<br />

invented movable type and the printing<br />

press during the Renaissance<br />

• for mass production of the printed<br />

word.<br />

• Printing was the most common form of<br />

Medial and Information Literacy<br />

media through the industrial revolution.<br />

14


Cave<br />

Drawings<br />

Hieroglyphics<br />

Pictograms<br />

(cuneiform)<br />

Motion<br />

Pictures &<br />

Alphabet<br />

Illuminated<br />

Manuscripts<br />

Movable Type<br />

Lithography<br />

Motion Pictures<br />

& Animation<br />

Radio<br />

Television<br />

Computer<br />

Animation<br />

New Media<br />

PONCIO, Flor P.<br />

Animation<br />

At the end of the<br />

nineteenth century,<br />

mass media shifted to<br />

electronic media thanks to the invention of<br />

motion pictures.<br />

• Early animated forms progressed to sound<br />

animation and use of Technicolor.<br />

Medial and Information Literacy<br />

15


Cave<br />

Drawings<br />

Hieroglyphics<br />

Pictograms<br />

(cuneiform)<br />

Alphabet<br />

Illuminated<br />

Manuscripts<br />

Movable Type<br />

Radio<br />

Radio also came into<br />

Lithography<br />

Motion Pictures<br />

& Animation<br />

Radio<br />

Television<br />

Computer<br />

Animation<br />

New Media<br />

PONCIO, Flor P.<br />

common use in the early<br />

1900s particularly as a news and<br />

advertising medium.<br />

• Its popularity began to replace<br />

newspapers and other print media.<br />

Medial and Information Literacy<br />

16


Cave<br />

Drawings<br />

Hieroglyphics<br />

Pictograms<br />

(cuneiform)<br />

Alphabet<br />

Television<br />

Illuminated<br />

Manuscripts<br />

Movable Type<br />

Lithography<br />

Motion Pictures<br />

& Animation<br />

Radio<br />

Television<br />

Computer<br />

Animation<br />

New Media<br />

PONCIO, Flor P.<br />

Television began to replace<br />

radio as the broadcast media of<br />

choice in the 1930s.<br />

• proved to be one of the most<br />

important advances in media<br />

technology. Color television was<br />

introduced in the mid 1950s.<br />

Medial and Information Literacy<br />

17


Cave<br />

Drawings<br />

Hieroglyphics<br />

Pictograms<br />

(cuneiform)<br />

Alphabet<br />

Illuminated<br />

Manuscripts<br />

Movable Type<br />

Lithography<br />

Motion Pictures<br />

& Animation<br />

Radio<br />

Television<br />

Computer<br />

Animation<br />

Computer<br />

Animation<br />

Electronic media and<br />

computers allowed<br />

for graphic<br />

communicators to<br />

incorporate computer<br />

animation into their<br />

designs.<br />

New Media<br />

PONCIO, Flor P.<br />

Medial and Information Literacy<br />

18


Cave<br />

Drawings<br />

Hieroglyphics<br />

New Media<br />

Pictograms<br />

(cuneiform)<br />

Alphabet<br />

Illuminated<br />

Manuscripts<br />

Movable Type<br />

Lithography<br />

Motion Pictures<br />

& Animation<br />

Radio<br />

Television<br />

Computer<br />

Animation<br />

New Media<br />

PONCIO, Flor P.<br />

The digital revolution<br />

moved people into<br />

the age of computers<br />

at the end of the<br />

twentieth century.<br />

• New media forms<br />

blended graphic<br />

design with audio<br />

and cinematic<br />

media.<br />

Medial and Information Literacy<br />

19


Cave<br />

Drawings<br />

Hieroglyphics<br />

Pictograms<br />

(cuneiform)<br />

Alphabet<br />

Illuminated<br />

Manuscripts<br />

Movable Type<br />

Lithography<br />

Motion Pictures<br />

& Animation<br />

Radio<br />

New Media<br />

Beyond the twodimensional<br />

realm.<br />

• New media options<br />

include interactive<br />

media, the Web,<br />

and multimedia.<br />

Television<br />

Computer<br />

Animation<br />

New Media<br />

PONCIO, Flor P.<br />

Medial and Information Literacy<br />

20


HOMEWORK<br />

• Elements,<br />

• Principles<br />

of New Media<br />

21 PONCIO, Flor P.<br />

Medial and Information Literacy


Interactive<br />

Hypertext and<br />

hyperlinks were one<br />

of the earliest forms<br />

of interactivity.<br />

PONCIO, Flor P.<br />

Medial and Information Literacy<br />

22


The Web<br />

• The Internet was developed in the 1960s by the US<br />

government to facilitate communication in the event of a<br />

nuclear attack.<br />

• In 1982, it was made accessible to research labs and<br />

educational institutions. Then in the 1990s, it became<br />

PONCIO, Flor P.<br />

available to schools and businesses.<br />

Medial and Information Literacy<br />

23


Multimedia<br />

• Multimedia technology blends animation,<br />

audio, and video with text, imagery,<br />

and interactivity.<br />

• Common multimedia technologies include Web sites,<br />

video, and computer games. Interactive technologies<br />

that are limited to text and imagery only are not<br />

PONCIO, Flor P.<br />

regarded as multimedia.<br />

Medial and Information Literacy<br />

24


Elements, Principles, and New<br />

Media<br />

The principles of design also apply to<br />

multimedia, the Web, and interactive<br />

media. Elements like balance,<br />

typography, unity, color, and compelling<br />

imagery are just as important in Web<br />

sites as they are in traditional media.<br />

PONCIO, Flor P.<br />

Medial and Information Literacy<br />

25


Elements, Principles, and New<br />

Media<br />

One unique factor designers must<br />

consider in new media is time. Content<br />

must be easily accessible, streamlined,<br />

and simple to navigate. (231) Other<br />

design considerations include:<br />

Motion<br />

Web Site Design<br />

PONCIO, Flor P.<br />

Medial and Information Literacy<br />

26


Motion<br />

Motion design requires plenty of<br />

planning through storyboards to<br />

develop the piece<br />

Audio/video productions involve<br />

even more planning through use of<br />

outlines, scripts, hiring actors and<br />

illustrators, and development of<br />

PONCIO, Flor P.<br />

Medial and Information Literacy<br />

Pages 231-232<br />

music and sound effects<br />

27


Motion<br />

Computer technology allows<br />

designers to give type movement<br />

through animation to support the<br />

message<br />

Individual frames are less important<br />

than the complete composition over a<br />

period of time<br />

PONCIO, Flor P.<br />

Medial and Information Literacy<br />

Pages 231-232<br />

28


Web Site Design<br />

Web sites exist for many reasons<br />

Information source<br />

Entertainment<br />

Promotion of services, products,<br />

organizations, events<br />

E-Commerce<br />

PONCIO, Flor P.<br />

Medial and Information Literacy<br />

Pages 233-235<br />

29


Web Site Design<br />

Pages 233-235<br />

Web designers begin with an information<br />

architecture identifying how users will be guided<br />

through the site<br />

Then a site map is established to show where type<br />

and images fall in a way that unifies individual pages<br />

as a cohesive whole<br />

Finally, designers create style sheets to ensure that<br />

type and layouts will look the same across all types<br />

of browsers, screen resolutions, and platforms like<br />

PONCIO, Flor P.<br />

mobile devices<br />

Medial and Information Literacy<br />

30


Page 236<br />

The Right Media Choices<br />

“The best media campaigns use a combination of media to<br />

deliver a message”<br />

New Media<br />

Targets a youthful<br />

demographic<br />

Takes a grassroots<br />

approach to marketing<br />

Provides source for<br />

entertainment and<br />

information<br />

PONCIO, Flor P.<br />

Facilitates e-commerce<br />

Traditional Media<br />

Newspapers and<br />

broadcast media reach<br />

a wide range of people<br />

Magazines and books<br />

narrowcast specialized<br />

information to smaller<br />

audiences<br />

Medial and Information Literacy<br />

31

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!