week 13 - portfolio - comm 130

NICK ROUTSONG

010010101001010101010101010100111010011100100110010101011010

010010101001010101010101010100111010011100100110010101011010

01001010100101010101010101010011101001110010011001012016010

PORTFOLIO

010010101001010101010101010100111010011100100110010101011010

010010101001010101010101010100111010011100100110010101011010

010010101001010101010101010100111010011100100110010101011010

010010101001010101010101010100

111010011100100110010101011010

10101

10100

NICK ROUTSONGP.O. BOX 52932Mesa, AZ 85209

[email protected]

MAGAZINE COVERPREZIPHOTODESIGNMONTAGEBUSINESS IDENTITYINFOGRAPHICCODINGWEB PAGE MOCKUPBROCHUREADDITIONAL MONTAGE

TABLE OF CONTENTS0100101010101010101010101010101010100101001

46810121416182022

..........................................................................................................................................

DATE

4

MAGAZINECOVER101001011011010 0101010101010101010100101001

DESCRIPTIONPROGRAMS

COURSE & SECTION

INSTRUCTOR

Bianca Rodriguez

PROCESS

COMM 130 - Section 16

OBJECTIVE

DATEWork @ Home is a fictional magazine put together while learning InDesign.

Photoshop, InDesign

September 28th 2016

I started by sketching out a few potential layouts for the magazine cover. I focused on putting together a set of articles that would make sense for use in this kind of magazine. I then created a shape map in Adobe InDesign. I captured a photo that placed me in my work environment at home. I imported the photo into Photoshop and adjusted the contrast and color values. The photo was cropped to take out the items that were unnecessary for the magazine cover.

I created a new document in InDesign, 8.5” x 11” with a default gutter setting to ensure that my content was evenly spaced around the edge. I placed the photo into the InDesign document. I then added my title and aligned it with the top gutter, added the article titles, page numbers, etc.

I received critiques from class mates, my instructor as well as my spouse. Upon completing all my changes from the various sets of feedback, I printed the design cover and cut the edges to ensure a full bleed for the cover.

Design a magazine cover that showcases a self-portrait as well as 3-5 articles about yourself.

DATE

6

DESCRIPTIONPROGRAMS

COURSE & SECTION

INSTRUCTOR

Bianca Rodriguez

PROCESS


OBJECTIVE

DATE

PREZI101001011010101001010100101010101010101010100101001

Prezi, Photoshop

October 4th 2016

My Prezi presentation takes a user through the reasons why to pick WordPress as their default CMS.

I utilized Prezi to put the presentation together. I played around with a few of the samples and was pretty impressed what you could do with their software with fairly minimal effort.

I work on WordPress a lot, and tend to have a discussion with new clients regarding why I choose to go with it as my default content management system. I started a new text document and did some research on 10 points that I could make to put the presentation together. By preparing the talking points ahead of time, it allowed me to better visualize what I would need to put together to complete the project in terms of images needed, overall flow, etc.

I then sketched out the flow of the presentation on paper. I wanted the presentation to provide the user with parts and glimpses of the WordPress logo as they were flown around the presentation. All points surrounded the WordPress logo which was to be placed in the background. After sketching out the idea, I went ahead and got started with testing which fonts I wanted to utilize and what kind of spacing I should plan on.

Full presentation can be viewed here: http://prezi.com/vxkxqjkhufy5/ or scan the code below with your mobile device.

Create an instructional presentation using the Prezi software to demonstrate it’s features and capabilities.

DATE

8

DESCRIPTIONPROGRAMS

COURSE & SECTION

INSTRUCTOR

Bianca Rodriguez

PROCESS


OBJECTIVE

DATE

PHOTO DESIGN10100101101010100 0101010101010101010100101001

October 4th 2016

PhotoshopMy backyard provided the central image for this inspirational message. Each new day brings with it new opportunities to live.

I wanted to take a photo utilizing elements that I can see from my backyard. I knew that I would be able to capture green, yellow, and red – purple was a bit unexpected to be honest, but sure enough it made it in the photo. Going off the tip of utilizing the last two hours or the first two hours of sunlight in the day, I grabbed my camera and took a few shots.

I had to do a lot of work to the photo to bring out the green in the leaves and to make it a more captivating photo. I added some sharpness to the edges of the leaves to bring out the natural outer glow in them.

