P9: Portfolio

DESIGN PORTFOLIOHolly Stadler

HOLLY STADLER457 S 4th W apt 34

Rexburg, Id21O. 739. 3O82

[email protected]

Table of ContentsBrochure: Project 8Letterhead: Project 6Business Card: Project 6Logos: Project 5Event Ad: Project 2Montage: Project 4Photodesign: Project 3Web Page CSS: Project 7Flier: Project 1

BrochureDescription: A two sided (duplex) folding brochure.

Programs: Adobe InDesign/Adobe Illustrator/Adobe Photoshop

Date: March 29, 2015

Course: Comm 130 Section 1

Instructor: Cory Kerr

Objective: Set up and align a two-sided, folded document. Create an original, new logo and use it in a brochure. Incorporate quality images. Incorporate at least four quality images, not including the logo. One should be clipped in Photoshop and text-wrapped in InDesign so the text follows the cutout shape of the image. Write at least 250 words of original copy in at least three paragraphs, headers, and sub headers. Trim for a full bleed and print in duplex (two-sided) color.

Process: I decided to work on a fitness brochure that promoted a healthy lifestyle. I came up with the concept of a multiple folding brochure full of triangles that all formed one large triangle (the strongest shape there is) and from there got the idea to do a step process.

I started by creating my design fold on paper. I then took that into InDesign. After getting the frame of my brochure worked out, I labeled which areas of the document were what panels they needed to be.

After coming up with the content, I Googled images that would help illustrate the activities that I mentioned. Once I found them all, I took them to Photoshop to make sure all the backgrounds were white and matched. As I placed them into my brochure, I realized I did not like the basic square shape they all came in so I cropped them into circles, again to give it unity and to match the logo and cover. The first 2 panels were really small so I used those as the pace to text wrap around the image to give me more space for the body copy. To achieve this I used the text wrap option to wrap my text around the alpha channel of the image.

With my text, I added styles everywhere for all the different categories like headings, body copy, numbers, and descriptions. With just using 2 fonts and paragraph styles, I was able to get a very unified front.

Green represents strength, growth and health and that particular hue of green is my sisters favorite. The highest contrast found in the brochure front is between the title and first panel to help make that the focal point.

The logo was a fun solution to my sisters name, Haley Eck. After much visual research, I found that a dumbbell weight kind of looks like a capital H. I then used the rounded rectangle tool to create a simple weight shape and then also made an E that matched the look of the H.

LetterheadDescription: Matching letterhead and business card designed using a personally created logo.

Programs: Adobe Illustrator & InDesign

Date: March 1, 2015



Objective: Use the basic tools in Illustrator & InDesign. 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, website, and email on each piece. Use periods, bullets, or spaces in phone number; no parentheses/ hyphens.

Process: I created the logo using simple shapes in Adobe Illustrator. I started with a basic triangle and added lines to create the smaller triangles into the bigger one. Then I used the pathfinder tool to make the smaller triangles into individual shapes. Then I added the logo to my individual art boards to be placed in the design.

I decided to make my first board a letterhead. I positioned the logo in the top left corner of my letterhead. I made sure to keep it at least 1 away from the edges, and everything else on the page an 1 away for balance. I then typed my contact information into a text box and positioned it on the right hand side of the letterhead. I made the company name 14pt font and my name 11pt font to contrast with the 8pt contact information. I then added a green triangle with the pen tool to the bottom to add unity with the logo.

STRONG AS H.ECK

HALEY ECKPersonal Trainer210. 739. 3100.

[email protected]

25 AugustaBoerne, TX 78006

Dear Holly Raney,

First off, you are so cool. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? I love you. You are the best sister ever! I want to give you all my money so you can buy clothes. Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur. Omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.

Sincerly, Haley Eck

Business CardDescription: Matching letterhead and business card designed using a personally created logo.

Programs: Adobe Illustrator & InDesign

Date: March 1, 2015



