The document provides examples of good and bad design principles, including use of alignment, proximity, repetition, contrast, color, and embellishment/enhancement. In the bad examples, principles are not properly applied, making the designs cluttered and difficult to understand. The good examples demonstrate how properly applying design principles can make visual content more organized, readable and achieve its purpose.

1. Final Design PortfolioBy Danielle Ambrose

2. High Effort/Low Reward
It is hard to tell the purpose of the internet page and
the news paper add doesn’t entice you to want to read
it. There is not enough white space in either design
which adds to the cluttered feeling. The alignment is
all over the place in both.
While there appears to be a title there is nothing to direct your eye
further. It is hard to know where to start. There are too many
images on the web page so your eye doesn’t know where to go. In
the web page the text is all over the place with no apparent
order, making it hard to follow.
Where as in the news paper add there
is simply a lot of text with no sub
headings to break it up. The text is
difficult to read as well. The image is
difficult to decipher and doesn’t
create interest.

3. Low Effort/High Reward
The title catches your
eye and interest with
it’s bold lettering and
creative word choice.
There is a label to tell us what the
add is about.
There is a nice use of white space to
help emphasize the design.
There is a simple graph like
elements to help explain the
products purpose.
The text clearly states what
the intent of the design is
about… “Confetti party
hats”…
The image captures your attention
and draws your interest.

4. Bad Use of Theme
You can easily tell this brochure is
about Salinas Valley California.
However there are to many
different forms and styles of text
used in the headers. This creates
an un-unified design. It doesn’t
flow well and the design conflicts
with itself.
There are also to many
text and background
colors, creating further
conflict within the
design. There is nothing
to tie it all together. No
element repeats itself
except the map (which is
squished on one page).
This web page appears to be about
electronics or maybe robotics or …the only
thing we really have to go on are the images
and there are too many of those. There is
little that ties the design together. The font
appears to be the same style however there is
excessive use of color and font size with no
clear rhyme or reason. Again there is not
enough consistency or unity in this design.

5. Good Use of Theme The color pallet of white, light gray,
light blue, and pink helps create a soft
fresh feel.
The images used throughout the design
emphasize the fact this is a header for a
fashion website.
The text color and layout help ground
and unify the set as well.
It is clear the theme is Australia. The
images and text do a nice job of keeping
the theme throughout the design set.
On the first page where the image could
be anywhere the title clearly brings us
back to the theme.

6. Picture Words and Analogies
The thumbs up smiley face sends a conflicting
message from what, I’m sure, the text was suppose to
convey. In this particular example the message is
misinterpreted as a result of bad translation, however
when designing signs for multiple languages it is a
good idea to make sure the interpretation is correct. It
might just have dangerous consequences.
This might be a stretch, however I firmly believe when
writing for a journal, newsletter, or news paper it is quite
beneficial to use picture words and analogies to help the
reader connect to your story. It might be hard to read
here but this article, from the Heritage Herald, about a
“Story and Recipe from…” could benefited from the use
of picture words and analogies. Not only is the title
boring and long the story does nothing to excite your
imagination. The writing is what I think of as dry. It
doesn’t keep my interest, while the story could be
interesting it is hard to relate to and doesn’t paint a very
good visual picture for the reader, especially if they aren’t
familiar with the Oregon Trail.

7. Picture Words and Analogies
In this example the use of
analogy helps paint a picture of
the effect smoking has on our life
span. “How long can you live?” Is
a clear, blunt, and relatable
sentence, however combined with
the image of the cigarette and the
age graph the message becomes
even more impactful.
Here’s a good example of using an
analogy to convey a message. The
text graphic paints a picture to
help the viewer understand which
version of the product they might
need.

8. Audience – Bad Designs
While this brochure is clearly about Salinas Valley, California
what isn’t clear is who this brochure was designed for… is it for
tourists?... a prospective resident?
The purpose of the brochure appears to have
been lost. While there might be good
information here it is unclear who the
designer is trying to reach.
This blog won an award for being the best kids
recipe blog… design wise, I can’t tell it has
anything to do with “family focused foods”, as
the editors statement suggests. The title
“Simple Bites” might give a little clue but it’s
not nearly enough. At first glance I actually
though this blog was about the Paleo diet…?

9. Audience – Good Designs
This add is clearly geared towards
smokers and/or those who wish to quit
smoking. The image and text provide a
strong visual message correlating life
expectancy with the effects of smoking.
Right away you can tell this blog is about food and not just any food,
healthy vegetarian food.

10. Bad Embellishment
The images and some of the texts do not
enhance the design. They are thus
embellishment and aren’t necessary. Some
of them appear to be used to fill space.
The colorful backgrounds act as
embellishments rather and do not
enhance the design in any way. On
the contrary they distract from
the message.
The flowery embellishments in
this news letter do not add to the
overall design. They create clutter
and aren’t necessary.

11. Embodiment/Enhancement
It is clear from this header this website is about fashion. The icons embody the idea of fashion as well as the pages they are linked to.
They enhance the design by creating interest in a playful and creative way.
This design was created to communicate a name change
for a blog. The blog is about cocktails and the like. The
images used in this design clearly embody the message of
the blog “Cocktails.” The image of the bar and the graphic
of the margarita glass both enhance the design.

