Design Your

Visual Approach
Chapter 18
Greg Bauman, Josh Petty, Zack Magnuson

What Needs to Happen?

The process of creating the overall visual
approach:
Defining Roles and Getting the artist
Brainstorming
Deciding medium, size, color, etc.
Constructing a preliminary format

How Does it Happen?

All graphic
development
breaks down to 3
simple steps

1. Have an Idea
2. Create the art
3. Integrate the Art

Roles Involved in Art Production

The following roles can be completed by one
person or many, depending on the organization.

Instructional Designer
Writer
Art Director
Graphic Designer

Interface Designer
Art Staff
Production
Coordinator
Production Staff

Choosing an Artist
A common mistake is assuming one artist can do
everything. Each artist has their own strengths and
weaknesses!
Interface designers - design the graphic face of a
website or software program
Videographers - create dynamic images
Graphic designers - visual problem solving
Artists - specialize in a specific medium (print, film,
animation)

Treatment Meetings
Brainstorming Sessions
Every project should
consider graphic look and
feel
o Is everyone on the same
page?
o What requirements are there?
o Are there any parameters?

Treatment Meetings
Meet with your team
If you are working alone, bounce some ideas
off colleagues
Meeting should provide a distinct direction
for the overall visual approach; colors,
typeface, materials, styles, etc.
Document all decisions!

Things to Consider
Consider what graphics you have to have
Key Schematic Themes
o Size and S p a c e
o
o

Color
Style

Skipping this step could result in significant

rework of the visual design

Things to Consider
What medium will carry your storyline?
Graphics (i.e. picture books)
Text (i.e. text books)
Audio (i.e. e-learning courses)
Video (i.e. TED or YouTube)

Things to Consider
What influences your choice of medium?
Content (i.e. complexity, size)
Audience (i.e. age, intelligence, background)
Learning Environment (i.e. web, lecture)
Platform (i.e. E-Learning, hard copy)

Things to Consider
Size and Orientation
Hard copy
o dimensions
o graphics
o landscape or portrait
E - Learning
o vertical or horizontal scrolling
Differentiate - Consider your students learning styles

Style
Includes:
Typeface/Font
Color Palette
Amount of White Space
Type of Graphics
Style of Individual Graphics

Style - Typeface/Font
The fonts (size and style) used for different
sections of the paper, presentation, etc. can
create many types of moods. That includes
anything from light and informal to extremely
professional.

Style - Color Palette

Color choices can make your presentation look
amateur and unprofessional or high quality and
classy.

Style - White Space

A large amount of white space makes
presentations more casual and easier to read.
The average reader typically finds this more
inviting.

Style - Type of Graphics

The inclusion of graphics can add to a
presentation but adding too many can make the
project look cheap.

Style - Individual Graphics

The style of the material also creates and adds
to the overall style of the presentation. The
presentation should have the same style
throughout.

Available Real Estate

Real estate is the space used strictly
for instructional content.
This is separate from navigation
aspects, as well as design and
theme designs.

Real Estate
A mistake that some artists make is that they
attempt to make a presentation, website, etc.
more interesting by adding graphics to prime
real estate. This takes away from the
information being presented.

Navigational and Functionality Needs

Navigation refers to the movement between
elements. These elements also help the user
know where they are, where theyve been, and
where theyre going (or can go).

Navigation in Print Sources

Section and Chapter Indicators

Tabs
Page Numbers
Headers/Footers

Navigation in E-Learning
Designs are more elaborate than print
sources
Users need to be able to know move from
page to page

Navigation in E-Learning (Cont.)

If the learning tool includes on screen
support, users need to clearly know how to
access it.
Support tools should be user friendly, easy to
access, but should be a distraction which
takes away from the overall design.

Navigation in E-Learning (Cont.)

For every function that the designer(s)
expect from the user, the designer(s) need to
leave space for button, icon, and
navigational identifier.