Objective: Use the basic tools in Illustrator & InDesign. 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, website, and email on each piece. Use periods, bullets, or spaces in phone number; no parentheses/ hyphens.

Process: I created the logo using simple shapes in Adobe Illustrator. I started with a basic triangle and added lines to create the smaller triangles into the bigger one. Then I used the pathfinder tool to make the smaller triangles into individual shapes. Then I added the logo to my individual art boards to be placed in the design.

After making the letterhead, I started on the business cards. I used the rectangle tool to create the front and back outline. I then copied/pasted the logo and contact information onto this page. I changed the logo smaller to match the size of the company name and description, and kept the contact information about the same size as the information on the letterhead, but changed it to be left aligned. I made sure that no important information came any closer than 1/8 from the edges. Finally, I enlarged the logo and put it centered and enlarged on the back of the business card.

STRONG AS H.ECKpersonal training

HALEY ECK210. 739. 3100.www.strongasheck.com [email protected] AugustaBoerne, TX 78006

LogosDescription: Three logo variations for the same company.

Programs: Adobe Illustrator

Date: February 22, 2015



Objective: 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 started with a list of the things that were important to the client like colors, personality and what they wanted the logo to represent, followed by much visual research and sketching. I then took to illustrator to start the digital process.

I wanted the top logo to be simple, chic, edgy and modern. I used the pen tool to create my own R, and to give it a bit more bulk I added the circle. I went through about 25 type options until I found the one that fit the logo best. And I made the final decision by finding one that matched the R the best and had rounded edges just like the logo as well!

With the middle logo I wanted it to be more cute and spunky. I started the main RHR with a type, then I changed it to an object that I could transform. I adding the long extensions to the R with the pen tool. I wanted it to have a circular feel, so I added the circle and the type around it, and matched the type with the original type I used to make the RHR.

With the bottom logo I wanted a unisex look, and for it to be chunkier. I wanted to do a pun with the last name, and messed around with a lot of ideas until I came up with this one. I created the cloud with the circular shape tool and the rain with the line tool. I chose the font to match the logo and keep with my goal of making it more unisex aka not as girly.

HO

LLY RAE RAN

EY

PH

O T O G R A P

HY

H O L LY R A E R A N E Y P H O T O G R A P H Y

RANEY DAYSP H O T O G R A P H Y

RANEY PHOTOGRAPHY

Event AdDescription: A color, full-bleed event ad to promote a fundraiser using only the toolls found in Microsoft Word and a scanner.

Programs: Microsoft Word




Objective: 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: I scanned the background from an Elle magazine and dropped it into Word to begin my project. I made sure to make the eyes hit the rule of thirds. I added the transparent triangles on the edges to give it dramatic movement, and played with the angles a bit to make sure they did not create tangents with her cheek or jaw bone. I chose the bold Helvetica font to grab your attention and show the modern and edgy side the flier was representing. But I chose to show a girlier side with the Adobe Caslon Pro font, which shows up just fine in a print. I was very surprised at the hidden design features of Microsoft Word and actually quite impressed but would never choose it over illustrator as it is very frustrating.

FASHION F U N D R A I S E R

FEB 21 2015 7 pm 9 pm

Victoria Convention Center $50 per seat

by LOUIS VUITTON

benefit fashion show and fundraiser for

BREAST CANCER

SHOW

More information can be found at https://www.LOUISVUITTON.com/fashionshowfundraiser2015

MontageDescription: An inspirational montage made in Photoshop by blending two or more images, and the use of typography.

Programs: Adobe Photoshop




Objective: Use the FOCUS design process with strong focal point and flow. Unify a layout with a consistent theme and dominant spiritual 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. Apply typography principles (titles, quotes, events or scripturesyour choice). Format type: Legibility; Small copy & Title with varying text size. Theme word(s). Select good quality images.

