Digital Media Content Portfolio by Scott Butler

7/28/2019 Digital Media Content Portfolio by Scott Butler

1/21

PortfolioScott Butler


2/21

ContactSco J. Butler

3226 Marthas CoveCoonwood Heights,UT [email protected]


3/21

Table of ContentsMontageBrochureImaging ProjectWeb PageLogosEvent Ad

Business CardLeerheadFlier


4/21

MontageD:A motivational image combining three images and using photo masking techniques.

D:2/16/2013

C/I:Comm 130 Section 05Eric Lybbert

P()/T:Adobe Photoshop

O:Learn to use masking techniques in Photoshop using multiple layers. Use lters.Position layers according to design principles.

P:I began by selecting several images o the internet from the sites listed below.For the background I used an image of the Chicago skyline showing a frozenLake Michigan as the foreground. I chose this to add contrast between the blue

background and the red of Jordans Chicago Bulls Jersey. I then added a lter, whichwas Poster Edges, and reduced opacity to 50%. I then introduced the images ofMichael Jordan, and used masking techniques learned in this unit to blend theminto the background. With the image on the left, I had to rotate it horizontally tohave Jordan facing inwards rather than o to the left, and had to use the lasso tool toip the leering to read correcty. I used 100% opacity around the edges of Jordans

gure, except in the area around his feet in the dunking image to show the crowdand the other player. On the relevant parts of the images I used between 10% and30% opacity to create more gradual blending and emphasize certain spots whichwould be more bold and thus draw more focus such as the basketball and his faceon the image on the left. I then created the text, using white to contrast with the dark

blue of the skyline. I placed SUCCESS in capital leers with a san-serif font to givethe contrast against the slab serif of the lines of text. I aligned the body text with theU in SUCCESS to give a more appealing look.


5/21


6/21

BrochureD:A two-sided, folding brochure utilizing a logo made from a previous project.

D:3/30/2013


P()/T:Adobe IllustratorAdobe PhotoshopAdobe Indesign

O:Learn how to create a duplex brochure. Use text wrapping and Paragraph styletechniques in Indesign.

P:First, I selected eight images from the internet to use on the brochure. Second, Ichose a logo for my company from a previous project in Illustrator and adaptedit for this brochure. Next, I created a brochure in Indesign, using the shape tool tocreate colored rectangles blue and yellow to compliment and contrast the logocreated and the image on the front of the brochure. I placed text and images withinthe brochure, editing two in Adobe Photoshop to remove the background. I used textwrap with some of the text, specically around the image of the man with the hat. I

placed the images and text in appealing positions utilizing good ow and proximity.I had to align the text in a specic way to be able to cut out part of the brochure toachieve a cut-out design see video for demonstration.


7/21

Back Front

Inside


8/21

Imaging ProjectD:A photograph that has been cropped and edited in Photoshop.

D:2/09/2013


P()/T:Adobe Photoshop,Cannon Ixus Camera

O:Learn techniques of basic photography. Learn to crop, edit a portion of the imageusing a selection tool, alter hues/brightness, and add lters in Photoshop.

P:First, I took several photographs in the Gardens on BYU-Idaho campus. I thenchose one that I felt demonstrated good techniques of composition. I uploadedthe photograph to the computer in Adobe Photoshop, and resized and croppedthe image to 66 at 15o ppi. I edited the photo to beer represent the one-thirdprinciple. I then selected the lion gure and added the watercolor lter, fading itto 25% opacity. I also added light additional saturation to the lion. I then selectedthe background of the image and reduced the saturation to a very low value, veryslightly colorizing it with a reddish-orange tint. Finally, I added the watercolor

lter to the background.


9/21


10/21

Web PageD:Personally designed webpage utilizing a company logo.

D:3/16/2013


P()/T:Adobe IllustratorAdobe PhotoshopTextWrangler

O:Learn to create a png with a personally designed logo. Learn basic HTML codingand CSS skills in order to design the layout, colors, and positioning of a web page.Use hex colors to design colors of the web page.

