COMM130 Portfolio

ALEXANDRIAdesignsPORTFOLIO

ALEXANDRIAdesigns

2

Alexandria Lenz1361 York Dr.Vista, CA [email protected]

CONTACT

MontageLogosLetterheadBusiness CardBrochureFlierEvent AdWeb PageImaging

TABLEOFCONTENTS

CONTACT..........................................................2PHOTODESIGN.........................................4BUSINESS CARD................................................6 LETTERHEAD..............................................8MONTAGE..................................................10LOGO.......................................................12BROCHURE.................................................14FLIER.....................................................16EVENT AD.........................................................18WEBPAGE......................................................20

ALEXANDRIAdesigns

4

PHOTODESIGN

Blessings of CloverThis is my photo design project. I wanted to make my photo the focal

Lightroom, Illustrator, & PhotoshopFebruary 8, 2015

COMM130 BYUI Caryn Esplin- 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-de-structive editing.)- Size and crop the image, then place on an 8.5×11 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.

I first took around 30 photos of the morning frost on the greenery along my fence line. I know that if I have to pick a color scheme first, that I usually work best with earth tones. That seems to be my natu-ral go to, so naturally, I was out in my yard finding those things that would fit into the scheme – the Split Complementary. After I took the photos , using my Canon 40D, I actually edited about 8 using Vibrance/Saturation, the Sharp tool, Selective Color, Levels, and Color Balance. After I edited those, I chose this photo and started to work on my title and body copy. I knew that I had to add a repeating element, so I added the green circles to the clover stalk using the shape tool. Along with that, I used the custom shape tool to have my two borders for my copy. The lighter brick background is a lower opacity in order to get a more layered feel. In choosing my fonts, it took a while to get the pairing that I liked, and still was legible enough for people to easily read. I originally had a slab serif and a decorative, but decided to simplify with a sans serif and a script. I think that visually, with the matching color schemes of the design features and the photo, I have accomplished good gestalt and have heavily focused on the FOCUS technique.

TITLE:DESCRIPTION:

PROGRAMS:DATE:

COURSE:INSTRUCTOR:OBJECTIVES:

PROCESS:

ALEXANDRIAdesigns

6

Aztec Graphics Business CardA Business Card design for Aztec Graphics, a design company

Adobe Illustrator & Adobe InDesignMarch 1, 2015

COMM130 BYUI Caryn Esplin

- 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. Don’t 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.

I created everything in Adobe Illustrator. With my initial design I sub-mitted for the critique, I was extremely unhappy with it, so I decided to go a completely different direction.

I decided to create my business card first. I wanted something simple yet eye catching. I wanted good contrast, but not too many elements that it would become busy. I went with the Aztec Graph-ics because I wanted a play on my initials as well (AG), I think that helped me a lot in unifying my design.

After I created my basic elements in my business card layout, I designed the back with all my information on it. I wanted a very clean basic typeface for my body copy. I did not want to add to any of the heavy colors I had in my scheme.

After the business card was done, I created my letterhead. I wanted the repeating elements in their that I had designed, but I wanted a lighter feel so that people would be encouraged to write on it

TITLE:DESCRIPTION:

PROGRAMS:DATE:


PROCESS:

BUSINESS CARD

ALEXANDRIAdesigns

8

Aztec Graphics LetterheadA letterhead design for Aztec Graphics, a design company

Adobe Illustrator & Adobe InDesignMarch 1, 2015


- 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. Don’t 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.

I created everything in Adobe Illustrator. With my initial design I sub-mitted for the critique, I was extremely unhappy with it, so I decided to go a completely different direction.

I decided to create my business card first. I wanted something simple yet eye catching. I wanted good contrast, but not too many elements that it would become busy. I went with the Aztec Graph-ics because I wanted a play on my initials as well (AG), I think that helped me a lot in unifying my design.

After I created my basic elements in my business card layout, I designed the back with all my information on it. I wanted a very clean basic typeface for my body copy. I did not want to add to any of the heavy colors I had in my scheme.

After the business card was done, I created my letterhead. I wanted the repeating elements in their that I had designed, but I wanted a lighter feel so that people would be encouraged to write on it

TITLE:DESCRIPTION:

PROGRAMS:DATE:


PROCESS:

LETTERHEAD

