Media and Information Literacy (Week 11)

Lesson 11:
Text and Information Media

[email protected]
▰ Describes the different dimensions of text information and media;
▰ Comprehends how text information and media is /are formally and informally
produced, organized and disseminated;
▰ Evaluates the reliability and validity of text information and media and its/their
sources using selection criteria; and
▰4. Produces and evaluates a creative text-based presentation using design principle
and elements.
(MIL11/12TIM-IVb-3 MIL11/12TIM-IVb-4-6)
Lesson 11:
Text and Information Media
❑ Design Elements and Principles

❑ Performance Task: Digital Poster/ T-

Shirt Design
DESIGN ELEMENTS
AND PRINCIPLES
What is Text?
Text – a simple and flexible format of presenting information or
conveying ideas whether hand written, printed or displayed on
screen.
A. Text is very powerful as well as disseminating information,
providing and giving suggestions.
B. Text is available in different sources whether it is formal (news
articles, published books, newspapers, magazines,
advertisements, research works, etc.) or Informal (blogs,
personal e-mails, SMS or text messages, online messengers,
social media platforms, etc). 5
What is Text?
• Formal text-based materials are created and distributed by
established institutions (such as publishing companies, news
agencies, etc.) and go through a rigorous process of editing or
evaluation and are usually governed by censorship of the state.
• Informal text-based materials, on the other hand, come from
personal opinions or views on different issues, processes, etc
C. Text can be as short such as a single sentence or phrase, or
they can be as lengthy as news articles or investigative reporting.
No matter how brief or lengthy, however, a text is always carefully
written with the intent of sending a very specific message to the
6
target audience.
What is Text?
D. In our exposure to text media and information, we can either be a
consumer or a producer of content. As a consumer, these are the
questions that you need to ask with regards to the content of text
media and information:

7
What is Text?

E. As a producer of text media and information, we

need to review the media and information design
framework: target audience, author or sender, key
content, purpose, form/style and format.

8
TYPOGRAPHY

▰ one of the biggest

foundations of design
▰ Type says a lot and the
way you choose to
execute your type says
even more.
TYPEFACE

▰ Typeface (also called font, font type, or type) refers to the representation or
style of a text in the digital format. A typeface is usually comprised of
alphabets, numbers, punctuation marks, symbols and other special characters.
When fonts are installed in the computer, they usually come in file formats
such as True Type Font (.ttf), Open Type Font (.otf), etc.
▰ In the absence of images or drawings, text is the easiest way of
communicating to your audience. The use of various font types can express
different emotions or meaning
TYPOGRAPHY

http://www.leffcommunications.com/2015/01/16/which-font/
Types of Typeface Serif

Serif connotes formality and readability in large

amount of texts. This font is usually used for the
body text of books, newspapers, magazines and
research publication. Also, serif fonts give a
classic or elegant look when used for title or
heading.
Examples: Times New Roman, Garamond,
Baskerville
Types of Typeface Serif

Sans serif brings a clean or minimalist look to

the text. This font is used for clear and direct
meaning of text such as road signage, building
directory or nutrition facts in food packages. Also,
sans serif fonts give a modern look and is used
primarily in webpage design.
Examples: Arial, Tahoma,
Verdana, Calibri
Types of Typeface Serif

Slab Serif
Slab serif - carries a solid or heavy look
to text. This font can be used for large
advertising sign on billboards.
Examples: Rockwell, Playbill,
Types of Typeface Serif

Script
Script - draws much attention to itself because of
its brush-like strokes. This must be used sparingly
and not to be used in large body text. This font is
usually used in wedding invitation cards or other
formal events.
Examples: Edwardian, Vladimir, Kunstler
Types of Typeface Serif

Decorative
Display or decorative- caters to a wide variety of
emotions (such as celebration, fear, horror, etc.)
or themes (such as cowboys, circus, holidays,
summer, kiddie, etc.)
Examples: Chiller, Jokerman, Curlz MT
Sample Poster

