Lupton Post

Grids are an essential part to website designs, mostly because navigation is so key for effectiveness. While researching for this assignment I've noticed that a lot of websites follow a 3 column grid (and my example is no different). I stuck with something I see every day, my homepage. A snapshot of CNN.com is shown below.



As you can see, the website is pretty well organized, with a set color palette, and user friendly appeal. But a lot of it has to do with the grid organization of the website. The top of the left column showcases a major news story, and big headlines are followed beneath it. In the middle, there are 10-15 quick newsworthy lines and on the right end, stock info, videos, and polls are available for CNN.com's audience. Overall, I really like the design of this website. In fact, when I was picking which news site I wanted as my home, I picked CNN because of it's organization of information and accessibility.

ebay grid

The grid used by ebay is simple and direct. No matter what part of the website you navigate to, the grid remains unchanged at the top of the website. The logo is at the top left corner, which is strategically placed because of its importance and the ability to have people recognize it easily. Below the logo is a search box and a list of different ways you can specify your search. In the upper right corner are different options of ways to navigate around the website. Buy, Sell, My eBay, Community, and Help the bold faced labels that appear on tabs. Below them in blue type are the options to contact us or go to the site map. Different shopping categories, motors, stores and deals are more tabs found on the left side to help the viewer. The website is very effective in using it's grid to help direct the viewer around the website. Because the source is online the interactive ability of the viewer is used by organizing the information by tabs that allow the viewer go directly to the area they clicked on. I think the grid used for ebay is very clear and effective for its purpose.

The only thing I've done for the past two weeks...

Okay, so I haven't really done very much homework since March 19. Instead, I've been on ESPN.com and Yahoo! Sports, editing and perfecting my bracket in anticipation for the most glorious sporting event in the history of the universe, the NCAA tournament. I've had plans to go to Detroit ever since SU earned a 3-seed in the easiest region and I WILL drive 10 hours to get there no problem. To sum it up, I LOVE BASKETBALL. All this nonsense aside, I decided to check ESPN while I was brainstorming for this post, and I found the perfect idea--the website itself.

This is their homepage. Note the grid, combining three columns with a larger image, etc. Scroll down a bit more, and this is what you see:

Note the same type of three column grid, now with six at the bottom. Instead, its a 6 column grid. This reminds me a lot of a newspaper, something classic like the New York Times, that doesn't have any column breakage and uses different numbers of columns simply to make it easier to find changes in articles. 

ESPN also publishes a magazine (aptly titled, ESPN the Magazine). The grid system on their website, at least in my opinion, channels that of a magazine with the strict set of columns. I think their layout works well, because they highlight the big stories of the day across all of the sports, and at the top they provide links to specific leagues (NFL, NBA, College Basketball, etc.). ESPN knows what their readers/watchers want, and they provide it at the top, as soon as their eyes grace the page. 

I think their layout is especially effective this time of the year, when thousands of people like myself are constantly checking sports websites for information on teams in the tournament that can make or break brackets. It's clear through all of the stories under the "headlines" category on the right and through the featured videos and articles that basketball is on the brain for most of America, and personally I really like it. It works well when I need to check stats/scores/info on schedules in an instant while watching a game or discussing with my friends. I probably need more hobbies.

Perez's Grid

Websites, just like newspapers and magazines, rely on a grid to keep order and bring functionality to the website. Most users, including myself before I took this class, don't realize that grids are being used, but they bring a sense hierarchy and a natural feeling of order. PerezHilton.com uses a grid to do that. It has a main column in the center of the page, with probably occupies two or three sections of the grid. On each side of the main column, two smaller columns with ads, and other information run down the page. These column are probably set to occupy one seciton of the grid. Even the ad banners and title are aligned with the invisable grid. Without the use of grids by PerezHiton, the page layout would be chaos, and Perez leaves the chaos shoudl to the celebrities.