I then started laying out some elements, taking colors from the photo itself. I searched around for some quotes to put on the photo. I didn’t find one that I wanted, so I instead pulled ideas from a few sources and made a new one. I then ended up resizing after the fact when I was prepping more for print and had to re-arrange some things to make it all come together.

ORIGINAL PHOTOCAPTURED BY NICK ROUTSONG

By using photography and design skills, create a project that encompasses a consistent color scheme from the image.

DATE

10

DESCRIPTIONPROGRAMS

COURSE & SECTION

INSTRUCTOR

Bianca Rodriguez

PROCESS


OBJECTIVE

DATE

MONTAGE1010010110101100100 0101010101010101010100101001

PhotoshopThe backdrop for this photo was captured at the Phoenix Children’s Zoo. The message centers on communication with the savior each day.

October 19th 2016

To begin this project, I opened the images in Photoshop individually. Outlined them with the lasso/selection tool and added a 100px feather value. I then dragged the selected portion into the main image using the move tool.

I worked at blending the images into the main photo by creating a layer mask over each image. I then selected the brush tool, while having black as the foreground color. I varied the opacity and hardness of the brush until I was satisfied with the blending.

I enlarged the image of Christ to fill half of the layout to add a greater focus of connecting his image with the focal point of the image, the orange text, ‘Him’. Previously I had the hands up higher on the image, but I decided to move the hands to the bottom right to place less importance/emphasis on the praying hands, making them more of a secondary piece of the message.

I applied a strong Smart Sharpen filter to both of the images that I am including in on top of the background and it added a sharp detailed look to both of the photos.


Design a spiritual photo montage utilizing layer masks.

DATE

12

DESCRIPTIONPROGRAMS

COURSE & SECTION

INSTRUCTOR

Bianca Rodriguez

PROCESS


OBJECTIVE

DATE

BUSINESS IDENTITY0101001001011001000100100100100111001011

Illustrator, InDesignLaunchCrew is a brand that I’ve considered building for assisting companies in their digital launch of products.

October 26th 2016

The logo that is displayed in these materials was created as part of a prior project in the course. I imported it into a new InDesign document and the fun began.

I started playing around with arrangements of the triangle above the C on the front of the business card, figuring that I wanted to incorporate that more into the overall design and branding. After finishing up the front of the card, I created a new page within InDesign and started placing elements that I wanted to put on the back. Mainly extra information that wasn’t a required element of the front of the card – what services are offered, web address – separate from the email.

After the business cards were in place, I created another page in the project and started laying out the letterhead. I kept it consistent with the business cards, modern, clean and sharp.I moved all elements into Photoshop to create a package image to be able to better view all the business identity items at once.

Create a logo for a company/service/organization and establish a visual identity across documents.

DATE

14

DESCRIPTIONPROGRAMS

COURSE & SECTION

INSTRUCTOR

Bianca Rodriguez

PROCESS


OBJECTIVE

DATE

INFOGRAPHIC01010010010111001000100100100100111001011

IllustratorMy (now) home state, Arizona, is the land of the Grand Canyon. The infographic tells of some less known factoids.

November 2nd 2016

I created a new document and started searching out different facts and figures that could be used as part of this project. Initially, I was planning on doing an infographic for all of Arizona, but after I looked around a bit I could see that there would be too many things to fit in. I narrowed it down to the Grand Canyon while still incorporating some Arizona elements into my design – Arizona flag starburst, stars.

I drew up a couple layout ideas and defined my color scheme. I went to work in Illustrator creating the graphics. I had to search around a bit to figure out how to do some of the things I wanted to accomplish, such as rounding the text around the globe at the top. I took the circle that I had created as the background of the globe and emptied out the background. I then clicked on the path to type. I copied that path and added the other for the bottom, using the Selection Tool to flip the text to write on the inside of the circle for the bottom. That took more time than I am willing to disclose.

Overall this was a really fun project to work on and was my first attempt at creating an infographic. I frequently see them online and find them very useful at capturing attention and providing facts on topics that aren’t always that engaging.

Create an infographic that organizes data in a visually pleasing way.

DATE

16

DESCRIPTIONPROGRAMS

COURSE & SECTION

INSTRUCTOR

Bianca Rodriguez