Process: I found a cool image of a galaxy and another of a moon and added them to Photoshop as separate layers. Then after added a mask, I painted away the hard edges of the moon with a soft-edged black paint brush at 100% opacity. The sky was black in the moon image so it naturally created the drop shadow effect I wanted. Then with a smaller black brush at 15% opacity and 50% flow, I blended the image into the background. Last, I added the quote center aligned to go with the symmetry.

Photo DesignDescription: Demonstrate good photography and image editing skills while incorporating a color scheme into a poster layout with original photo.





Objective: 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.) Size and crop the image, then place on an 8.511 page layout. Use layers to design text, and repeating graphic elements in Photoshop. Print with full-bleed margins. Trim only 1/8 (0.125) from all four sides.

Process: I first formulated my plan by choosing a color scheme from the Visual FOCUS book for my layout, I decided on Monochromatic. I went and capture a quality photo with good light, sharp focus, shallow depth of field,and nice composition. I used my T3i Rebel Cannon camera. I then brought the photo into Photoshop and used these specific editing techniques: levels, sharpness, saturation, and color balance, text, and color lay. Then I designed an 8.511 layout that including my photo, text, and repeating design elements. I incorporate my color scheme title, color swatches, and color names into my design. I used the eye dropper tool and adjusted the color in the color picker to match a little more accurately with the laces. Since the audience was for people who want or do exercise, I wanted it to be a bold neon type color like teal or neon yellow.

Web PageDescription: A web page designed to showcase a personally created logo from a previous project.

Programs: TextWrangler & Photoshop

Date: March 15, 2015



Objective: Size and optimize an original logo as a .png for a web page so the long side is 300 500 pixels. Write content to describe the process of creating your logo and how it appeals to a target audience. (Minimum of 200 words. Include rationale for colors, appeal to target audience, design skills, etc,) Acquire a working knowledge of HTML. (Include all required tags Doctype (provided), html, head, title, meta charset (provided), body, h1, h2, p, ol or ul (with li tags), img, br, and a link to blog.) Acquire a working knowledge of CSS. (Customize the provided CSS provided to format the HTML to complement the logo design. Change at least the following: The h1 text color & h1 background color, font colors for the paragraphs & list items, the background color, font families and add at least one css comment.) Identify hex colors to match logo, using Photoshop color picker. Open the HTML page in a web browser and capture a quality screen shot with .5 inch margins for printing.

Process: I created this web page using only TextWrangler. I had never seen or written any HTML/CSS, and it was interesting to see how it worked. It was also interesting to use the http://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 used the colors from my logo as the colors for my web page, and found them by opening Photoshop and using the eyedropper tool. I changed my fonts to Ostrich Sans and Helvetica, and chose backup fonts in case the viewers browser didnt 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.

FlierD e s c r i p t i o n : B l a c k & W h i t e promotional flier to promote a graduate leadership conference.


Date: January 25, 2015



Objective: 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: I first created some sketches of my layout. Then I used my sketch as a guide to create this layout in Adobe InDesign. I used black lines to tie my title and body copy together. I left white space to make sure my flier was inviting and did not seem overbearing with information. It also has asymmetrical balance which gives it some interest. I grouped all of the information together so that it was easy to read and get to the point. I was given the image, logo, and content for this flier.

VOANT COMMUNICATIONS

GRADUATION LEADERSHIP CONFERENCEDo you want to have the competative edge in business?

Come learn how to have the best competitive edge in the business at Vouant Communications annual Graduate Leadership Conference.

Vouant Communications is devoted to helping tomorrows leaders gain essential leadership skills in the workplace. During this very dynamic three-day seminar, attendees willmeet with top executives of VouantCommunications to discuss great breakthrough leadership techniques while cultivating the attributes of leadership that will market to any employer out there.

October 21st 8AM - 5PMLincoln Convention Center

Conference available to graduating seniors

Space is very limited

Registration and more information available at http://www.vouantcomm.com/leaders

Documents

P9: Portfolio