Shopbop.com

 Shopbop.com is a premier online shopping boutique for the fashion savvy female, carrying everything a woman needs for her wardrobe. I log onto shopbop.com at least once a day, for it is updated on a daily basis. I don’t only love shopbop because of the amazing clothes and accessories it carries, but the site is very easy to navigate. Shopbop uses a grid to organize categories and direct customers to their proper needs. You can see how on the top left shopping can be narrowed by four categories: shop by brand, shop by category, shop by trend, and designer boutique. Below designer boutique there is a list of every designer the website carries making it very easy for customers to navigate. On the top of the page, going across you can click on: what’s new, sale, lookbook, designer index, exclusives, style guide and denim guide. All the categories you can shop from are all bolded and each grid has a white border and white lines, separating each category. The main colors of the site are orange, light gray, dark gray and white. The colors complement each other and the white typography on the orange and the gray really stand out, so the eye is drawn directly to the categories. The colors and calm and easy on the eyes, which makes the overall site enticing. Shopbop does a great job of showing why it is necessary to have a grid in online organization. Without grids, customers or visitors would be left lost with no form of direction. 

The Grid of the NYTimes

The New York Times, in my opinion, is a pretty recognizable newspaper, especially because it's on campus.

By analyzing the front pages of several recent newspapers, it's pretty clear that the Times has a precedented style for their front page and a pretty complicated, but well implemented grid system.

Checking out the font page at first glance I decided that the New York Times uses a simple 6 column grid, until i looked at the bottom. The section at the bottom of every front page, which gives a brief of each of the sections' main articles, uses a five column grid that doesn't align with the articles on the front page.

I'm not that great at math, but I eyeballed the alignment of the bottom, comparing the 6 column grid with the 5 column grid,
and decided that the New York Times uses a 30 column grid! Only if there were 30 equally spaced columns could the entire front page be laid out on the same grid.



Also, I knew that in the past 3 or so years, the New York Times has changed the size paper it prints on, so that the outside margins are different. I was wondering if they also used a 30 column grid system, or if they changes everything. So here's a picture of a 1998 NY Times before they made the changes.



Although I couldn't find the bottom of this paper, I think that the grid number has remained 30 columns, but the size of those columns has narrowed.

I think both the grid layout, and the recent size change have made the NY Times both a recognizable paper, and one easy to read in terms of layout. The small column size means that a read and skim through quickly. The smaller paper, also means the paper is less cumbersome to hold and sift through.

When grids go bad ...

I always though that the whole "humans are creatures of habit" thing was a little overstated. Then Facebook changed it's layout and people went CRAZY! This was the second time in about a year that Facebook reformatted the page, it was also the second time that the majority of people vocalized how angry they were. We get used to things. We know exactly how far down a page we have to scroll to see the information we need. We know where to click and often without even thinking navigate ourselves from one persons pictures to another interests to a list of our "friends" birthdays. When grids change suddenly we are lost. It would be like changing all of the street signs in your hometown. Despite knowing everything you have no idea where to find it. To me a big issue with the new Facebook is the lack of consistency. It is so difficult to see a person's photo albums because sometimes they are on the homepage and sometimes they are not. Also your homepage can easily become cluttered with people posting on other walls. It is once again easy to forget people's birthday because they are in the lower right corner rather than the upper right.  The real problem though is not with the new grid, it is with the fact that we had become so accustomed to the old grid. We knew exactly where to look and click and now we have a whole new grid to get to learn to navigate. I find the new grid, specifically in the "photos" section VERY  difficult to navigate. There is no sense of hierarchy and it is frustrating for a user to feel so "lost" in the page. Also the left side of the page has an excess of white space, wheras the right side seems cluttered. The lack of balance is annoying to look at as a user. I dislike the new grid, but I'm sure it will only be a matter of time until i get used to it and will be sad to see it go when yet another new one is introduced. 

GRID

(back issue, top, current issue, bottom)

"While single-column grids work well for simple documents, multi-column grids provide flexible formats for publications that have a complex hierarchy or that integrate text and illustrations." (115)