ALEXANDRIAdesigns

10

MONTAGE

Service MontageThis is a photomontage of the LDS Youth’s 2015 Theme.

Adobe PhotoshopFebruary 15, 2015


- 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 scriptures…your choice)- Format type: Legibility; Small copy & Title with varying text size. Theme word(s)

I wanted to find something that I could hang up, or relate to, so when choosing a theme, I kept going back to my Laurel lessons and what I teach the girls each week, and this theme is just everywhere, so I decided to make it my own designI went to the LDS image archive and searched for images that had the keyword of service, I found so many to choose from. In my final design I decided to go with ones that had great lead room that would keep the viewer on the page and not be led off.Next I did a Google search for a sailboat. I searched other boats, but I made a conscious decision with the sail boat because I feel it encompasses adventure and the sense of the word embark.I opened all these images in Photoshop and used the lasso, mask, and brush tool to soften the edges and to create the overlapping pixels. All the photos were perfectly saturated, and had nice crisp lines. I did not have to do any editing on them. I did however create a screen overlay with the sailboat. It had very contrasting colors and the best solution for me was to create the overlay to lighten the image a little.After compiling the photos I continued to create my text format. This was the hardest and most time consuming. I played for hours to try to get it right. I am actually pretty happy with my final.

TITLE:DESCRIPTION:

PROGRAMS:DATE:


PROCESS:

ALEXANDRIAdesigns

12

LOGO

Captured Arrow LogoThis is a logo design of my photography company Captured Arrow.

Adobe IllustratorFebruary 22, 2015


- 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. I used Adobe Illustrator to do all of my logos. My first process was to sketch out several ideas and pick the ones that I thought I could refine in a week. I have some other ideas that I would like to try to execute, but that will have to be at another time. After sketches, I brought it to Illustrator to create them digitally. My main tools were the shape, line, and text tools. For my first logo, other than the type tool, I used the pen tool to create an arrow shaped head. For my last logo, the rectangle tool and the pen tool were extremely helpful. In the type with my last logo I used the type on a path tool and did some creative adjustments to get all the words where they needed to be.

TITLE:DESCRIPTION:

PROGRAMS:DATE:


PROCESS:

p

hotograph

y

CA

P

TURED ARROW

C PTURED RROW p h o t o g r a p h y

CAPTURED ARROW PHOTOGRAPHY LOGO DESIGNSALEX GRIFFITHS

CAPTURED A R R O W photography

ALEXANDRIAdesigns

14

TITLE:DESCRIPTION:

PROGRAMS:DATE:


PROCESS:

BROCHURE

Mermaid Designs BrochureBrochure for Mermaid Designs, a swimsuit company.

Adobe Illustrator, Photoshop, & InDesignMarch 29, 2015

COMM130 BYUI Caryn Esplin- Set up and align a two-sided, folded document.- Create an original, new logo and use it in a bro-chure.- 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 subheaders.Trim for a full bleed and print in duplex (two-sided) color.

I designed the all of the brochure in InDesign. I initially started with Adobe Illustrator to get my logo down, but when I decided to go with a type logo, and with the help of the pen tool in InDesign, I was able to completely create my brochure.

This time around I started with the color scheme and the repetition aspect. I wanted to be sure I had a good foundation for good gestalt in the end. Once I chose my color scheme, based on the ocean, I started to design my repetitious ‘waves’. I initially started to design waves like you see name brands using, such as RipCurl and Quiksil-ver, but I decided it was much too harsh for a swimsuit company for women. So I went with the more subtle curves.

I played around quite a bit with the inside, I wanted it to not feel so barren, so I used the color backsplashes to really make the informa-tion and the different sections ‘pop’. My titles for the inside were a little tricky, but thanks to InDesign, I was able to figure out how I wanted it fairly quickly (path tool!). I used the pen tool, type tool, path tool, paragraph styling, stroke, ellipse, and rectangle tool.

Headings use Arial BlackBody copy use Palatino

“suits so perfect, they’ll

mistake you for a

mermaid”

Founded in 2015, Mermaid Designs

originated with two sisters, Ariel and Athena from

San Clemente, California. Ariel is Triton’s favorite daughter, who has the

exploratory flair to travel the seven seas to seek out the best for her swimsuits, while Athena has the brains and the know-how to get

