Definition, Characteristics, Format and Types, Design

Principles and Elements

Objectives
•Define text in the context of multimedia.
•Compare how text information and media is/are formally
and informally produced, organized, and disseminated
through the given examples.
•Design varied text information and media by observing
typefaces and design principles and elements.
a simple and flexible format presenting
information or conveying ideas whether
hand-written, printed or displayed on-
screen(Source: MIL TG by CHED)

any ‘’human-readable
sequence of characters’’ that can form
intelligible words (Rouse, 2015)
 How is text used
in the following media?
Source: https://i.pinimg.com/73 6x/44/b3/eb/44b3eb3a5 979ee280c96c13eb892c cbb--funny-pics-funny- stuff.jpg
Source: https://www.zazzle.com/funn y+kids+tshirts
Sources: https://www.zazzle.co m/funny+tshirts
Photo Credit: NOEL CELIS/AFP/Getty Images

Source: http://www.gettyimages.com/detail/news-photo/man-blatantly-ignores-a-traffic-warning-sign-that-reads-no- news-photo/108428193#man-blatantly-ignores-a-traffic-warning-sign-that-reads-no-crossing-picture-

id108428193
Source: http://www.pinoygagj okes.com/2014/07/50-pictures-most- funniest-pinoy- signage.html
Source: http://www.pin oygagjokes.com/2014/07/50-pictures-most- funniest-pinoy- signage.html
Source: http://www.pinoygagj okes.com/2014/07/50-pictures-most- funniest-pinoy- signage.html
 TYPES OF TEXT DESCRIPTION
serve to link different electronic documents and
HYPERTEXT enable users to jump from one to other in a nonlinear
way

PLAINTEXT or UNFORMATTED fixed sized characters having essentially the same

TEXT type of appearance

appearance can be changed using font

FORMATTED TEXT parameters (bold, underline, italic, font size, font
color, etc.)
Source: p.144, Media and Information Literacy by Boots C. Liquigan, Diwa Learning Systems Inc.
HYPERTEXT
This Go to Page 13 is a hypertext
that will bring you to the previous
slide.
Source:https://media.tenor.com/images/0c6cede2c66bcc187c89fa47aed5c990/tenor.gif
 HYPERTEXT
This DLSU-D Portal is a hypertext that
will bring you to the log in page of
DLSU-D portal.

This
http://pearl.dlsud.edu.ph/mydlsud/login.aspx is Source:https://media.giphy.com/media/srg19CG0cKMuI/200.gif

a hyperlink to the same webpage.

UNFORMATTED TEXT

Source: https://blog.xamarin.com/mobile-apps-with-visual-basic-xamarin-forms/
FORMATTED TEXT

Source: Microsoft Word

When we format text, we design it based on the purpose, theme,
context, concept, occasions, target audience, formality, etc. Using
Typefaces help us best to accomplish this simple task.

A C E S? ? ?
T YPEF
Source:https://media.tenor.com/images/52201ad3be23da99b0517
59f169bc41a/tenor.gif
also called font, font type, or type; refers
to the representation or style of a text
in the digital format

usually comprised of alphabets, numbers,

punctuation marks, symbols and other
special characters
 TYPES OF TYPEFACES

Source: p. 120, MIL TG by CHED

 TYPES OF TYPEFACES

Source: p. 120, MIL TG by CHED

 TYPES OF TYPEFACES

Source: p. 120, MIL TG by CHED

 TYPES OF TYPEFACES

Source: p. 120, MIL TG by CHED

 TYPES OF TYPEFACES

Source: p. 120, MIL TG by CHED

 COMMON FILE
DESCRIPTION
FORMATS
• unformatted text document by an editor as notepad on
.TXT (text)
Windows platform

•a native format for storing documents created by MS Word

.DOC (document) package
•contain a rich set of formatting capabilities

Source: p.149, Media and Information Literacy by Boots C. Liquigan, Diwa Learning Systems Inc.
 COMMON FILE
DESCRIPTION
FORMATS
.PDF (Portable • developed by Adobe systems for cross platform exchange of
Document Format) documents, supports image and graphics
• a page description language used mainly for desktop
.PS (PostScript) publishing; capability of containing text and images on
the same page.
.RTF (Rich Text •cross platform document exchange; default format for
Format) Mac OS X’s default editor TextEdit

Source: p.149, Media and Information Literacy by Boots C. Liquigan, Diwa Learning Systems Inc.
PS file opened through https://psviewer.org/onlineviewer.aspx
 .doc and .rtf appears to be
one and the same, don’t you
think?
Almost.

DOC. is actually an improved Source: https://thumbs.gfycat.com/UltimateNeighboringInsect-max-1mb.gif

and updated version of RTF.

Source:https://i.pinimg.com/originals/d0/a3/c7/d0a3c768a4544fc1bf85d16f40cc6ff8.gif
 Both RTF format and DOC format are developed by
Microsoft for Word. RTF is a format older than DOC.
• DOC file carries more formatting than RTF. The options RTF
can provide are simple and limited. It can just support format
like italics, types, font sizes, and boldface, while DOC can
support users to format their documents in any ways they
want.
• Microsoft has stopped developing RTF, but it never stops
improving DOC. More recent versions of Microsoft Office can
not be saved in RTF any longer, while the brand-new
incarnation of the DOC is the DOCX.
Source: https://gifimage.net/wp-content/uploads/2017/10/confused-math-gif-8.gif

Source: https://www.verydoc.com/blog/difference-between-rtf-and-
doc.html#:~:text=RTF%20is%20a%20format%20older%20than%20DOC.&text=More
%20recent%20versions%20of%20Microsoft,amount%20of%20data%20is%20great.
 Both RTF format and DOC format are developed by