Above are two different layouts for a section that appears regularly in BPM Magazine. Both grids are simple and divide space for images, textual content and a recurring column. The vertical line on both grids gives hierarchy to Rob Simas' Buzz Chart. The chart is its own entity on the left of the page and readers find comfort in seeing it there every issue.

In the back issue, the photos are made into a block at the top of the page while the text is divided into two columns underneath. This causes confusion for which photo goes with which part of the text. This was remedied by numbering sections of the text and their corresponding photo.

In the current issue, the designers avoided the complication altogether by placing the each section of text directly across from its photo.

The new grid is made up of three columns: text, images, text. It creates a vertical sandwich with images in the middle that separate two different bodies of text. It's a little on the boring side, but it divides the content clearly for the reader.

Check out the Weather

I thought about a website that I use all the time that uses the grid format. I came up with weather.com, since I use it each day to check the weather.

On this website, the grid the system is used to clearly display all of the information. When the viewer enters the page, one automatically sees three distinct columns. One holding a map and videos, the second column with updates on today's weather and the right column with advertisements. These grids make it very easy for the user to navigate through the site and know exactly where to go for the information they want.
I also like how the site is set up with tabs horizontally across the top of the page in another grid like format. These link the user to other areas of the website and they are very easy to use because of how they are set up in the grid. It draws the user's eye across the page, and they are able to see clearly where they want to go next on the website.

Here, the grid formatting is also used very well in the section of the website once you type in the city which you want the specific weather. The columns and grids are definitely something that is necessary for when weather for different times of the day are shown. It makes the information much more organized and easier to read.

Yahoo Shine

As Lupton explained in the text, grids are a method of spacing that allows one to use uniform areas of space to better organization and improve understanding of a design. We may not realize it because we are just so immune to it, but websites ARE design. Someone has to sit there and load content. Someone has to make sure that users can access it and know what they are accessing too.

There is a section on Yahoo by the maps and shopping and sports called SHINE. If you ask me, it is an underrated option indeed. It is almost like a mini Cosmopolitan Magazine, complete with sections like fashion, health, horoscopes, advice, etc. Nevertheless, I would not know this if it were not strategically formatted into clear, distinct grid areas. Especially with online websites, it is crucial to foster readability so that people know how to get around the page and onto different sites/links as well. The guides that are set in place on Yahoo Shine split the page into areas that are denoted by similarity principles. Color, font, and placement help to make this website efficient to navigate. Even the chosen pictures and icons are formatted for the grid system employed; as one can see, they are uniform sizes. There appears to be three equally sized columns on Yahoo Shine which works rather well if you ask me. Not only is quite balanced in this respect, but it also allows for visuals to bring that dynamic element to the page.

SurfTheChannel

"While single-column grids work well for simple documents, multi-column grids provide flexible formats for publications that have a complex hierarchy or that integrate text and illustrations. The more columns you create, the more flexible your grid becomes. You can use the grid to articulate the hierarchy of the publication by creating zones for the different kinds of content. A text or image can occupy a single column or it can span several. Not all the space has to be filled." (142)

SurfTheChannel follows the same balance described in the Lupton text. The different kinds of content are placed in different sections, each occupying a different number of columns. The tabs at the top, which guide you through most of the site, occupy several small columns each. Then there's the search feature, which basically takes the entire span of all columns on the grid, but is seen as only one column. The same goes for the information bar below it. The internal links and the sole image (which is also a link) take up what appears to us to be three columns, all the same size (but larger than those used for the tabs). The external links take up what looks like five columns (larger in size than the internal links and the tabs), and are placed next to an ad because it fits and is close enough in size that can almost appear to be one of the external links.

By dividing the page into sections by content, the site becomes somewhat more balanced and allows the reader to find what he/she wants more easily. This is further aided by the grid used, which, while organized, is still flexible enough. The tiny white spaces between sections allows for less clutter, although I feel it could use more space than it does.

MySlice

