Unleash the Graphic Designer in You –
Exploring
the Seven Essentials of Graphic Design
NCSLMA 2005 Presentation
Dedicated to all the educators who have made
their mark on the hearts of children.
Donna Sawyer, Kaleidoscope - Content Development
Judy Monroe, Graphic
Artist
DESCRIPTION
How many amazing instructional products, activities, or book ideas have
you created or dreamed up over the years? Perhaps you imagine a cover
for that book you can't seem to get started. Maybe you need a dynamic
logo for an upcoming project. Get prepared to doodle and sketch your
ideas into reality as you learn the Seven Essentials of Graphic Design.
A sketchbook is available for download, so grab your favorite drawing
tool and get started. Art and technology, Kaleidoscope content, and more
will be featured in this module.
The only pre-requisite is to have a sense of play and an open mind to
try new things.
PREPARATION
Do you know how it feels when a great idea strikes and you experience
that jolt of excitement? Who hasn’t savored a few minutes filled
with promise when you think you’ve hit on a winning concept or
a new product idea!
Get ready to turn those dreams, instructional products, and ideas into
reality!
Take a minute to review a few tips from the experts on “daring
to dream:”
- When inspiration strikes, jot down as much as you can as fast as
you can. Keep a small notebook or digital recorder with you at all
times. You’ll be surprised by how much useful information you’ll
gather. Every time you encounter a resource that could help you turn
the idea into reality, record it.
- Picture yourself living out your dream.
- List the steps you need to take and let it serve as a road map to
keep you focused. It’s okay if you only take care of the first
two steps because you are making progress.
- Avoid naysayers. It’s very easy to allow dream-squashers to
rob us of our potential.
- Believe in yourself.
Please download and print the "Educator's Sketchbook" in preparation
for the next stage of the module. The sketchbook is dedicated to all
the educators who have made their marks on the hearts of children.
The Dot, by Peter H. Reynolds, is all about creative expression and
human potential. Take a peek at it now.
http://www.peterhreynolds.com/dot/
ENGAGEMENT
It has now been documented that drawing is largely a right-hemisphere
function. You will know when you have made the shift from left-brain
to right when you experience one or more of the following:
- feeling a close connection with your work,
- experiencing a sense of timelessness and a lessening of anxiety,
- noting an increase in confidence, or
- having difficulty using words or understanding spoken words.
If you set up the conditions for this mental shift and experience the
slightly different feeling it produces, you will be able to recognize
and foster this state of mind.
Let’s see if we can make it happen now.
Use your sketchbook to complete the upside-down exercise recommended
by the author of "Drawing on the Right Side of the Brain," Betty
Edwards.
You can find additional upside-down exercises and the directions online:
REFLECTION
ESSENTIAL #1:
Think about an idea, a project, a book, or an instructional product
that you have dreamed of creating. Visualize the cover of a book; picture
the logo; envision a promotional flyer.
As you "see" the art and the text in your mind, what story
does it tell?
- What is the mood and the message?
- Who is the audience?
- What are the goals for this project?
- Where can you find existing examples?
Use the “research” page in your sketchbook to brainstorm.
Jot down ideas, phrases, words or word pictures that surface. Don't edit
yourself. Don't delete anything.
EXPLORATION
ESSENTIAL #2:
Example of contrast used in workshop: The Curriculum Corkboards
Now it is time to explore the various elements of this design you
are imagining.
Artists use CONTRAST to communicate how the viewer should navigate
through a design. This helps the viewer to understand and see the most
important thing first, the next tier of information second, and so
on.
Learn more about creating CONTRAST with Christine Castigliano.
http://www.metatoggle.com/design_crs/contrast.html
Turn in your Sketchbook to the page on CONTRAST. Take a few minutes
to think about your book cover, flyer, or project idea. Decide what
you want the viewer to see first, then second, and then third. Play
around with your thoughts and doodle ideas in your sketchbook.
ESSENTIAL #3:
Example of quiet colors: Kaleidoscope’s Content Coliseum
http://www.ncwiseowl.org/kscope/TeacherHut/ContentColsm/index.html
Example of symbolic colors: The Hovercraft
http://www.ncwiseowl.org/kscope/Hovercraft/index7.htm
Example of colors that show excitement: The Express Reactor
http://www.ncwiseowl.org/kscope/Hovercraft/XpressReactor/index.htm
Example of temperature in colors: Wise Surprises and Serendipitous
Searches
http://www.ncwiseowl.org/kscope/techknowpark/WiseSurprise/Week12.html
Learn how to draw the eye with color at Christine Castigliano’s
Web site on basic design principles.
http://www.metatoggle.com/design_crs/color.html
Think about the colors that you need to use. Do you need quiet colors,
like light blue, light pink or soft gray? These colors sink into the
background of your design.
Do you need loud colors? Colors like bright reds or bright greens
jump out at the viewer.
How much excitement value will the colors lend? Reds and oranges have
a high excitement value, while blues, browns, dark greens or grays
have no excitement value.
Colors can have a temperature. Reds, purples, oranges, and pinks are
warm. Blues, greens, pale pinks and soft lavendars are cool.
Symbolic colors that are the most recognizable are:
blue = water
orange/yellow = sun
purple = pomp and ceremony
brown = harvest
green = money
neon green on black = technology
ESSENTIAL #4:
Typography is the artful representation of words. Did you know that
typefaces have their own personalities? How would you describe the
personalities of the following logos?
Patchwork Quilt
http://www.ncwiseowl.org/kscope/techknowpark/ActivitySheet/Sheet25_30.html
Burial Site
http://www.ncwiseowl.org/kscope/techknowpark/Dream/BurialSite.html
Trouble Terminator
http://www.ncwiseowl.org/kscope/techknowpark/Trouble/index.html
Learn more about the Hierarchy of Typography with Christine Castigliano.
http://www.metatoggle.com/design_crs/words.html
Use the Typography page in your sketchbook to describe and/or sketch
the personality of your design.
ESSENTIAL #5:
Look at the layout for this page and notice how your eyes travel through
the design: TechKnow Park, Week 7.
http://www.ncwiseowl.org/kscope/techknowpark/RaceTrk/index.html#
A good layout provides a map for the viewer. Or think of your layout
in terms of a pinball machine, and how it keeps the ball (the eye)
on the playing surface, touching and bouncing off elements within the
layout.
Also, consider the balance of your layout. Do you want it to be symmetrical
or assymetrical? Imagine two children on a seesaw. If both are relatively
the same size, they can position themselves in a symmetrically balanced
arrangement. But if the children are different sizes, the heavier of
the two will need to move to the center of the seesaw in order to balance.
This theory works as a useful design tool as well. Assymmetrical layouts
achieve balance through a less predictable, more dynamic layout.
Turn in your sketchbook and roughly sketch a layout that includes
a title, a tagline, a short blurb or quote, and an image holder. Don't
think of this as a finished product. You are simply exploring potential
layouts. Before you begin,
- Read the Seven Sketching Rules under ESSENTIAL #5, and
- Study this example from Kaleidoscope's Sixth Grade English Language
Arts Unit.
http://www.ncwiseowl.org/kscope/Hovercraft/Six/ELA/index.html
ESSENTIAL # 5: SEVEN SKETCHING RULES
- Use a very soft pencil with a thick lead.
- Don’t try to fit your ideas into pre-drawn squares. Let the
ideas flow all over the page.
- Change up the order in which you sketch the “parts” of
your design. Don’t always start in the same place.
- Change the position and size of the elements on the page.
- For a few sketches, remove an element and come up with ideas that
are more innovative.
- Take several breaks from sketching.
- Never edit yourself. If you think it, draw it.
ESSENTIAL #6:
Grid systems create visual consistency and provide structure for the
design. They also give you a reusable system for multi-page or multi-issue
publications. One tip for better understanding grids is to reverse
engineer the grid of a magazine layout you admire.
Here are two examples of grids. The red lines denote the grid system.
The Kaleidoscope Home Page
http://www.ncwiseowl.org/kscope
The Student Hut in Kaleidoscope
http://www.ncwiseowl.org/kscope/StudentHut/index.html
Learn how to design grids for Web pages, by Web Style Guide. While
you’re there, check out all the great topics listed along the
right edge of the page: typography, graphics, accessibility, multimedia,
and more.
http://www.webstyleguide.com/page/grids.html
ESSENTIAL #7:
Having knowledge of the basic design principles builds a strong foundation
for successful designs. Another important step toward creating good
designs is being able to identify quality graphic design in the work
of others. This helps you develop critiquing skills and strengthen
your own “design eye” through careful observation and analysis.
If you are serious about strengthening your “design eye,” take
this free Interactive Course in Basic Design Principles, developed
by Christine Castigliano, a designer, writer and illustrator. http://www.metatoggle.com/design_crs/contents.html
Now, take a look at the notes and drawings in your sketchbook. Ask
yourself if a person who couldn’t read might still be able to
understand the general point of the design. Ask others to react to
your work. Sometimes the message we intend is not the one that is received
by others. Look at all the elements in your design as a whole and determine
if they work together in communicating the same message.
Congratulations, and remember, “Just make a mark and see where
it takes you.” (The Dot, by Peter J. Reynolds) http://www.peterhreynolds.com/dot/
|