PORTFOLIO

Jordan Heyrend
contact
Jordan Heyrend
510 Marion St.
Rigby, ID 83442
208.497.9564
jhey1313@gmail.com
TABLE OF CONTENTS
MONTAGE
STATIONARY
LOGOS
FLIER
EVENT AD
PHOTODESIGN
WEB PAGE
Description:
A quote montage with two images blended together.
Date:
JUNE 1, 2014
Course/Instructor:
Comm 130 Section 05
Eric Lybbert
Program(s)/Tools:
Adobe Illustrator
Objectives:
Unify a layout with a consistent theme and dominant message
Learn to blend two or more images together gradually, using
masks
Demonstrate more advanced Photoshop skills for layout with
multiple elements
Use a mask to apply a filter to one part of the image
Process:
To start off I inserted the picture of the eyes first and then the
galaxy image. I adjust the levels on the eye picture so that the
darks were a little dark and the lights a little lighter. Then I began
blending the eye picture at the top corners to get the black type
of border around her head. After that I started to blend bother of
the pictures together. I wanted the galaxy to be overlapping the
other picture to attain the look of the galaxy around her hands.
Once this was achieved I then blended the sides of both pictures
to get that continuing black border. I then worked on selecting
and pasting two circles from the galaxy to place into the eyes of
the girl. This made her eyes blend into the stars. I used the mask
blending and opacity tools to do that. To finish the eyes I sharped
them a little bit to get just the right amount of detail from them. I
mainly used the opacity tool on the last three elements of the
piece (quote, triangles, & title). I added a drop shadow to eyes
and dream. That pretty well sums up the tools and techniques
that I used on this project.
MONTAGE
Description:
Business Card for Quality Railing and Steel LLC
Date:
JUNE 15, 2014
Course/Instructor:
Comm 130 Section 05
Eric Lybbert
Program(s)/Tools:
Adobe InDesign
Objectives:
Create a new logo to fit a company or personal image. Do not
imitate existing logos or use previous designs. Dont use photos or
live trace.
Use the new logo to design consistent layouts for a business card
and letterhead. Photos are okay on business card and letterhead
as additional design elements. Letterhead should be 8.5 x 11, full-
bleed optional, but trim only .125. Business card should be 3.5 x 2
and printed above center on a vertical page.
Apply typography rules, keeping small copy.
Keep designs simple with light watermarks and drop shadows and
plenty of white space.
Include contact information: name, address, phone, and email on
each piece. Use periods, bullets, or spaces in phone number; no
parentheses/ hyphens.
Process:
In Illustrator I used a lot of the pen tool/direct selection to create
the variations in the logo text. I had to expand the descenders
of the q and the y to connect them. I created outlines so that
I could edit some of the ends of the letter on quality. I then
created two triangles (white and black) to create the dot in the I.
Lastly, for the logo I drew a rhombus and then used the duplication
tool to create the other two rhombi.
BUSINESS CARD
w w w . q u a l i t y - c u s t o m . c o m
R A I L I N G & S T E E L L L C
Jordan Heyrend
208.497.9564
jhey1313@gmail.com
510 Marian St
Rigby, ID 83442
Description:
Letterhead for Quality Railing and Steel LLC
Date:
JUNE 15, 2014
Course/Instructor:
Comm 130 Section 05
Eric Lybbert
Program(s)/Tools:
Adobe Illustrator
Objectives:
Create a new logo to fit a company or personal image. Do not
imitate existing logos or use previous designs. Dont use photos or
live trace.
Use the new logo to design consistent layouts for a business card
and letterhead. Photos are okay on business card and letterhead
as additional design elements. Letterhead should be 8.5 x 11, full-
bleed optional, but trim only .125. Business card should be 3.5 x 2
and printed above center on a vertical page.
Apply typography rules, keeping small copy.
Keep designs simple with light watermarks and drop shadows and
plenty of white space.
Include contact information: name, address, phone, and email on
each piece. Use periods, bullets, or spaces in phone number; no
parentheses/ hyphens.
Process:
In Illustrator I used a lot of the pen tool/direct selection to create
the variations in the logo text. I had to expand the descenders
of the q and the y to connect them. I created outlines so that
I could edit some of the ends of the letter on quality. I then
created two triangles (white and black) to create the dot in the I.
Lastly, for the logo I drew a rhombus and then used the duplication
tool to create the other two rhombi.
LETTERHEAD
Description:
Creating three different logos for the same company
Date:
JUNE 8, 2014
Course/Instructor:
Comm 130 Section 05
Eric Lybbert
Program(s)/Tools:
Adobe Illustrator
Objectives:
Create three completely different, original logos to fit a company
or personal image that will appeal to the audience. Do not imitate
existing logos or use previous designs.
Use only the Illustrator tools to create and draw your logos. (No
Illustrator pre-fabricated flares, symbols, etc.. No photos or live-
tracing. You may use an image or drawing as a guide to trace it
with the pen/pencil, but delete the image before submitting.)
Gather opinions from at least ten people about which logo
appeals most to them.
Process:
I used Illustrator to create these logos. I sketched out my designs
for the logos and then scanned them onto my mac so that I could
then use the pen tool and draw them out. After I got the basic
shape I added appropriate lines and the company name to match
the design. I used the direction selection tool to edit some of the
pre-made text to give it variety. Lastly, I used color schemes that I
thought would best fit my company.
LOGOS
Description:
A flier promoting a Graduate Leadership Conference for all
graduating seniors and college graduates. This flier needed to
include a vouant logo, one picture, exact text from client, and a
link to their website.
Date:
MAY 10, 2014
Course/Instructor:
Comm 130 Section 05
Eric Lybbert
Program(s)/Tools:
Adobe InDesign
Objectives:
Apply the design principles and use appropriate typography.
Incorporate basic InDesign skills to improve basic flier layout.
Retrieve image and logo from links on this page.
Create a project folder with image, logo and InDesign document to
keep links in InDesign intact.
Process:
After drawing a few sketches I decided to go with the layout
above. I thought it might but a subtle clever technique to use a
graduation cap for the top and bottom designs. It also allows
for there to be a flow from left to right, right to left, and then
left to right again starting from the top of the page. I felt like
leadership was the most important word in the title and that is
why I used it in the script typeface. I decided to emphasize the
first two paragraphs to grab the readers attention, in hopes that
they would continue reading the bulk of the message.
FLIER
Description:
This is a full color bleed document that was create in Microsoft
Word alone.
Date:
MAY 18, 2014
Course/Instructor:
Comm 130 Section 05
Eric Lybbert
Program(s)/Tools:
Word
Objectives:
Comprehend image sizing (how pixels and inches work together)
Find, scan and import a high-quality image.
Create a full-bleed design.
Choose a color scheme and typeface(s) that work for your
message and audience.
Learn to use only Word design features without using any Adobe
programs, including Photoshop.
Process:
First, I found an image that I wanted to use from a magazine
and then used a high quality scanner to upload the image into
Microsoft Word. I then only continued to use Microsoft Word. With
a combination of boxs with a drop shadow and 50% transparency
and created the layout and bulk of the design. I used the red line
through the players eyes to symbolize humility in the event, in
hopes to create more attention to the cause and not the means
to the end. I also used about a 60% transparency blend on the
actual upload picture to create a more unified look with the black
background.
EVENT AD
Description:
Use the principles of design to create a poster with an original
imaged that has been edited in photoshop (levels, vibrance,
selective color, sharpen).
Date:
MAY 23, 2014
Course/Instructor:
Comm 130 Section 05
Eric Lybbert
Program(s)/Tools:
Adobe Illustrator
Objectives:
Learn basic photography skills.
Choose a color scheme, take a photo to match those colors, then
incorporate the colors into the layout.
Use a digital camera to take a quality image, then download it.
Adjust image levels, saturation, color balance, sharpen tool on
separate layers for NDE (non-destructive editing.)
Process:
I used photoshop to create this poster. I began with just placing
the image into a 8.511 page and then started brain storming
design options. I thought that a circle would be good to use
because of the imagery that it creates from the message and the
curved lines on the flowers. Then I wanted to use an analogous
color scheme so it was ease to obtain this from the blue and
green flowers. I used a lot of opacity changes with the main
picture and the circles. This made the message stand out as well
as change the levels on the flowers.
PHOTODESIGN
Description:
A web page designed to showcase a personally created logo.
Date:
JUNE 29, 2014
Course/Instructor:
Comm 130 Section 05
Eric Lybbert
Program(s)/Tools:
Text Wrangler
Objectives:
Design a web page using HTML to display the logo and content.
(Use TextWrangler (Macintosh) or NotePad++ (Windows))
Acquire a working knowledge of HTML. (Must include all required
tags (Doctype (provided), html, head, title, meta charset (provided),
& body. As well as tag that links to external style sheet. With in
the body include h1, h2, p, ol or ul (with li tags), img, hr, and a (link
to blog) tags.)
Acquire a working knowledge of CSS. (Customize the Cascading
Style Sheet (css) provided in I-Learn to add page formatting
that complements the logo design, by changing at least the
following: The h1 text color & background color, font colors for the
paragraphs & list items, the background color, Font Families and
add at least one css comment.
Process:
To create this project I used a program called text wrangler. This
is quite different from the previous projects that we have done,
given that it isnt a direct editor program. I had to develop some
html and css skills in order to complete this task. I did this by
linking a separate css file to my html file. I was then able to use
a variety of html codes to create my unordered lists, paragraphs
and images.
WEB PAGE