Almost every day, Syracuse University students log onto myslice.syr.edu. Whether we are checking our GPAs, scheduling classes, viewing schedules, this website is very important to our community. MySlice uses a grid to organize it and aid viewers in finding things. Not only is each section of the grid labeled (Orange Alert System, MySlice Applications, Personal Services, Student Services, University Information) but there is a hierarchy to the titles and sections of the grid. I think that the combination of the type's hierarchy and the organization aids the viewer in understanding and navigating throughout the website. Each grid is also surrounded by a border to help separate section from section. This also helps aid the viewer. I think the simple colors create a soothing view for the user as well. Because the website is for information and not decoration or fun I believe the simplicity of the grid and colors is helpful and a positive attribute to the website. This website does an excellent job of demonstrating the functionality and how helpful a grid can be in print or online organization.

Grid on YouTube

Since Prof. Hedges directed us to YouTube in his starter post, I figured I would just use it as my online example.  Looking at the homepage it looks like the site uses a ten or twelve blocked grid system.  The purpose of which so that they can fit multiple small thumbnails of their videos on the page and allow room for title, description, and user information.  This grid also allows advertisements to fit on the right side of the page and be especially prominent. In terms of staying within the boundaries the designers are pretty conservative.  Most of their images are in square boundaries that fit into the grid and the text appears controlled by an invisible barrier.  The grid aides the user in my example by organizing the video files into columns and the descriptive text into rows.  This gives the reader an instant preview of the videos being displayed. I feel like the grid doesn't really engage the user with its structure.  I personally think YouTube needs to revamp its site to give it a more professional and visually appealing look. With pictures located primarily on the outside of the page and text concentrated heavily in the middle, I feel like the site gives off negative tension.

The New Facebook

There have been many complaints on the "New" facebook but for all the complainers they should realize this new format is using the grid system. Even though it is a change and many people do not like change the new facebook is more appealing and easier to receive information. Each section is organized and I feel that the vertical layout of the information is clearer and consistent. Applications, newsfeed, and networks are on the far left. While wall posts and status dates are the center focus. Placing this information in the center may seem like an invasion of priority but one must admit these items are probably the most popular read information. We all want to know who is doing what and what everyone is saying to each other. Events and Photo albums are now located on the right but because the column is placed closely to the center, these items also take importance but are more organized and varied unlike the older facebook layout. 

Our discussion of grids confused me at first but this concept makes sense once you apply it to the real world and take time at looking around your surroundings. Every type of information is ordered and you are drawn to lines and directions. I personally like the new facebook especially learning about the importance of grids.

Lupton III: Grid (Starter Post)

In the last section of the Lupton's "Thinking With Type" she describes grids and their importance to all forms of graphic design, whether they be print or web based.

"For graphic designers, grids are carefully honed intellectual devices, infused with ideology and ambition, and they are the inescapable mesh that filters at some level of resolution, nearly every system of writing and reproduction." (113)

Grids certainly do guide design, whether it is in the making or breaking of the grid. Magazines and newspapers thrive on a grid system in order to create consistent environments that are functional and reproducible. Some have challenged this layout. We'll at a few slides from David Carson in a few weeks (click name to watch a video) and his design for "Raygun" magazine from the 1990's and you'll see how he broke the grid. But even in breaking the grid a system of order is created, that although not traditional in a linear sense, still can feel very natural and organized.

Lupton goes on to discuss the power of grids in magazine and print design and the evolution of the grid in web design through tables and Cascading Style Sheets and the more free form environment afforded by the use of Flash. Which leads us to your objective, should you choose to accept it...

Find an example of a grid system being used in print or on the web. You can select from magazines, web sites or newspapers. Discuss the grid system in place. How well do the designs work within the boundaries, or even by breaking boundaries of the grid? Our minds are trained to see and be comfortable with order. We organize the second we look at anything because of those Gestalt principles and our craving for the whole. How does the grid in your example aid the reader or user? Does it engage them with its structure or lack thereof? Does it cause tension, either positive or negative?

Attach screen shots, links or images in order to help illustrate your example.