Microsoft for Word. RTF is a format older than DOC.
• RTF files are much smaller than DOC files. Due to the great
number of formatting, you could keep in DOC files, the
amount of data is great. However, the size of RTF files is very
small.
• RTF file can be edited with any text editor, while you can
neither encode nor view information of DOC files if you don’t
have the correct application.
• RTF is less safe than DOC, because you can encrypt the DOC Source: https://gifimage.net/wp-content/uploads/2017/10/confused-math-gif-8.gif

files.
Source: https://www.verydoc.com/blog/difference-between-rtf-and-
doc.html#:~:text=RTF%20is%20a%20format%20older%20than%20DOC.&text=More
%20recent%20versions%20of%20Microsoft,amount%20of%20data%20is%20great.
Now you
know!!!
DESIGN PRINCIPLES AND
ELEMENTS
DPE # 1

1.EMPHASIS
• importance or value given to a part of the text-
based content
• make the text bold
• Italicized
• have a heavier weight
• darkened or lightened
•enlarged
Source: https://sites.google.com/site/infocommkchuansec/home/lessons/theory/principles-of-design-emphasis
Source: https://twitter.com/philredcross/status/706041623839244288
 DPE # 2

2. APPROPRIATENESS
• how fitting or suitable the text is used for a
specific audience, purpose or event

Source: p. 121, MIL TG byCHED

Times New Roman
Arial
Aharoni
Rockwell
Edwarden Script
Jokerman
Varied font styles for different
mood. theme, purpose, event, etc.
Sources: http://bonfx.com/bad-typography/

Source:https://stoneletters.com/blog/memorial-quotes-headstone-epitaphs
Source: http://www.thealmightyguru.com/Wiki/index.php?title=File:Bad_Font_Choices_-_You%27ll_Always_Be_Mine.jpg
Font style
matters!
 DPE # 3

3. PROXIMITY
•how near or how far the text elements from each
other
•bring related elements close together

Source: p. 121, MIL TG by CHED

 Arrange different elements that
relate to each other in groups to
convey meaning, organize
information and reduce clutter.
When items are grouped to a
close proximity, they become one
cohesive visual unit. Source: https://public-media.interaction design.org/images/uploads/1b310a5f2145eda7d66550efad0fc2f5.jpeg

Source: https://docontent.wordpress.com/2015/04/08/want-a-good-design-remember-to-c-r-a-p-contrast-repetition-alignment-proximity/
Source: https://www.pinterest.ph/pin/443534263276130513/ https://www.usertesting.com/blog/gestalt-principles
Source: https://image.slidesharecdn.com/mediaandinformationliteracymil-textinformationandmediapart1-170907011110/95/media-and-information-literacy-mil-text-information-and-media-part-1-41-638.jpg?cb=1505002912
 DPE # 4

4. ALIGNMENT
•how the text is positioned in the page
•left, center, right, or justified

Source: p. 121, MIL TG by CHED

Source: https://graphicdesignfundamentals.com/how-to-use-alignment-to-improve-your-design/
 Center: Use it Left: The text Right: Right Justified: This
when you have aligned to the left aligned texts will option is the most
few short lines of is the most require used in books,
text. This option common choice. additional effort magazines and
must NEVER be For the reader it’s to the reader. It newspapers. It’s
use in full comfortable and can be a good formal, neat, and
paragraphs secure. If you option to create helps organize
because it’s want to stay more attention to the text,
difficult to read. conservative, this specific words. especially if you
is the safest are using
choice. columns.
Source: https://graphicdesignfundamentals.com/how-to-use-alignment-to-improve-your-design/
Source: https://bbagraphicdesign2.jimdofree.com/unit-3-1/
Source: https://bbagraphicdesign2.jimdofree.com/unit-3-1/
 DPE # 5

5. ORGANIZATION
•conscious effort to organize the different text
elements in a page
•ensures connection among elements

Source: p. 121, MIL TG byCHED

Source: MIL TG by CHED
Source: https://doc ontent.wor dpress.com/2015/04/0 8/want-a- good- design- remember- to-c-r-a-p- contrast- repetition- alignment- proximity/
 DPE # 6

6. REPETITION
•consistency of elements
•unity of the entire design
•repeating some typefaces within the page

Source: p. 121, MIL TG by CHED

 Repeat visual elements of a design
throughout your layout. It can be
regular or irregular, even or
uneven, like shapes, colors, or lines.
This creates a rhythm and unifies
the layout. Consistency is the key!

Source: https://docontent.wordpress.com/2015/04/08/want-a-good-design-remember-to-c-r-a-p-contrast-repetition-alignment-proximity/
Simply observe the patterns used in this presentation. The typefaces,
format, color palette. Texts with the same level of importance (main
topic, subtopics, examples) are formatted the same.
 DPE # 7

7. CONTRAST
•creates visual interest
•two elements are different from each other

Source: p. 121, MIL TG byCHED

CONTRAST = TWO ELEMENTS ARE DIFFERENT

§ white text on a dark background

§ large font with a small font
§ serif and sans serif
§ thin elements with wide elements
§ cool color and warm color
Source: https://doc ontent.wor dpress.com/2015/04/0 8/want-a- good- design- remember- to-c-r-a-p- contrast- repetition- alignment- proximity/
END
OF Source: https://media1.tenor.com/images/cf5cec25ee814cea5ea999045a797d48/tenor.gif?itemid=8180151

THE LESSON
REFERENCES
§ Media and Information Literacy Curriculum Guide by DepEd
§ Media and Information Literacy Teaching Guide by CHED
§ Media and Information Literacy by Boots
C. Liquigan, Diwa Learning Systems Inc.