Investigate Typefaces and Fonts – 4%
vs.
Leading, Kerning and Tracking
LOOK in the nook to find
Kerning (horizontal spacing between pairs of letters)
the book t h a t you
Leading (vertical spacing between lines of text)
borrowed to read.
Tracking (horizontal spacing between all
characters in a large block of text.
Arial
Arial Black
Arial Narrow
Arial Rounded MT Bold
Font Style: The slant,
weight and special effects
applied to the text
Font Family: Different
sizes, weights and
variations of a typeface.
•
•
•
•
•
•
Bold
Italics
Underline
Shadow
Outline
SMALL CAPS
Sans Serif: There are no
G
G
attributes (serifs) at the tips of
the letters. Used for very large
or very small text and for
digital display, such as
webpages and headings.
G
G
Script: Appear to have
been handwritten with
a calligraphy pen or
brush. Used for formal
invitations and poetry.
Serif: Have attributes or strokes at
Decorative/Ornamental:
Designed strictly to catch
the tips of the letters called
serifs. Used for body text in
printed publications.
the eye and used for
headlines on flyers for
advertisements.
 Typography refers to the style
and arrangement or appearance of
text.

A typeface is the basic design of
a character.
Investigate Design Principles and Elements – 7%
Symmetrical
Balance:
Elements of the
design are
centered or evenly
divided both
vertically and
Asymmetrical Balance: Offhorizontally.
center alignment is created with
an odd or mismatched number of
elements.
Radial Balance: The elements
radiate from or swirl around in a
circular or spiral path.
Contrast: The use of big and small
elements, black and white text,
squares and circles.
Alignment: Visual relationship
between all of the elements in a layout,
even if the elements are far apart.
Repetition: Repeat some aspect
of the design throughout the
entire layout.

Negative or space empty of any color.

WHITE SPACE

Grouping elements to demonstrate
their relationship to each other.
Example: Captions placed with pictures.

PROXIMITY/UNITY
1
2
3
Optical
Center
Z-Pattern
Rule of Thirds
1
2
3
•
Organize information such as tables or catalogs.
Apple
Grapes
Oranges
Red Delicious
White
Navel
Fuji
Red
Hamlin
•
Simulate Movement
•
Connect
Leaves
Speaker
X’s
Post
Hat
Box
Fence
•
Separate
•
Provide Texture
•
Convey a Mood or Emotion

Define a shape.

Provide emphasis.
Magazine Article Title
Newspaper Title
Magazine Article Title

Provide a frame.
 Shapes are often used in logos, but can
be used many different ways; such as
organize, highlight or make information
more interesting.
 Mass then refers to the size, space and
“heaviness” of an object.
 Texture is an effect applied to a
background or as the fill for an object.

Printers and printing presses use a color method
called…

CMYK

Colors on monitors are expressed as hexadecimal
numbers when used on web pages are called…

RGB

The process of matching the printed ink color as
closely as possible to the color displayed on the
monitor.

COLOR MATCHING

A color…
 HUE

A hue + Black =
 SHADE

A hue + White =
 TINT

Amount of a hue
used…
 SATURATION

Lightness or
darkness of a hue…
 VALUE
Demonstrate Desktop Publishing – 14%

A standard pre-formatted layout which may contain a
color scheme, font scheme, pictures, and preset margins…

TEMPLATE

Maintains layout consistency and includes items common
to every page…

MASTERPAGE

An example of how the final document should appear…

PROTYPE, MOCKUP or DUMMY PAGE

Lines that indicate the space between the edge of the page
and document content…

MARGIN GUIDES

Lines that control the flow of the text within columns and keep
text out of the gutter (space between columns)...

COLUMN GUIDES

Used to align objects consistently…

RULER GUIDES

Guidelines used to ensure consistent placement of logos,
graphics, and other objects throughout multiple documents…

GRIDS
Art: Illustrations and
photographs used to convey
meaning and add appeal.
Balloon: A circle or
bubble enclosing copy in
an illustration and often
used in cartoons.
Bleed: A print effect in
which a color, object or
image appears to run off
the edge of a page.
Caption: Brief descriptive
text accompanying an
image or chart.
Pull Quote:
Quotation taken
directly from the
body of the article
and used to draw
attention.
Dropped Cap: An
enlarged character at
the beginning of a
paragraph.
Watermark: A
semitransparent
image in the
background of
printed material.
•
A symbol that indicates the end of an article or news
item…

END MARK/SIGN
•
Text that is the opposite to what the reader is accustomed;
light text on a dark background…

REVERSE TEXT
•
Running text at the top and/or bottom of a document…

RUNNING HEADERS/FOOTERS
•
Line which tells readers which page to refer to for the
continuation of an article.

JUMPLINE
•
Horizontal or vertical lines that can be applied to
paragraphs, text boxes and objects in a publication.

RULES
•
Container for text that can be placed and formatted
independently of other text.

TEXT BOX
•
Square box filled with information related to the main
story or to a completely separate article…

SIDEBAR
•
Banner on the FRONT of a document that identifies the
publication and usually includes the name of the
publication, a logo and a motto…

NAMEPLATE
•
Contains the name of the publisher and may include
staff names and other related information; usually
appears on page 2 of the document…
MASTHEAD

•

•

•

Words positioned above a headline, usually as a lead-in or
teaser.
KICKER
Name of author or contributor of photo or article, usually
placed just below the headline or photo, at the end of the
article.
BYLINE
Placed between a headline and an article to provide a
segue between the headline and the body of the article.
DECK
Investigate Graphic Image Design – 15%
Cloning: Copying part of an
image and using it to replace
unwanted parts of the image.
Cropping: Cutting out part
of an image while the original
image retains same file size.
The cut image can be saved
as a new object.
Filters: Used to
apply special effects
to an image that
would be too
difficult to create
manually.
Gradient: Filling an object/image
with a smooth transition from
one color to another.
Layers: Compiling multiple
pictures or objects together
into one image, can be
turned on or off.
Patterns: Raster
graphics used to fill an
object or selection.
Textures: Used to
create filters and
backgrounds.
Rotating:
Pivoting an object
around its center
point.
Transparency: Removing
the background color of a
raster image to make it
“see-through.”
•
The display resolution on monitors is
measured in…

PPI
•
The resolution at which printers can print is
measured in…

DPI
•
Relationship of an objects width to an
objects height…

Aspect Ratio
Photographs: Raster images that
contain millions of colors.
Art Work: Computer created
drawings or paintings; may be raster
or vector.
Clip Art: Premade graphics that are
available online and in many software
packages; may be vector or raster.
•

•

•

When file size is reduced with this type of compression,
quality is not compromised and you do not loose any pixel
data.
LOSSLESS COMPRESSION
Ability to open, modify and view files on computers using
different operating systems, software and browsers.
PORTABILITY
When file size is reduced with this type of compression,
some data may be eliminated or altered.
LOSSY COMPRESSION
•

•

•

Used to edit raster graphics in paint programs and to
create icons and wallpaper and on-screen display.
BITMAP (BMP)
Most common file format for DTP photographs and digital
photographs.
JOINT PHOTOGRAPHIC EXPERT GROUP (JPEG)
Best used for architectural drawings and logos that will be
resized or scaled.
VECTOR GRAPHICS
•

•

•

Most commonly used for faxes and other digital images,
to store raw bmp data with scanners and high resolution
printing.
TAGGED IMAGE FILE FORMAT (TIFF)
Often used for animation, icons, logos and clip art and
images displayed on computer screens and websites.
GRAPHICS INTERCHANGE FORMAT (GIF)
Used for online viewing of images.
PORTABLE NETWORK GRAPHICS (PNG)
Develop Computer Animations – 10%
Frame-by-Frame: Rapidly
displaying images, or frames, in a
sequence to create the optical
illusion of movement.
Path-based Animation: An object follows a path which is a
line, or vector, inserted by the animator. For this reason, it is
sometimes called vector animation.
Morphing: The
animation process that
transforms one object
into another object.
Rollover: When the mouse is moved
over an image, it changes to a different
image so quickly that it looks as if the
change has occurred in a single instant.
Stop Motion Animation: Process of manipulating real-world
objects and photographing them one fame at a time.
The process of checking pencil drawings with the sound of an
animation to ensure that editing does not need to be made before
final drawings are composed.
 PENCIL TESTING
•
The rapid display of a sequence of images of 2D or 3D artwork or
model positions in order to create an illusion of movement…
 ANIMATION
•
The way our eyes retain images for a split second longer than they
actually appear, making a series of quick flashes appear as one
continuous picture…
 PERSISTENCE OF VISION
•

All images, objects and animations are created on
the computer…

COMPUTER GENTERATED ANIMATION

Sometimes called cel animation or hand-drawn
animation…

TRADITIONAL ANIMATION

The computer is used to make the animation
process quicker and easier…

COMPUTER ASSISTED ANIMATION
Which of the following is NOT
a use of animation?
A. Advertising
B. Selling
C. Drawing
D. Teaching
E. Training
Stage: The part of the animation
program window where the
animation's content is composed
and manipulated.
Layers: Help organize content to allow different layers
to be edited separately.
The part of the animation program window that organizes
and controls an animation’s content over time using layers
and frames…
 TIMELINE
•
•

Stores frequently used graphics, movie clips and buttons…
LIBRARY
Playhead: Vertical red marker in the timeline that shows
which frame is the current frame.
•

These hold the content that the movie displays at
that point in time…
FRAMES

The creation of consecutive frames of animation
between key frames…
TWEENING
•

Shows where the most important actions occur…
KEYFRAMES
•
This sound format is very large
because of the high quality…
 WAV
•
This sound format is small and
great for transferring over the
Internet…
 MP3
•
The conversion process of analog
sound to digital sound…
 SAMPLING
•
If you need audio files to be small
so that your presentation can load
quickly, you need to consider…
 SAMPLE RATE, SAMPLE SIZE
AND CHANNELS RECORDED
•
•

A program that works with the browser to expand its capabilities..
PLUG-INS
A technique for transferring audio and video files over the Internet
as a continuous stream of data…
 STREAMING
•
Temporary storage area for holding data during the streaming
process…
 BUFFER
•
A separate program that can play video and audio files without the
browser being open…
 STANDALONE PLAYER
•
•

•

•

The rate in frames per second at which the video
plays..
PLAYBACK RATE
The rate in frames per second at which videos can be
downloaded or transferred to a computer…
STREAMING RATE
The amount of data that can be transmitted over a
network in a given amount of time…
BANDWIDTH
Explore Multimedia Systems, Elements and Presentations – 25%
Is this appropriate…
YES
NO
NO
1. Johnny is making a PowerPoint for his
graduation project and would like to include
Scotty McCreery’s song “I Love You This Big.”
Music:
2. Susan bought the new Scotty McCreery “Clear 30 Seconds or
as Day” CD and made copies for all of her
10%, whichever
friends.
is less.
3. Jill is working on an advertising campaign for
American Eagle and has decided to include 60
seconds of Scotty McCreery’s hit new song “The
Trouble with Girls” without his consent.
•

Barriers to multimedia include…
Software and Large File Sizes
Computer system and any additional equipment used for
viewing multimedia presentations…
 PLAYBACK SYSTEM
•
•
80
20
100
_____% Planning + _____% Production = _______% Success
“Hotspots” or “jumps” that locate another file or page and
are represented by a graphic or colored and underlined
text…
 HYPERLINK
•
List of options that link to other parts of the presentation
that can be either text or an image…
 MENU
•
Used to link to other parts of the presentation and allow
the user to navigate through the presentation…
 NAVIGATION BUTTONS
•
Applied to text to make it appear on a slide in increments
of one letter, word or section at a time in order to keep
viewers’ attention…
 BUILD EFFECTS
•
•

The spot the eye first sees when it encounters a page…
OPTICAL CENTER
The visual effect of a slide as it moves on and off the
screen during a slide show…
 TRANSITIONS – Direction, Speed and Timing
•
•

•

•

Includes: Tone, Approach, Metaphor and/or
Emphasis…
TREATMENT
The layout of a slide that may have more
“heaviness” on one side or the other to attract
attention…
OPTICAL WEIGHT
The continuity and flow of each slide throughout
the entire multimedia presentation…
UNITY
Which step…
Develop the theme (concept or idea) – State the goals,
objectives and purpose – Identify the target audience –
Determine the treatment to be used – Determine specific
equipment to be used – Storyboard with all navigation links .
Gather materials – Create a reference page – Review finished
project for copyright infringements.
Know your – Content, Time Constraints, Speed.
Speak clearly – Use Proper English – Make eye contact – Avoid
filler words.
The presenter controls the order of
the presentation while the audience
watches...
 LINEAR PRESENTATION
•
•

Users interact with presentation and
control the order the information is
viewed…
NON-LINEAR PRESENTATION
Develop Webpages – 27%
What do we call a website that has
more than one purpose or use?
HYBRID!
The content remains the same every
time the website is viewed…
 STATIC
•
The content can change each time the
website is accessed based on how each
viewer interacts with the content…
 DYNAMIC
•
US Federal Agencies must provide equal
access to and use of information on their
website for individuals and employees
with disabilities…
 Section 508
•
The organization that develops the
standards for web development…
 W3C
•
TYPE
Inline
LEVEL and PRECEDENCE
• To change the style within an
individual HTML tag
• Overrides embedded and
external style sheets
Embedded
or Internal
• To change the style of one
webpage
• Overrides external style sheets
External
• To change the style of multiple
pages in a website
LINEAR
Used for pages that need to be read or
completed in a specific order such as;
Step-by-Step Learning, Presentations
and Online Orders.
HIERARCHICAL
Looks like a family tree or a chain of
command. This structure is best for
organizing large amounts of information with
categories and subcategories.
WEBBED
This structure allows users to jump to any
page on the website. The order of the
viewing does not matter; however, it must be
consistent or users may get confused.
Provides information about the page for search engines
and browsers found in the body tag…
 <meta>
•
All files must be in the root folder and all subfolders must
be lowercase…
 FOLDER STRUCTURE
•
•

The index.html file is considered to be the…
HOME PAGE/INDEX
Nesting: Refers to the
order in which tags are
opened and closed. You
must enter the closing tags
in the reverse order from
the opening tags.
This type of hyperlink points to other files WITHIN the
website (1.01.html)…
 RELATIVE
•
This type of hyperlink points to other websites
(http://www.fayobserver.com)…
 ABSOLUTE
•
This type of web host is best for large businesses with high
traffic and multiple domain names and can be very
expensive…
 DEDICATED
•
This type of web host is best for small businesses websites
with average traffic because they have low costs…
 SHARED
•
This type of web host is best for family, hobby or personal
sites with low traffic because there are no costs…
 FREE
•