Screen capture on a MAC:
Apple Key + Shift + 3

Screen capture on a PC:
Hit the "Print Screen" button (usually found on the top right of the keyboard).

Kelsey McCarthy Logo

Visual Message: My logo and stationary system is something I hope to use for the clothing company I recently began. All of the shirts that I design promote different social causes and overall just promote the idea of getting involved and engaged in society. I wanted my logo to be simple and light with an airy and youthful tone to it. Many of the shirts I design promote environmental causes and overall every decision we make as a company we keep the impact on the environment in mind. For this reason green is the only color used and the leaf is the major element of the logo. I want people to immediately connect our company with the idea of environmentally conscious and responsible. I also used the recycle symbol on both the back of my business card as well as the stationary because it says a lot about the priorities of the company. Also, I drew it by hand so it would have a sort of youthful hand drawn quality. 

Audience: The design is designed for my target market which is about 16-26 year old people who are interested in social issues and causes. Some of the shirts are clearly for women but most are designed to be unisex. 

Design Strategy: I think my design immediately communicated the fact that we are a green and environmentally aware company. Not only because the font is green but because of the use of the recycle symbol as well as the use of the earthy leaf. I also think that the shape of the leaf and the way it appears to be almost blowing highlights our laid-back nature and youthful tone. As a company we embrace movement and expect change just as a leaf does. Also we begin in one place but expect to move around to an entirely different one similar to the way a leaf blows in the wind. I stuck to simple and light fonts using only helvetica neue. I didn't want a distracting font I just wanted a clean and basic one. The shirts we design have very little text and rely mostly on pictures and designs to get the major messages across, so I wanted my logo and stationary set to be similar in the sense of not relying on the choice of font to be overbearing. On my stationary I overlapped the word "beleave" and the logo of the leaf. I just felt that it looked too rigid and boring to have them on separate ends of the page. I think that it appears better and also links the company name directly to the image of the leaf, which will hopefully further diffuse into peoples minds. Also on the envelope the veins do not appear on the small leaf, because since it was smaller I thought it looked cleaner to just have the outline of the leaf. 

Dwiveck's Logo

Dwiveck Marie Custodio

Project: Logo System

03/05/08

 

Visual Message:

I designed a personal logo that has much more to do with who I am than with what I do because I’m still not sure what I want to do. Therefore, the design of my logo should express that I am a writer, but it should also highlight a little of my personality. It should represent energy, happiness, warmth and simplicity.

 

Audience:

For now, my audience is that of my friends, family, acquaintances, Syracuse University people and prospective employers.

 

Design Strategy:

I used mostly geometric shapes (triangles, circles, and lines) to create my sun in order to make the design relatively clean and simple. The sun is holding a pen to represent my love for writing. The sun itself should portray warmth, cheerfulness, happiness, and energy. Since “Dwiveck” is a rare name, anyone who knows me instantly thinks of me when they see the name Dwiveck. Because it is an integral part of my identity, I made it bigger and separated it from the rest of my names. My middle name and my two last names are more italicized for contrast.

 

Style Sheet:

Stationery

• Dwiveck—Kepler Std Regular, 55/66

• MarieCustodioLopez Lucida Handwriting Italian, 21/25.2

• Contact information—Kepler Std Regular, 9.5/11.4

Business Card

            • Dwiveck—Kepler Std Regular, 23/27.6

            • MarieCustodioLopez—Lucida Handwriting Italian, 14/16.8

            • Contact information—Kepler Std Regular, 8/9.6

Envelope

            • Name— Lucida Handwriting Italian, 11.5/13.8

            • Contact information—Kepler Std Regular, 8.5/10.2

 

Sources and influences:

Pen: http://blog.miragestudio7.com/wp-content/uploads/2007/07/parker_pen_architect_signature.jpg

Sun: http://peelbooks.com/123_draw_series/73-images/07_04.gif

 

Extras:

            The yellow represents warmth, and both the yellow and the bright pink represent happiness and energy. Also, I changed the colors for the “w,” “r,” “i,” “t,” and “e” in my name so it would spell out the word “write.”