PROCESS


OBJECTIVE

DATE

CODING1010010010111010111001000100100100100111001011

IllustratorCoding is my comfort zone. For this project I aimed for a modern yet light hearted page design. Houston... we have lift off.

November 9th 2016

The logo utilized in the project was designed as part of a former project in the course. I resized my logo to be no longer than 350px on the long side. I then created my html, css files and exported my logo from Illustrator, saving it as logo.png. I inserted all needed tags and content and completed initial styling.

I then worked on a background image in Illustrator and set it up to be a repeating image for the design. Keeping it light gray as to not detract from the message. I incorporated feedback from my instructor by spacing out sections more to add better proximity, as well as changing the headline colors to orange, rather than a blue color that they were previously.

After completion I tested the HTML and CSS using WC3 validators. I had a few tweaks to make, but overall, not many changes were required. I zipped up the files and took a screenshot. I placed the screenshot into Adobe Photoshop and added a shadow.

Code a custom webpage with HTML and CSS.

DATE

18

DESCRIPTIONPROGRAMS

COURSE & SECTION

INSTRUCTOR

Bianca Rodriguez

PROCESS


OBJECTIVE

DATE

WEB PAGE MOCKUP010100100101011 1001000100100100100111001011

PhotoshopDesign a website homepage using a grid.

November 16th 2016

I knew the feel that I wanted to go for with this design, but wasn’t quite sure on what kind of layout I desired for the page. I looked up a few different page layout ideas online and found several as my inspiration. I drew up 3 sketches with different layouts.

After drawing the sketches, I selected the one that I felt would best stick with the modern feel that I wanted to have to complement the logo and vibe of the company. I downloaded a 960 grid layout, 12 column and began drawing the different elements. After completing the wireframe, I began the digital mockup in photoshop, replacing the wireframe elements with those that I wanted to have in the mockup.

I’m tempted to actually code this one up so that I can further play around with a few of the design elements. The space background at the bottom would look great as a parallax image, moving around as you scroll through the page.

Design a website homepage using a grid.

DATE

20

DESCRIPTIONPROGRAMS

COURSE & SECTION

INSTRUCTOR

Bianca Rodriguez

PROCESS


OBJECTIVE

DATE

BROCHURE0101001001010101011 1001000100100100100111001011

Photoshop, InDesign, IllustratorThis design was out of my comfort zone. Ma & Me is another fictional (for now) company that is calling for further attention!

November 30th 2016

My wife recently put together an activity books for our kids to play with and so this design was inspired as a potential company that could create such products for families. I created a set of logos in Illustrator and asked for feedback from family. After deciding on the logo, I went into InDesign and started to layout my brochure.

I found multiple images and saved each as a Photoshop file so that I could place the images into InDesign, while still having the ability to modify them in Photoshop if desired since they were linked into InDesign. After placing the photos into the InDesign brochure, I selected one to have a text wrap around it on the back of the brochure which added a bit of interest to it.

After submitting this assignment, there was something about it that was bugging me. I came back to it and modified the location of the Activity Books on the header to be located at the top. Previously it was located just above the footer banner on the front. This change provided a better flow for the brochure.

Design a brochure for a company.

DATE

22

DESCRIPTIONPROGRAMS

COURSE & SECTION

INSTRUCTOR

Bianca Rodriguez

PROCESS


OBJECTIVE

DATE

ADDITIONAL MONTAGE01101010111 1001000100100100100111001011

PhotoshopSpiritual montage that focuses on Christ as the brightest source of light. December 6th 2016

I recently purchased a new camera and have been playing around with different lenses and settings, trying to learn more about what each can do and when would be an applicable situation to use which. While sitting around the Christmas tree I took a picture that was out of focus at the colored lights on the tree, creating a “bokeh“ effect. This photo is included in the montage.

I then searched for a photo of the Christus to use as a base image for the montage, to include into this portfolio as a final project. I played around with different overlays and masks within Photoshop. I cut out the christus out with a 100px feather around it to be able to better blend the images together.

I included a font that consisted of little stars composing each letter for the BRIGHTEST text. I duplicated that text layer 3 times and have them overlaying one another to better stand out than the single layer did. I added a yellow drop shadow behind it to further illustrate the word.


Create an additional project for this portfolio that took at least 2 hours to create.