12. Bad use of Proximity
The images and prices are grouped so close
together and so randomly it is hard to tell
what price goes with what image.
Everything is crammed onto this page making it feel
cluttered and unorganized. Not only is it hard to get a feel
for the navigation it is difficult to tell one section/add from
another.
Both of these designs are great examples of how having white space
could help to improve a design. There is definitely not enough white
space and everything is crammed onto the page. They both feel
cluttered and unorganized. Adjusting alignment, proximity, and adding
white space would go along way to improving both of these designs.

13. This is a clip from a blog I follow. The
post was demonstrating different ways
of using fresh flowers to decorate your
home. Each image was accompanied with
a short explanation and a number to
associate it with a link at the bottom of
the post.
Number to associate image with link at
bottom of blog post. It overlaps the
image, clearly identifying this idea as #4.
A short explanation overlapping the image so you
can tell this description goes with this image.
Good Use of Proximity
Each link title and icon are placed next to each other with faint dotted lines separating each set. It is clear which icon is for which link.

14. The alignment appears to be centered throughout the
design. However, it also looks messy. The text size of the
title appear to be two different sizes but not different
enough, they don’t align very well and it causes it to look
like a mistake and the rest of the alignment looks
unbalanced and off centered.
The alignment is not consistent making it look cluttered and
messy. The justification changes throughout and is
inconsistent. Towards the bottom changing from both left
and right justified to centered. In some other areas you can’t
tell. It looks sloppy and off balance.
Bad Use of Alignment

15. The body of text is aligned to both
right and left justification giving a clean
look. The bottom of the “K” lines up
with the top of the second paragraph
which helps unify the design. The body
of text is slightly inside the title width
helping to emphasize the title.
Good Use of Alignment
The alignment in this design creates a clean and impressive grid like feel.
It looks structured and organized. The navigation menu aligns perfectly
with the left edge “06 Mar” image. The Title and subtitle align perfectly
with the left edge of the “13 Mar” image.

16. Repetition of leaf shape to emphasize the
season, however some of them conflict with text and
there are too many of them which makes it feel
cluttered.
Bad Use of Repetition
The flowered embellishments in this design do not add to the
design. They are distracting and although they add a repeated
element there is no benefit to including them.

17. Repetition of the circle shape to tie the text
graphic to the image. Repetition of the
color red to help unify the design.
Good Use of Repetition
Repetition of the layout and the
color pink to unify the design set.

18. Bad Use of Contrast
There is not enough contrast in font sizes
between the titles and the text to make
them stand out. They are too close in font
size, and appear to be the same size font.
The title font sizes are too close to the
same size they aren’t different enough or
should be the same. It looks like a mistake
and creates and unbalanced feel.

19. Good Use of Contrast
There is clear contrast in the font sizes and styles for the reader to
clearly identify the subject and title of this page.
The contrast between the two
font styles, script and slab
serif, work well together in this
add. They create interest and not
conflict.

20. Bad Use of Color
There is too much color on this page it
distracts from the design and the
information is lost.
The use of orange in this design should add
interest and draw your eye to important
content. However the over use of the color
puts the focus on “Friday,” “Sunday,” and
“modern” rather than where it should be
“Family Weekend,” “February 7th,” and
“February 9th.”

21. Good Use of Color
In this design the color red is used to tie the
design text to the image. The red circle
behind the letter “A” plays off of the red in
the hat and dress of the little girl.
In this design the color pink is used to unify the
design. The pink in the flowers is pulled into the
colored circle. This draws your attention to the circle
(which is a reference in the larger design set) adding
interest but keeping the design relaxed and balanced.

22. Bad Use of Style This is a bad example of style. There are too many
different backgrounds, fonts, and alignments with
nothing to ground the design. I can’t even tell if
any of the fonts are the same. I would say this
design has no style.
I think this design attempted to have a style
and failed. It appears as if they were trying
to go with an antique or old style. They
mixed fonts that conflict and didn’t commit
enough to the style they chose.

23. Good Use of Style
There are repeated elements to tie the design
together. The pink lettering and white side
bar do a nice job of creating unity between the
pages.
The image placement is consistent, adding
another repeated element which helps to
keep the style consistent throughout the
pages.
This is a website for a skateboard company. Their
site is done in a grunge style. Using a decorative
font with a worn look to it. It woks well with
their content. I would also consider this a
minimalistic design.

24. Conflicting Type
There are too many different types used in this
design they are conflicting with each other and
distracting from the message.
In this design there are two fonts that are too similar
to each other. It looks off and unbalanced.

25. Contrasting Type
The sans serif font used in the body of text and the script font
used in the image help create interest and do not conflict with
each other.
The script font is delicate but works
well with the natural elements in the
image. It doesn’t distract from the image
but adds depth and interest.
The bold sans serif font used for the title catches
your eye and works well to keep this design
simple and clean.
The slab serif font and the sans serif
font in this design work well together.
They are different enough that they
create a nice contrast.

26. The EndCSE 615 Designing Information