Logo System

Visual Message

With my logo and stationery system, I want to convey a clean, professional tone without coming off as uptight. I intend the honeycomb to represent my personality as naturally sweet and wholesome. It should also communicate some aspects of my field, public relations. The honeycomb portrays the infrastructure of networks that are built through PR. It also conveys the interconnectedness that is essential to PR and the teamwork needed to create a successful product.

Audience

My logo is intended to be versatile for use in everyday letter writing as well as professional correspondence. The honeycomb reflects my personality for use as personal stationery with friends and family, and it also alludes to PR for use with business associates.

Design Strategy

The visual of my logo initially has a literal translation – sweet and earthy. I designed it in 3D to make it come off the page, but I also softened the look by rounding the corners of the geometric shapes because it started to have a scientific vibe. I pulled one of the honeycomb cells to the side to show that each hexagon is a component of a larger network, which is an important aspect of PR. The shapes fit together like puzzle pieces to form relationships that work together to build a beneficial product. The border reinforces this concept with a hexagon print and serves as an accent to my stationery. I chose ITC Avant Garde Gothic Std as my font for it’s clean and modern look. It also has a slight roundness that matches the geometry of the honeycomb. I made my last name bold to make it stand out as well. Paired with my logo, ITC Avant Garde Gothic Std conveys a professional, yet fresh and youthful feel.

Sources and Influences

I was inspired by one of the early logo ideas for GATHER, a project designed for data capture and reporting. I found it on the company’s blog along with a couple of other mockups.
http://gatherdata.files.wordpress.com/2008/04/honeycomb.jpg

Extras

I chose to use the obvious color for honeycomb, not only to make the icon recognizable, but also to represent who I am. The gold color is eye-catching and conveys my sunny personality. It also tells where I come from – “The Golden State” of California. The rich brown serves as an accent and creates depth. I used turquoise for my text because it's a fun contrast to the orangey gold of my logo and it really makes it pop.

Elena's logo

visual message

I wanted my logo to be simple, but clearly convey a distinct idea. I chose to make it look like an Italian gondolier in Venice. With this idea, I wanted to convey a sense of freedom, relaxation, and the culture of Italy. I want my identity system to convey a sense of fun as well. Venice is somewhere that people go to enjoy themselves on vacation and immerse themselves in the culture of a beautiful country. My logo captures this feeling in an uncomplicated way.

audience

Since I did not create my logo and identity system to be used in the business world, the audience is friends, family, and acquaintances to whom I would send letters and mail.

design strategy

The first impression my design makes is a sense of enjoyment and fun. Some who look at my logo may not get the reference to Venice and gondolas at first glance, but I feel that it is a recognizable image that most will pick up on. Venice has a certain image in people’s minds, and I wanted to capture that in my logo and design. I chose to incorporate Venice and Italy in my logo because it represents my heritage; my family is all from Italy. I have also traveled to Italy in Venice and fell in love with the country; I even plan to study abroad there. I feel like my logo represents me and my interests well. The fonts I chose are simple and complement my logo without competing. I called out my name by using color and boldness throughout all three pieces. In my design, I have my logo plus another impression of a gondola. I chose to add the second image to reinforce the idea of Venice and add interest to the business card and envelope.

sources and influences

My influence for my logo was not from a specific picture, but from the memories I have from traveling to Venice. I have included a few images off the internet in my folder to illustrate what I have seen.

extras

The color I used in my logo design is very important to the image I am trying to convey. The colors that gondoliers in Venice wear are red, black, and white, and almost always with stripes in some way or another. This is why I chose to make the E (from my name) black and white striped with a red scarf, to mimic how the gondoliers dress.

Denti_Logo Project

Visual Message