P:I rst took the image of a logo I had created for a previous project, and transformedit into a PNG le to insert into the HTML coding. I then structured the HTMLcoding for the page, creating the text and puing the pertinent information intoan unordered list. I also inserted the image. I then used the provided CSS demo toconstruct the CSS for my webpage, aaching it to my HTML. I made changes tothe colors, including making the background blue, and making the background for

the headings red while changing that leering to white. My rationale for makingthe background of the headings the same color of red as is displayed in the logo istwo-fold. Firstly, it draws in the focus o te viewer, and secondly, it contrasts quitewell with the white and blue, mirroring the colors in the logo. The blue of the pages

background is not found in the logo, but I used it because it contrasts beautifullywith the red and white used. I experimented quite a bit with the layout, researchingnew tricks to use. Ultimately, I seled on a fairly simple layout, with the headingsaligned to the left, as well as the text and the logo image. I decided to place some textto the right of the logo which gives an introduction to the company. My rationale forthis is that it is a separate thought from the logo explanation and deserved its ownspace. I also wanted to left align the logo and not leave too much white space. I feelthat there is enough white space as it currently is. Below that, I placed the text thatexplains the origin of the logo, including the tools used to create it, the color choices,

and the target audience. The words used in the text come to a total of 313.


11/21


12/21

LogosD:Three logos designed for a company in Illustrator.

D:2/23/2013


P()/T:Adobe Illustrator

O:Learn to use tools and techniques in Adobe Illustrator, especially the pen tool. Createthree logos for a company.

P:I rst sketched out some ideas for logos that I felt would represent the small businessthat my brother and I are talking about creating. I used my artistic drawing skills toconceptualize the images, then used the pen tool in Adobe Illustrator to create thenal draft. I also used the paint brush tool and shape tool to add color and give morevisual contrast.. On the top logo, I illustrated the word Infamy, because I wantedit to t well inside the tie, eliminating trapped white space. II wanted to keep it assimple as possible. I used a simple black and white to achieve the same end, and togive it good contrast. On the middle logo I used white, black, and red for contrast.On the boom logo I used a combination of mainly yellow, white, and black, to give

the same contrast. On the middle and boom logos, I decided I wanted to stick tothe theme of a decorative text for the word Infamy and a script text for Apparel.I felt this was the best combination visually for the look I wanted to achieve andthat this combination gave the logos sucient contrast. The top logo utilizes adescending but right facing text, which o-sets the fact that it is in the center ofthe image. On the middle logo, I aligned the text to the right. I also tilted the hatand shades to the right to avoid a centered look. On the boom, I aligned the wordInfamy to the left and had the beginning of the word Apparel aligned with theleer M in Infamy. In each logo, I used the star shape tool to place a star on theI in Infamy. My goal with each logo was to create a simple, clean image whilemaintaining contrast and visual appeal.


13/21

infamy Apparel

INFAMYApparel

Infamy Apparel


14/21

Event adD:A full-bleed, one page ad meant to promote a charitable event using Microsoft Word.

D:2/2/2013


P()/T:Microsoft WordAdobe IndesignScanner

O:Scan an image from a magazine, upload it, and utilize it in an ad. Learn to create anad using basic design tools, such as text boxes and shape tools, in Microsoft Word.

P:I selected a good image from a Montana Tourism ad in the October 2012 issue of theNational Geographic Traveler Magazine, scanned it andcropped/resized it to the appropriate size, dimensions, and appearance. For the restof the ier I chose colors that would complement and contrast with the colors of theimage: dierent shades of blue and purple. I had orignially created a dierent designfor the layout, but have opted to recreate the ier in favor of a simpler, more sleekdesign. I rst ipped the image horizontally, placing it on the right, so that it would

lead focus into the page. I then created several colored boxes and the two whiteboxes with the shape tool. I chose to use a decorative font for Slopes for Seniorsand made it transparent using Adobe Indesign. I then placed it in the light blue

box. Lastly, I placed my body text within the white boxes. All of this was done inMicrosoft Word.