Photo Credit:
http://www.printaholic.c
om/how-to-minimize-
text-on-posters/
Photo
Credit:
http://graphi
cdesignjunct
ion.com/201
2/11/41-
remarkable-
typography-
posters/
Photo Credit:
▰ http://www
.printaholic
.com/11-
text-only-
posters/
▰ billandrusd
esign.com
Photo Credit: Magazine spread design by Benjamin Bours
Photo Credit: Magazine spread design by Benjamin Bours
Photo Credit: Magazine spread design by Benjamin Bours
 TYPOGRAPHY TIPS

Text - The text type should be:

• Legible
• Appropriate font face
• Left justified, Right justified, or centered
• The flow of text should be easy to read.
TYPOGRAPHY TIPS

▰ Kern your titles

▰ Make sure your body copy isn’t too big or too small
for the medium you are printing onto
▰ Try to avoid using too many typefaces at once
TYPOGRAPHY TIPS

▰ Left-alignment is easiest to read for large bodies

of type
▰ If in doubt, print it out (you can often pick up on
awkward typesetting much easier when it’s on
page)
LINE

▰ defined as
any linear
marks
▰ can channel
certain ideas
too
Photo Credit:
Poster design by Design By Day
A technique applied a lot in photography is the use of
‘leading lines’.

Photo Credit:

Photograph by Anne
McKinnell

Source: http://digital-
photography-
school.com/how-to-
use-leading-lines-for-
better-compositions/
Photo Credit:
Photograph by Anne
McKinnell
Source: http://digital-
photography-
school.com/how-to-
use-leading-lines-for-
better-compositions/
SCALE
▰ deliberate
sizing of
individual
elements
▰ help us make
sense of
designs and
images
 ▰ Scale
doesn’t
always have
to be based
on realism.

Poster by Gabz Grzegorz Domaradzki for

the movie Drive.
COLOR

▰ creates specific
moods, atmospheres,
▰ channels emotions and
each shade has certain
specific connotations
associated with it
▰ These chosen colors
complement each other gently
to create a calm, elegant and
feminine design.
▰ Design by Smack Bang
Designs for women’s skin
rejuvenation service ‘Lite
Luxe’.
▰ This branding has
chosen a color palette
that sharply contrasts,
creating a much more
vibrant, energetic and
playful design.

Photo Credit:
Branding for juice brand Frooti by
Sagmeister & Walsh.
REPETITION

▰ crucial element
when it comes to
branding design
▰ keeps your branding
consistent and tie
your items together
 ▰ Repetition can
also make
beautiful one-
off designs.

Photo Credit:
Packaging design by Nastya
Chamkina that uses repetition to
create a beautiful pattern.
Photo Credit: Xoclad by Anagrama
NEGATIVE SPACE

▰ is the ‘space in-

between’, the
area between or
around other
elements that
form its own
shape
Photo Credit:
Animal Graphics by
George Bokhua
SYMMETRY

▰ We find
symmetrical
faces, patterns
and designs
generally more
attractive,
effective and
beautiful.
 ▰ This wedding
invitation uses a
high degree of
symmetry, but it
it’s not perfectly
mirrored.
Photo Credit:
Jarrid & Laura Wedding Invitation by
Nate Koehler
FRAMING
▰ can
enhance or
draw
attention to
specific
elements
of your
design
Photo Credit:
Joe’s Coffee by Trevor Finnegan
Photo Credit:
Poster Design via MyDesy
CONTRAST

▰ is the degree of
difference between
two elements of your
design
▰ It has a great effect on
readability and
legibility as well.
 ▰ This design
ensures there’s
adequate
contrast against
the type and
image.

Photo Credit:
Poster by Jonathan
Correira
Photo Credit:
Audible’s
landing page
(website)
COMPOSITION

▰ refers to the
overall
arrangement of
elements in your
design
Photo Credit:
email newsletter for
J. Crew
Photo Credit:
Poster by Lab B Design
Office
DESIGN ELEMENTS AND
PRINCIPLES

▰ Evaluate the following posters:

▰ Research “Design Elements and Principles” to
learn more about it.
Suggested website pages
▰ https://designschool.canva.com/design-elements-
principles/
▰ https://designschool.canva.com/blog/visual-
design-composition/
OBJECTIVES
▪ Create a digital poster which will
influence high school students to be a
responsible user and competent producer
of media information
COOPERATIVE LEARNING
▪ Group of 3 students
MESSAGE
▪ Be a responsible user and competent producer of media
information.
MEDIUM
▪ Digital poster which will be shared on Facebook.
AUDIENCE
▪ High School Students (JHS and SHS)
MATERIALS / TOOLS
▪ Web tool : Canva (www.canva.com)
▪ Photo editing software or applications
▪ Computer
▪ Smartphone Camera

