Ad Campaign Overview

Introduction

This project was designed for the students to learn how to use multiple Adobe products and integrate our skills into one final slide show.

The Project

We were told to find a design campaign and create a new design that would be part of the same campaign. I decided to base my design off the “California, find yourself here,” ad campaign. Attached, I have the original design and my new design.

 

Ad Draft V4
Introduction page w/ Borrowed content
Ad Draft V42
Frist transition page
Ad Draft V43
Original Design (Design Principles) w/ Borrowed content
Ad Draft V44
Original Design (Typography) w/ Borrowed content
Ad Draft V45
Original Design (Color) w/ Borrowed content
Ad Draft V46
Second Transition Page
Ad Draft V47
New Design (Design Principles) w/ Original content
Ad Draft V48
New Design (Typography) w/ Original content
Ad Draft V49
New Design (Color) w/ Original content
Ad Draft V410
Final Page revealing the Design’s Author 

Target Audience

My target audience for this project would be California public works or government officials. I would want to help show how design can help increase revenue for California.

Design

The colors of my design were based on the “California, Find yourself here,” campaign. The blue and yellow can be seen throughout the project. I also kept a rounded text to match the original design.

Conclusion

I had to design an original ad using Photoshop and make a slide show using InDesign. This project strengthened my ability to design using Photoshop and InDesign.

 

 

Advertisements

Icon Set – Project #2

Introduction

For this project, I had to create a set of icons with Adobe Illustrator. The purpose of this project was to introduce us to vector graphics. Using vector graphics allows designs to keep their intended appearance when being stretched or modified.

Context

Our class had two weeks to complete this project. Each student created their own designs by the end of week one and turned in a draft. We were given feedback for our designs and able to change our drafts.

The minimum requirements for the icon set were to use Adobe Illustrator, design 4-6 icons and make them appealing to a target audience.

Target Audience

The target for my icons was aimed at young professionals. I refrained from using lots of colors and flashy designs because I wanted my designs to catch the eyes of a professional audience.

My Prototype

Icons Draft
Created by David Grimmett

I created four icons. The theme is technology. There is a Camera, a Tablet, a Laptop, and a Television screen. The camera was my first creation in Adobe Illustrator; I loved the colors and the playful look so much that I changed my original plans and created these other devices based on the camera. After posting my first design, I received feedback from several sources that I should incorporate more color into my design. I agreed with these comments, but I had problems figuring out where to add color. After some trial and error, I found a way to add color into my final design.

In my prototype, all the devices have similar color schemes. The laptop breaks the consistency in the color scheme, but I was able to change that when I started on my final set.

My Final Design

Icons-Final---Correct-Sizes-Large

I liked to keep consistency between all of my devices as though they were created by the same company. I created a red area on the bottom left area of each icon to add color and contrast to the design. I also added a white plus to each of the devices. I thought that it made the series of icons fit together better.

I included two sizes of icons. The first and the largest are 400px by 400px, while the smaller icons are 60px by 60 px.

Icons-Final---CameraIcons-Final---LabtopIcons-Final---TabletIcons-Final---Tele

 

Some basic changes I made to the icons include:

  • The addition of a button to the top of the camera.
  • A modified color scheme on the laptop in order to match the other icons.
  • The screen was widened on the tablet to take up more empty space.
  • The addition of color to each device
  • The addition of the cross design to each icon.

Lists of similarities between icons:

  • Overall color: Blue, Red, Balck and Four to Five Shades of Grey,
  • The Reflection on the glass.
  • The rounded edges on each design
  • The Plus Design in the bottom left corner

Conclusion

Throughout this project, I’ve learned a lot about vector graphics and how they are used when creating designs. Adobe Illustrator is a powerful tool, and I will continue to use it when working in designs.

Magazine Spread – Project #1

Introduction

For the past two weeks, I have been working on a magazine spread. I started by making concepts for the spread and eventually came out with a final draft. There is a significant difference between my prototype and the finished project. I’ve learned a lot from this project. It helped me understand how certain shapes, lines, and colors can change how the overall feel of a design.

Context