I have always loved my initials, AD, and have always wrote them out in many ways. Through my logo and stationary set, I wished to convey a sleek and sophisticated demonstration of my personality. Not only is music my passion, but I wish to work in the entertainment industry. Therefore, I found a music note that looked like a “D” and made that the focal point and main image of my logo. I choose to work mainly with black and white because those are the prime colors of the entertainment industry. I used red because it is bold and vibrant which is similar to my personality. Also, red is a great contrast color to black and white.

Audience

I designed this logo and stationary set mainly to send out to companies having to deal with entertainment and music. However, the music note has a lot to do with my personality so It can also be personal stationary.

Design Strategy

I want the audience to understand who I am when they look at this logo and stationary set. Therefore, I choose to work with very modern and creative designs to create a simple yet sophisticated feel. When you first look at my logo, you will initially see a music note, but in a flash see the initials “AD.” For the “A” I choose a font that was more decorative to match the music note so I choose Ariadne St. Roman. I didn’t 

really vary the designs on the three pieces, I stuck with the logo and the single music note in the shape of the “D” yet alternated the colors

Extras

I wanted to stick with a very simple and chic design so I choose to work mainly with black and white and throw in a vibrant red for contrast. Overall, I believe red, black and white to be modern and sophisticated and bring a very professional feel to the table. 

Mmmm, logo.

Visual Message:

            In my design I’m hoping to portray a sense of individualism and creativity balanced with minimalism.  Renowned artist M.C. Escher, who is a longtime idol of mine, inspired the basis of my concept.  In using this reference, I am striving to create a certain tone of similarity between famous artists and myself.  I worked to simplify the original design, erasing and adjusting what had at first been highly detailed images of hands and pens.  This way the logo can be recognized and duplicated with relative ease.

Audience:

            This logo would be sent to and intended for companies that appreciate creativity and abstract concepts.  Specifically, I would hope to attract the attention of graphic arts firms and the like.

Design Strategy:

            As with the original M.C. Escher series, my logo is something of an optical illusion as it incorporates two hands that are in essence drawing themselves.  In addition to catching the eye and sticking with the audience, I’m hoping this idea relates an ambience of progressive thinking and right-brained individuality.  The style was intended to be modern, as related by the somewhat sharp, bold lines used to create the hands, pens, and sleeves.  As far as fonts are concerned, my first and primary goal was to continue with this theme of modernism…hence the use of Avenir for both my last name and my contact details.  However, in an effort to also incorporate contrast, I chose a simple yet elegant serif font for my first two initials (Berling).  Avenir is meant to be the primary typeface while Berling provides a sort of breath of fresh air, if you will.  I didn’t really change much between the three mediums; the only alteration was on the business card where I decided to make the background a very, very pale (15% transparency) of the green in the sleeves.  I did this because the card moreso than the envelope and letterhead seemed plain and uninteresting with a regular white background.

Style Sheet:

            Stationery Name: Berling, 30/36, tracking 0; Avenir, 24/28.8, tracking 0

            Stationery Address & Email: Berling, 14/16.8, tracking -10/-30

Business Card Name: Berling, 30/36, tracking 0; Avenir, 24/28.8, tracking 0

Business Card Information: Berling, 8/9.6, tracking 30/0

Sources & Influences:

            http://www.cs.nyu.edu/courses/fall03/V22.0002-003/Escher_hands_2.jpg

Extras:

            Originally I had intended to make the sleeves black, meaning that the only color in the logo would have been the peach color of the hands.  Then I used Illustrator to find a suitable complimentary color to the flesh tone.  It ended up giving me a light blue shade, but I adjusted it to a darker green because I think green is a more accurate identifier for my personality and the message I’m trying to portray.

Logo Project

Rationale

Visual Message
In my logo and stationary set, I was trying to create a simple and fun design that uses the first letter of my name. In the logo, I wanted to make a “J” and design it so that it could represent a music note as well. However, I didn’t want to make it so it was obviously a music note, but instead something that was more creative and could be interpreted differently. Therefore, the logo adds an interesting look to the stationary system. I definitely wanted the stationary to be simple with clean lines, so that it could be very versatile. I made the background of the logo with its sharp lines to match the sharp, straight lines of the color rectangles around the stationary. The simplicity of the stationary incorporated with the more interesting logo and fun colors works together well in the way I aimed for it to.