Photo Credit :
https://www.canva.com/
http://www.digitalrabbitcellular.com/
 ▰ The selected digital poster will be shared on
Edmodo and Facebook.
▰ The digital poster must focus on the issue
and not attack or mentioned personalities.
Use of foul words are not allowed.

Photo Credit:
www.Edmodo.com
www.facebook.com
 ▰ Cite credit for borrowed
materials (i.e. image,
design, etc.)

Photo Credit: http://www.freepik.com/free-photo/young-man-holding-

many-books_857159.htm
 Time
Date Venue Procedure
Allotted
Day 1 Classroom 1 period • Conceptualize your poster.
(Message and Design)
• Take pictures to be used
for the poster.
Day 2 Computer 2 periods • Create your digital poster
Laboratory using Canva. You’re
allowed to use additional
tools.
• Submit the digital poster in
our Edmodo group.
 Criteria Excellent Good Fair NI
Content Message Message Message Message
• Be a is clear, is clear is clear is unclear
responsible accurate, and but and/ or
user and and accurate. question- inaccurate
producer of strong. able. .
media
information
.
10 8
5 2
 Criteria Excellent Good Fair NI
Graphic All graphics All graphics All graphics Graphics do
• Relevance and are related to are related to relate to the not relate to
Citation the topic and the topic and topic. Two the topic
make it easier most make it borrowed and/or three
to easier to graphics have or more
understand. understand. no source borrowed
All borrowed One borrowed citation. graphics do
graphics have graphics have not have a
a source no source source
citation. citation. citation.

8
10 5 2
 Criteria Excellent Good Fair NI
Design and The poster The poster The poster The poster
Layout is excep- is is is poorly
tionally attractive acceptably designed
attractive in terms of attractive and the
in terms of design, though layout is
design, layout, and layout is cluttered.
layout, and neatness. cluttered.
neatness.

10 8 5 2
 Criteria Excellent Good Fair NI
Work Ethics Every Group Group Group
• Cooperation individual work is work is members
in the done done are not
group mostly by mostly by working
contributed two one during the
to the individuals. individual. designated
creation of time.
the digital
poster.
10 8 5 2
 ▰ Campaign Against Cyberbullying
▰ Be Safe in Cyberspace
▰ Media Message Analysis (Critical Thinking)
▰ Think Before You Click
▰ No to Plagiarism
▰ Proper Behavior on the Internet (Netiquette)
(Note: Students may proposed a related topic which will be
approved by the teacher.)
 SAMPLE
DIGITAL POSTERS
http://www.technologyrocksseriously.com/2014/10/before-you-post-think.html#.WSPui6kaaGI
http://www.classroomcapers.co.uk/online-safety-school-poster.html
Photo Credit:
https://store.accutrain.com/products/sfs002-pos-eng-1000
http://www.hcpss.org/news-posts/2016/04/boe-reviews-policy-on-
responsible-use-of-technology-and-social-media/
• Media and Information Literacy Curriculum Guide
References
by DepEd
• Media and Information Literacy by Boots C.
Liquigan, Diwa Learning Systems Inc.
• http://wearesocial.com/sg/
• https://designschool.canva.com/design-
elements-principles/
• http://rubistar.4teachers.org/index.php?screen
=ShowRubric&rubric_id=1125149&
• http://teacherweb.com/ME/JALeonardMiddleSch
oolOldTown/Ecologywebquest/page3.htm
 References
• https://designschool.canva.com/design-
elements-principles/
• https://designschool.canva.com/blog/visual-
design-composition/
• http://digital-photography-school.com/how-to-
use-leading-lines-for-better-compositions/
• https://designshack.net/articles/typography/ser
if-vs-sans-serif-fonts-is-one-really-better-than-
the-other/
• http://www.tvdsb.ca/webpages/baxterc/resour
ces.cfm?subpage=143055