The project was given to our whole class and everyone was given the task of making a magazine spread consisting of three pages. This project is supposed to help us understand Adobe Indesign and its application for the real world. The following is a list of project requirements:

  • Use InDesign
  • 3 Pages; 1 Spread;
  • 8.375” x 10.875” page size
  • 2+ Column Layout
  • 600+ Word Article (Found on LDS.org or BYUIScroll.org. The article can have a title, but no other headings that break it up.)
  • Break the article up with 3+ headings/subheadings
  • 1+ Pull Quote(s)
  • 2+ Relevant Images (Shot by student)
  • 1+ Word Wrap (image or shape)
  • Consistent headings and body copy
  • Contrasting typography
  • Provide a link to the original LDS.org or BYUIScroll.org article in your blog post.

My choice of Typography

I decided to fo with a San Serif and a Serif font. I used the Serif font as my title and headings because I like the larger text to have more flair than the San Serif paragraph text. I used custom fonts created by Exljbris Font Foundry online called “Fontin” and “Fontin Sans.”

The Prototype

Project Design - Draft - GrimmettProject Design - Draft - Grimmett2Project Design - Draft - Grimmett3

 

My Prototype had many flaws. First, the title page is a mess. The title is comprised of too many words and takes up a lot of room; It should have been between 3-6 words and got the point across. The other problem with the first page is the design. The odd shapes create too much clutter. The viewer’s eyes would be all over the page, in addition, the mossy green is unpleasant to look at and a bad color to put text on. Second, the second and third page have this colored ribbon running across both pages. I initially thought that it would be a unique design, but it turned out to be a waste of space. It added to much clutter to the page. The final, problem was the amount of room around the pull quote. The text was hugging the pull quote box and it just gave a bad look the text box.

My Revised Spread – Final Design

Project Design - Final - GrimmettProject Design - Final - Grimmett2Project Design - Final - Grimmett3

Though some trial and error, I reached a design that, in my opinion, looks pretty good. The first thing I changed was the color. I found this light blue to complement the photos of the temple. The next goal was to change the overall look and fell. In order to do this, I had to scrap the custom shapes and space filling areas. So, after coming up with the angled design, I had to figure out a way to make it all fit together. The line from the title page meets the line of the third page and the line of the second page meets with the line of the third page. By doing this it creates a feeling of continuity. Another improvement I made was to the title page. The text of the title is between two parallel lines, heading down from left tot right, This creates leading lines to help the reader’s eyes read the title. I also added another photo on the third page and created more space around the pull quote.

Conclusion

I learned a lot from my first prototype. I definitely went into the project thinking that I could make a fresh and unique design, but it turned out to be too cluttered. After witnessing my mistakes, I was able to incorporate more principles of design into my final work. I added leading lines, a better color scheme, and more pleasing repetition though shapes and lines.

Photos Used in the Project

These photos were acquired by me on a Samsung Galaxy S7 Edge.

Photography Reverse Engineering

Introduction:

In this blog, I will explain how the concepts of photography help the viewer understand the focus of the image. I will post pictures done by other photographers then post a picture I have personally taken. Each other image will have a description with information about the technique.

Rule of Thirds:

Rule of thirds - Switch

Photo by Christo Salcedo – http://christosalcedo.weebly.com/1/post/2013/01/rule-of-thirds-pictures.html

Rule of thirds - Switch - Drawover

This picture follows the rule of thirds because most of the image is taking up 2/3 of the picture. The interesting lines in the top left show where the most focus is. The image is more defined in that area.

Rule of Thirds - Me - Fix .png

Picture was taken by David Grimmett (personally taken Picture)

Rule of Thirds - Me - Fix - Drawover

In this picture, the light switch takes up 2/3 of the whole image. The focus of the picture is near the intersecting lines on the right. These points are surrounded by the most contend. This pulls the viewer’s eyes toward the right side of the switch.

Leading Lines:

Leading lines - Chess

Photo by: Shayna Santin – http://isite.lps.org/cpetska/web/dw/pages/begphoto/14-15%20T3/1st/shayna%20santin.htm

Leading lines - Chess - Drawover

In this picture, the photographer uses the grid system on the chest board to bring the viewers eyes toward the front of the picture. All the lines coming toward the front of the image converge with a perpendicular line going toward the left side of the picture.  This causes the viewer’s eyes to focus on the intersecting areas of the image.