Audience
This is designed for a variety of employers as its audience. Since I don’t know what area of communications I want to work in, I purposely designed it so that it could apply across many fields.

Design Strategy
I have been very interested in music for a long time so I thought that the “J” initial of my name could be represented as a music note. However, I didn’t want to make it so had to be thought of as a music note, but more as something more interesting and funky looking. It does look like an eighth note and a “J,” but it is not completely obvious, which was what I was going for. This logo is seen across all parts of the stationary set.

I also used the same rectangles and lines for the stationary, the envelope and the business card. This same design is carried across each piece in a slightly different way. I wanted to put the green rectangles on the sides of each to act as a border, but not a complete border that would go all the way around. I also used the same font throughout the set because it goes with my idea of a uniform, simple design. I chose this font because it can be clearly read, which is important for a stationary set. Also, it is a fun font and I thought that would work well with my funky type logo.

Style Sheet
Stationary Name: Bodoni SvtyTwo ITC TT Bold, 21/25.2, metrics kerning, tracking-0
Stationary Address and Email: Bodoni SvtyTwo ITC TT, 12/10, metrics kerning, tracking-0
Business Card Name: Bodoni SvtyTwo ITC TT Bold, 11/14, metrics kerning, tracking-0
Business Card Address and Email: Bodoni SvtyTwo ITC TT Book, 8.5/10, metrics kerning, tracking-0

Extras: Color
At first I started only using the green color throughout the stationary set, but it was too plain to represent my personality. I thought with the type of logo I was using, which was representing me and music, my stationary set should include more color to make the set more fun and appealing. I added in the pink, which works really well with the lime green I am using. I think the pink and green are fun and a little quirky together, which is very compatible with the design of my logo and my personality.

CarlyS Logo

Visual message: My visual aesthetic favors modernity and clean lines… but with a twist. This is one of the reasons I chose to work with simple, basic shapes and simple sans serif fonts for my identity system. The yin yang connotes balance, but I wanted to alter it slightly to make it my own. This is why I added the stars instead of the traditional circles, to connect back to my personal “signature.” The added black semicircle adds to the shapes to create a sort of “C” and the curves create an “S” in order to compose an abstract representation of my initials. One might look at my logo and on first glance, simply see the yin yang, but upon further analysis, one can see the letters and the globe as well.

Audience: A dream of mine has always been to run my own international advertising boutique. Therefore, my audience will be clients and other competitive services.


Design strategy: I feel that my design aptly communicates my message; all three of them. First, there is the notion of balance in the sense that I can succeed at both the creative and managerial aspects of the advertising industry. In addition, the logo resembles a sort of globe on an axis to represent the international span. Lastly my initials and signature five-point star connect back to ME and MY identity. The Century Gothic font is sans serif, has very rounded, symmetrical features, and a modern look to it. I think the typeface and logo are not only a good fit, but keep the consistency with my resume and wordmark too. My stationary was strategically designed with a traditional letter format in mind, as there is space for a greeting, body and a closing.

Style sheet: Stationary name: Century Gothic, 18/21.6, optical kerning Stationary address and email: Century Gothic, 8.5/10.2, metrics kerning, -10 tracking Stationary phone number: Century Gothic, 9/10.8, metrics kerning, -5 tracking Business card back name: Century Gothic, 18.257/21.909, optical kerning Business card contact info: Century Gothic, 10/12, metrics kerning, 0 tracking Business card front name: Century Gothic, Carly-54.588/65.505, Shatzkin-43.67/52.404, optical kerning

Extras: I chose to use only black and white for my main logo, as it is the most versatile and “cheapest” color combination. However, this also means that my logo cold potentially work in any color combination if I so choose. As a simple test, I have added colors to my logo and perhaps someday they will represent the different departments of my agency. Finance, creative services, account services, and production.