Portfolio

Hailey Brock
Contact
Hailey Brock:
26220 N 43rd Ave
Phoenix, AZ 85083
480.466.9872
Hailey@brockbay.com
Table of
Contents
Montage
Event Ad
Imaging
Brochure
Ad
Logos
Letterhead
Business Card
Web Page
Flier
MONTAGE
Description:
an inspirational montage mady by the blending of two or
more images, and the use of typography
Date:
May 31, 2014
Course/Instructor:
COMM 130 ~ Visual Media
Julie Peterson
Objective:
Learn to manage Photoshop layers.
Learn to blend images together smoothly, using masks.
Apply appropriate typography.
Use flters
Process:
First, I cropped the background image, which is an image
of Arizona that I took myself, to 8.5x11 inches. I then used
a “Stylize” flter on the background and the the Lighten
option to bring out more of the detail in the land under the
clouds. I added in the picture of (what looks like) a Whale
Shark and placed it on top. Thankfully it was a good size for
my picture and I did not need to edit the dimensions at all.
With black paint and a 100% opacity, soft-edged brush, I
painted away the hard image edges. The two pictures had
very similar color schemes so they were easy to blend. I
fnally added my font. I used Prestige Elite Std as my font, in
white, because it gave the design a simple, typewriter look.
I kepy my font fairly small so that it would not distract from
the two images.
EVENT AD
Description:
A color full-bleed event ad to promote a fundraiser using only Microsoft
Word and a scanner.
Date:
May 17, 2014
Course/Instructor:
COMM 130 ~ Visual Media
Julie Peterson
Objective:
Find, Scan and import a high-quality image.
Create a full-bleed design.
Use text boxes for layout in Word.
Insert and edit images in Word.
Process:
I scanned the baking image frst. I then inserted the purple boxes to
take out any text that was originally on the picture. I wanted to keep
my design simple since my picture was busy in itself and it was taking
up the full ad. I knew that the purple boxes alone weren’t enough
so I added three yellow boxes on the edge of the two boxes that
contained the most important information. I made them descend and
ascend in transparency so that they wouldn’t draw as much attention
to themselves. I chose a Modern font for the title and then a sans serif
font for the rest to keep things simple. I used the following programs:
Microsoft Word, Epson Scanner, PDF2JPG
IMAGING
Description:
Demonstrate good photography and image editing skills. Incorporating color
into a poster layout with original photo.
Date:
May 27, 2014
Course/Instructor:
COMM 130 ~ Visual Media
Julie Peterson
Objective:
Learn basic photography skills.
Use a digital camera to take a quality image, then download it.
Size and crop the image.
Adjust image brighteness, contrast, hue and saturation levels.
Use a selection tool to isolate a portion of the image.
Desaturate the selected portion of the image.
Use a flter or colorize a portion of the image.
Process:
I frst chose a color scheme. I knew that I wanted to use nature, so I chose green.
I then decided that I wanted it to be green alone, so I made it monochromatic.
After that, I used a Powershot camera to take a picture outside to Spori building.
I made sure that my focus was on the green plant. I then took my photo into
photoshop and I created a draft that was pretty simple. I gave it a green border,
and then a border of white, with a fll of a different green. Then I put my picture
in the bottom right and my quote at the top. Originally things weren’t very
aligned, so I moved the text to be aligned with the right of the picture border,
and then the author of the quote was aligned with the word “arises.” I then
added color swatches on the side of my design. That was actually the most
time consuming for me. I needed the pastel green to show up against the
background(which was inconveniently the same color) so I added a cirle border
behind each color swatch circle. I then masked the right side of each circle to
keep it in the frame and to not cover my border.
BROCHURE
Description:
A two-sided folding brochure.
Date:
July 13, 2014
Course/Instructor:
COMM 130 ~ Visual Media
Julie Peterson
Objective:
Set up and align a two-sided, folded document.
Learn how to wrap text around an image.
Use paragraph styles in InDesign.
Process:
I set up the fold in Adobe InDesign. I split my layout into
two sections so that I could add a little bit of organization
to my design. I chose circles and rounded edges to be the
element in my design that was consistent and repeated. the
circles on the front tied in well with the rounded edges of
the boxes on the inside. For the image of the basket logo
on the right side, I used the ‘quick selection tool’ in Adobe
Photoshop to remove the background of the image. I then
used the ‘refne mask’ dialogue box to smooth, feather, shift
edge and apply contrast to the outline of the basket. The
changes I made in the ‘refne mask’ dialogue box made a
softer image that looked sharper and cutout against the
brochure’s background. I then ‘placed’ the famingo into
InDesign where I used the ‘text wrap’ option to wrap my text
around the ‘alpha channel’ of the image.
Outside
Inside
Ad
Description:
An Advertisement for a unique invention from Japan.
Date:
July 19, 2014
Course/Instructor:
COMM 130 ~ Visual Media
Julie Peterson
Objective:
Create a new project that took at least 2 hours to complete
Process:
I loved this Project because of the freedom that I had from it. I frst started
in InDesign. I made the background a light red color to ft in with my red-
teal-orange split complementary color scheme. I then added the text
and I “placed” an image in the left corner. After that I saved it as a PDF so
that I could add a few masks to a couple more images in Photoshop. So,
after opening the PDF in Photoshop, I placed 3 images into the design
and masked them so that their white backgrounds would not be so harsh
against the red background I had created. I then took 3 images of little
“Cupmen” and I used the selection tool to get rid of their background.
I used the refne edge tool to make it look a little nicer. I then placed
those men at the top of the screen underneath the cup that I placed
in the logo so that they would look like they are falling. Honeslty, I fnd
this product adorable and I wanted others to feel that way too. I used
the Bright color scheme and the fonts “Bauhaus 93” and “Abadi MT
Condensed Light” because I wanted the ad to have a Japanese feel to it,
since that is where the product is from. I got ideas from other Japanese
product ads. At the end I fnally placed the Japanese logo for product
underneath the title and used a mask to make the edges more gentle.
LOGOS
Description:
Three logo variations for the same company
Date:
June 7, 2014
Course/Instructor:
COMM 130 ~ Visual Media
Julie Peterson
Objective:
Create a variety of logos to ft a company or personal image.
Use the basic tools of Illustrator.
Process:
I really enjoyed this project. I had a lot of fun learning how to use illustrator
and I loved the vector images. No pixelation. I think that is a beautiful
thing! To create my frst logo, I wrote the text “HaileyMichelle.” then I made
it into an image so that I could extend the right side of the H and so I could
color the dots of the “i’s” separately. I then added an underline which I
made look as though it were painted. I gave the underline a thick stroke
so that I could use the two seperate violet colors. I knew that I wanted
to use violet-teal-gold color scheme and I just placed those three colors
where they ft. I added the word music as an afterthought and aligned it
with the C in Michelle. I then created a music note using different shapes
and then the pathfnder to “unify.” I aligned the Music note with the end
of the logo. My second logo was easier. I used the same music note I had
already designed, and I changed the color to ft a teal monochromatic
color scheme. I then added a darker teal stroke that also looked like a
“paintbrush.” After that I added the words HaileyMichelle and underlined
it with another shade. My third logo was simple but very time consuming
for me. I did exactly what I did the frst time but in segments. I used smaller
shapes to make up each section, unifed them individually, and then put
the three sections together by clicking and dragging my anchors with the
direct select option. I chose a color scheme of purple-orange-green.
LETTERHEAD
Description:
Matching letterhead and business card designed using a personally
created logo.
Date:
June 15, 2014
Course/Instructor:
COMM 130 ~ Visual Media
Julie Peterson
Objective:
Create a new logo to ft a company or personal image.
Design consistent layouts for a business card and letterhead.
Use the basic toold of Illustrator & InDesign.
Process:
I created the logo using simple shapes in Adobe Illustrator. I also
used the pathfnder tool to cut and combine these simple shapes.
Once the logo was created, I opened a new two page InDesign
document and placed my logo .AI fle into this document. My frst
page was my stationery. I placed the logo in the top right corner
making sure it was small enough to not draw too much attention. I
then used “copy & paste” to make a bunch of little boats exactly like
the boat in my logo, just bigger. I dragged the little boats along a
grid line and spaced them out unevenly to give them more variety.
I had them lead to the contact information. After that I added a big
basket, taken from my logo, and I made it 4% opacity because it was
a lighter color originally.
BUSINESS CARD
Description:
Matching letterhead and business card designed using a
personally created logo.
Date:
June 15, 2014
Course/Instructor:
COMM 130 ~ Visual Media
Julie Peterson
Objective:
Create a new logo to ft a company or personal image.
Design consistent layouts for a business card and letterhead.
Use the basic toold of Illustrator & InDesign.
Process:
I created the logo using simple shapes in Adobe Illustrator. I
also used the pathfnder tool to cut and combine these simple
shapes. Once the logo was created, I opened a new two
page InDesign document and placed my logo .AI fle into this
document. My second page was for the business card. I did the
back frst because it was simpler. I took the same color as the
water from my logo and made it the background. I then made
it a shade or two lighter so that it wouldn’t take away from the
design. After that I placed the logo in the center. The front of
the business card was also fairly simple. I added the name of
the company in a larger font at the top. and made it the same
color as the background on the back. I then copied the rest
of the contact info from the stationery. I made every other line
switch off colors so that the card wasn’t as boring. Since the
design was pretty empty I added a boat watermark to the right
edge.
WEB PAGE
Description:
A web page designed to showcase a personally created logo.
Date:
June 29, 2014
Course/Instructor:
COMM 130 ~ Visual Media
Julie Peterson
Objective:
Size and optimize an original logo as a .png for a web oage.
Write content to describe the process of creating your logo and
how it appeals to a target audience.
Design a web page using HTML to display a logo and content.
Acquire a working knowledge of HTML and basic understanding
of CSS.
Identify hex colors for web design.
Compress multiple fles in a zipped folder to attach as one fle.
Process:
I created this web page using only TextWrangler. I had never seen
or written any HTML/CSS. It was interesting to see how you could
make a web page by only using a simple text editor. It was also
interesting to use thehttp://www.W3.org HTML validator. It was
useful to have something check to see if I had any problems with
my code. After I marked up all my content and inserted my image,
I attached a pre-made CSS document to my HTML. I then used the
colors from my logo as the colors for my web page. I found these
colors by opening Photoshop and using the eyedropper tool. I
also changed my fonts to Verdana so that they woud be Sans-Serif.
I declared some backup fonts just in case the viewer’s browser
didn’t have these fonts. I also used padding around the logo and
text so that they would not be too close to the edge of the web
page. This was one of the most challenging parts of working with
CSS. I had a really hard time aligning things.
FLIER
Description:
Black & White promotional fier to promote a graduate leadership
conference.
Date:
May 11, 2014
Course/Instructor:
COMM 130 ~ Visual Media
Julie Peterson
Objective:
Apply the design principles and use appropriate typography.
Incorporate basic InDesign skills to improve basic fier layout.
Create a project folder with image, logo and InDesign document to keep
links intact.
Process:
I started out my process by sketching four to fve different design ideas.
I chose which sketch looked best, and using that idea I created the
above layout in Adobe InDesign. I tried to use black lines consistently
to provide some repetition. I mostly used the color black but I had
grey shades used as well to contrast my design a little and keep it from
being too boring. I tried to use the grey box to catch the attention of
the audience to the time and place. I know that I like to see the time and
place right away that way I know if I am able to make an event before
spending time reading all of the information. I tried to let the white
space escape through the edges by using the “X” shape in my design.
I did not have to come up with the body copy, logo, picture, or any
other information. It was all given to me. This project purely refects my
designing.