the business up and running. Both, however, have their significant

love of the ocean, and the lack of proper swim-wear for the ocean’s waves, they decided to redefine

ocean swim-wear and came up with this fantastic new company. Now

Mermaid Designs have fashion forward swimsuits that will

resist the wear and tear of the ocean’s

waves, sand, and even wax from your board.

origin

MERMAIDDesigns

Mermaid Designs1234 Beach Blvd.San Clemente, CA

949.555.1234

ALEXANDRIAdesigns

16

FLIER

Graduate Conference FlierThis project is a black and white promotional flier for a conference for graduating seniors.Adobe InDesignJanuary 25, 2015


- 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.

My process started with a 8.5×11 piece of plain printer paper and sketching four rough drafts of my promo flier. When I went to digital-ly render my sketches with InDesign, I played around with several of the ideas, but found one of my sketches reasonable for the informa-tion given. When it was time to critique and send in my draft, I was not completely satisfied with the font choice or my highlighted text in the black boxes, I really wanted my focal point and flow perfect. After receiving three critiques, I went back to InDesign to fine tune my flier. With my final submission, I felt like I created great flow, I found the perfect font pairing, my alignment is how I would like it, and it has good asymmetrical balance, giving it good gestalt and fo-cus. I saved my flier as a .pdf and sent it in to my local FedEx Office. I picked it up, did my youtube video, and am now posting it here on my blog.

TITLE:DESCRIPTION:

PROGRAMS:DATE:


PROCESS:

Graduate LEADERSHIP CONFERENCE

Do you want to have the competitive edge in business?Come learn how at Vouant Communication’s annual Graduate Leadership Conference.

Vouant Communications is devoted to helping tomorrow’s leaders gain essential leadership skills in the workplace. During this dynamic three-day seminar, attendees will meet with top executives of Vouant Communications to discuss breakthrough leadership techniques, while cultivating attributes of leadership that will market to any employer.

Conference is available to graduating seniors.

Space is limited.

Registration and more information available at:

www.vouantcomm.com/leaders

October 218 a.m. – 5 p.m.

Lincoln Convention Center

ALEXANDRIAdesigns

18

EVENT AD

Girl Scout Fundraiser Event Ad Project 2 is an event ad for a Girl Scout Cookie Fundraiser.

Microsoft WordFebruary 1, 2015


- 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

In order to design this Event Ad, I used my scanner, a Girl Scout magazine, and Microsoft Word. After scanning and sketching out some ideas, when I went to Word to design, I was surprised to find how easy it was to navigate. As for my actual design, I knew that I wanted it to have a youthful feel. Girl Scouts seems to have two color schemes, super girly and youthful or the solid earth tones, blue, brown, and green. I decided to go with the youthful scheme, not only does it appeal to children, and Cookie is in big letters, but the bold colors do catch the eye of the passerby. The FOCUS design principles played an important role in designing this peace. I felt like I had good repetition with the circles (or the cookie shapes), my contrasting colors were eye catching, I had a little bit of a diagonal/creative alignment, I wanted good rhythm to make the flow consis-tent and cohesive.

In Word I used the shape tool, the crop tool, the masking tool, the “eliminate background” tool, and the photo editor tool to accom-plish my final design.

TITLE:DESCRIPTION:

PROGRAMS:DATE:


PROCESS:

Girl scout Cookie

FUNDRAISER

February 25 5 – 8 pm

Walmart Vista Storefront 1800 University Drive

Have you bought your Cookies

yet?

ALEXANDRIAdesigns

20

WEB PAGE

Captured Arrow Web PageA web page designed to showcase a personally created logo.

NetBeans, Illustrator, & PhotoshopMarch 15, 2015


- 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 back-ground 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

I created this web page using Netbeans and Google Chrome. I used the html and css templates for my basis of the design. After I in-stalled the logo, I used Adobe Photoshop and Google Chrome CSS Editor to extract the matching colors for my color scheme.

I used Adobe Illustrator to create the background with the arrows, using the pen tool.

After I made the necessary changes to the CSS and the HTML files, I validated them using http://validator.w3.org/ website to check my CSS and HTML.

TITLE:DESCRIPTION:

PROGRAMS:DATE:


PROCESS:

Documents

COMM130 Portfolio