Leading Lines - Me

Picture was taken by David Grimmett (personally taken Picture)

Leading Lines - Me - Drawover

In this picture, the lines coming toward the front draw the observer’s eyes toward the chess pieces. The lines going from right to left also help the focus of the image stay toward the from and near the objects they intersect with.

Depth of Field:

Depth of Field - Piano

Photo by: Anna Jane – https://www.etsy.com/listing/76749318/photograph-fine-art-photography-photo?ref=sr_gallery_6&ga_search_submit=&ga_search_query=Piano&ga_search_type=handmade&ga_facet=handmade

Depth of Field - Piano - Drawover

The photographer was able to focus on the piano key closest to the front. This caused all the keys in the background to become blurry and the content of the image is pulled forward.

Depth of Field - Me

Picture was taken by David Grimmett (personally taken Picture)

Depth of Field - Me - Drawover

In this picture, the object closest to the camera, which is a piano key is the only element of the photo that is in focus. The rest o the image is blurry. This causes the viewer to keep his/her eyes focused on the front of the image.

Conclusion:

Using photography techniques help convey to the audience what the purpose of your picture is. This allows a larger audience to understand and enjoy your work. Just by following these principles (Rule of Thirds, Leading lines, and Depth of Field), your future photographs will have a sense of expertise

Typography in Design

Introduction:

95-percent-of-web-design-is-typography

The image was found on a website that promoted font websites.

I couldn’t find an author of the image, but the author of the web page Jesse Aaron.

Image found on – http://inspirationfeed.com/resources/tools/the-massive-list-of-font-typography-resources/

Analysis:

First Facetype

Typography 1

The image above shows two types of fonts. The one surrounded by a red square is from the script face type. It is a script because the letters flow as though they had been hand drawn. The letters share some characteristics as a Serif due to the Serifs located on the letters, but due to the unevenness and erratic behavior of the font, I believe that it is a Script facetype.

 

Second Facetype

Typography 2

The text surrounded by the green square is from the Sans Serif family. The font doesn’t have Serifs protruding from the letters with leading me to believe that it is a Sans Serif. The strong horizontal lines of the letters also allowed me to identify it as a Serif of some kind.

 

Facetype contrast

 Typography 3 New.png

There are several differences between the two facetypes. The Sans Serif has strong vertical lines, while the script font sits at an 80-degree angle, instead of 90-degrees like the San Serif. The script font also has Serifs on the letters giving it a fancier feel.

Conclusion:

The Sans Serif closest to the top is designed to relay information in a serious manner, while the script font in blue shows the creativity behind typography and web design. I audience would learn that fonts and the way the text is portrayed are important in web design.

Design Draw Over

Introduction:

Original Design:

MarthaStewart

Credit to: http://blogs.adobe.com/aemmobile/2013/09/ad-of-the-week-home-depot-in-martha-stewart.html

This design was in a Martha Stewart magazine to advertise DIY projects and Home Depot.

Analysis:

 

Contrast:

Contrast

  • There is contrast between the bright yellows of the walls and the open door. Our eyes are drawn to the area in the red box in the very center of the design because it contrasts with the rest of the picture.

 

Repetition:

Repetition

  • There is a lot of color repetition in this design. They bright yellows are all over the picture. The doors, the walls and even the graphic at the bottom of the design share the same light yellow.

 

Alignment:

 Alignment

  • The alignment of the text has been centered at the bottom of the design. The company name and logo is aligned with the center of the image.

 

Proximity:

 Proximity

  • The text at the bottom of the design show their relationship to each other because they are in  a box and have some white space between the each of the boxes.

 

Color:

Color

  • The colors used in the design are very bright. The warm yellows bring a sense of comfort to the viewer.  The bright whites in the trim and the floor also amplify the intensity of the yellows on the doors and walls.

Conclusion:

The first thing the viewer should notice is the repetition of color. The bright yellows jump out a the viewer and give them a feeling of warmth and comfort. Next, the viewer should notice the contrast and their eyes would settle at the middle of the design, where an open door is revealing the beautiful outdoors. After the viewer has taken all of that in, they should notice the text below.