15/21

Seniors

SlopesFor

Downhill benefit Race for Rexburg

Seniors' Home!

Meet us for an exhilarating race in the

beautiful Teton Range just two hours

outside Rexburg, Idaho. Featuring a

downhill ski race with proceeds going

to our local seniors' home for

renovations and programs to benefit

elderly residents! Come join us and

have a blast while supporting a great

cause! See you on the Slopes!

For more details, visit:www.rexburgslopesforseniors.org

Saturday, February 16,

2013 at 2:00 PM

Grand Targhee Resort

$10 entree fee per

participant. Donations

are accepted.


16/21

Business CardD:Business card designed to match a leerhead, using a personally created logo.

D:3/2/2013


P()/T:Adobe IndesignAdobe Illustrator

O:Create a business card for a company using Indesign and Illustrator. Utilizeknowledge of basic tools in both programs.

P:First, I used the pen tool and shape tools in Illustrator to create the robot,incorporating light blue, white, and black. These colors give an interestingcontrast. For the business card, I aligned the logo to the left, with the hand of therobot pointing toward the text of the card. I then chose an appropriate text for thecompany name and added the star shape above the I. I made the text blue tomatch the logo, and added a line underneath the company name. I aligned the textto the right.


17/21

Infamy ApparelScott Butler

009.867.5309

scottjbutler.wordpress.com

145 Broadway

NY, New York 01001


18/21

LetterheadD:A personally made leerhead to match a business card designed for a business,

using a logo designed by me.

D:3/2/2013


P()/T:Adobe IndesignAdobe Illustrator

O:Create a leerhead a company using Indesign and Illustrator. Utilize knowledge of

basic tools in both programs. Learn to use a watermark.

P:First, I used the pen tool and shape tools in Illustrator. On the leerhead, I chose toplace the watermark on the boom right facing left to contrast with the right-facinglogo up top. This way, its hand should be drawing aention to the text of the leerabove. The twin logos function to frame the text of the leer. I aligned the logoup top to the left and placed above the robots hand the company name, and thenaligned the contact information to the right. I used a fading blue line that I createdin Illustrator with the line tool to align my name and the company name. I feel this

gives it a clean alignment and a crisp appearance. Items are grouped together andwhite space is utilized to create a sleek and appealing look.


19/21

Infamy Apparel Scott Butle009.867.5309

[email protected] Broadway

NY, New York 01001


20/21

FlierDescription:Black and white ier designed in Indesign, meant to promote a graduate leadership

conference.

Date:1/26/2013

Course/Instructor:Comm 130 Section 05Eric Lybbert

Programs/Tools:Adobe Indesign

Objectives:Use basic design and typography skills learned in class to create an appealing layoutfor a ier.

Process:I started o by creating some sketches with ideas of layouts for the ier. I thenselected elements from each design that I liked and created the ier. As I was in theprocess of creating the ier, I utilized black boxes in which to place images and text,to make the design more interesting, and to give it contrast and repetition. For addedcontrast, I played with the title text and gave one word a hollow-ll. I used whitespace for breathing room and utilized the image, logo, and text that were given. Igave the layout a ow that I feel visually leads the viewer from the title, to the image,to the text, to the website, date, time, etc., and nally to the logo.


21/21

G r a d u a t eLeadership Conference

Do you want to have

the competitive edge in

business?

Come learn how at Vouant

Communications annual

Graduate LeadershipConference.

Vouant Communications

is devoted to helping

tomorrows leaders gain

essential leadership skills in

the workplace. During this

dynamic three-day seminar,

attendees will meet withtop executives of Vouant

Communications to discuss

breakthrough leadership

techniques, while cultivating

attributes of leadership

that will market to any

employer.

Conference is available tograduating seniors.

Space is limited.

Registration and more information available at

http://www.vouantcomm.com/ leaders

October 218 a.m. 5 p.m.

Lincoln Conventioun Center

Documents

Digital Media Content Portfolio by Scott Butler