Lupton III: Grid

An example of a grid system used on the web is CNN's new website. If you would like to get a better look at how they implement a grid system visit http://www.cnn.com

After reading Lupton's section on grids the system that CNN appears to be using is a multi-column grid. A multi-column grid has a complex hierarchy that integrates text and illustrations. CNN also creates zones for different kinds of content. A modular grid appears to be in place as well. There are consistent horizontal divisions from top to bottom and vertical divisions from left to right.

For the most part their website is effective as it is easy to navigate and engages the reader. I visit CNN's website every day and have to say that I like the new design better. The website prior had one large photo with the most important story to the left of the page. The rest of the information just seemed to fall to the wayside. Now CNN offers more stories at the top of the page by implementing three sections of breaking or important news. There is still a system of hierarchy as less pressing information is found the closer you get toward the bottom of the page.

A horizontal bar labeled "Editor's choice" engages the reader by encouraging you to read through the "top pics" or watch videos. Below the editor's choices are 12 boxes that use a modular grid system. Pretty basic without any pictures. Hierarchy is implemented by breaking up the information by topic and links are given for each story.

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

Lupton Text

"The dominant subject of our age has become neither reader nor writer but user, a figure conceived as a bundle of needs and impairments—cognitive, physical, emotional."(73)

I thought the N.E.R.D. website communicated their message well and enhanced user interaction through the use of design, text and layout.

NERD Homepage (http://www.n-e-r-d.com/?content=home)
 N.E.R.D is a hip hop, funk and rock band started by Pharrell Williams. The band is all about being youthful, energetic, and creative. Users can feel those vibes when visiting this website from the video game-like graphics. The pixelated text at the top gives off a retro feeling. Upon entering the site, users are met by a video game animation of a gorilla chasing the NERD band members. This is engaging and it draws people in as if they are the ones playing the game, which may bring back old memories for some.  It definitely enhances the user experience and communicates the band's energy well.

The site is user friendly as it is easy to navigate. The bright colors and different backgrounds all give off the essence of the band and their music.

"The impatience of the digital reader arises from culture, not from the essential character of display technologies."

Media culture today is dominated by visual sensations. People are drawn to interesting photos, color combination, and layout. And then, secondly, they are drawn to the actual message. Media culture today is very superficial. Media must have a good outer appearance if they want people to pay attention to the 'inside' (message).

An example of a website that does this is CW TV.  A  TV station of course would have a website dominated by visuals and interactive media, rather than words.

Users today are so impatient and would much rather look at pictures than read. It's easier and users pick up the message faster. Thus graphics and photos occupy the majority of the space on websites such as these.

-christine o

Our way in: The Huffington Post

In this new day and age of online news, I've inadvertently categorized news websites based on how good their design is and whether the layouts attract me the minute I lay my eyes on the sites. One of the news site that I am currently enamored with is The Huffington Post. It's only an online newspaper, so I understand why they must put more emphasis on their layouts. With no paper readership, The Huffington Post must garner all of their audience through the site, and fortunately, they execute it with great results.

One great thing that I love about The Huffington Post is the fact that the site utilizes typography very well. Everything is blown up and big, meant to draw the readers' attention right when they press enter from their computers. The layout of the site is fairly understandable, a couple of clicks and you're on your way to reading about David Letterman's Late Night Confession (a must read, in my opinion) or you can easily skim over how Michelle Obama and Oprah are trying to draw some hurrah for Chicago in the coveted location for the 2016 Olympics. I do admit, the typography and fonts can be "in-your-face" at times, but what's news without a little bit of pushiness? It's meant to snap us out of our stupor and pay attention to what's going on in the real world.

One can argue that The Huffington Post is not "serious" enough for the average reader. The site is famous for its plethora of famous online columnists (Jamie Lee Curtis anyone?), but in the site's defense, if one is really looking for an extremely standard online news...nytimes.com, cnn.com and latimes.com are only clicks away.

On a personal note, my impatience for technology has often put me at a halt with online websites. Takes too long to load, the texts aren't readable...I find many excuses to turn my eyes away from the news and to my favorite gossip websites. Nevertheless, The Huffington Post swiftly combines the accessbility of an online newspaper while reaching out to younger readers (from 18-35, as opposed to 40-65). It's obvious that the editors have spent a lot of time with the "techies" to ensure that the website is easily used for the general public, while attaining a certain individuality in its online newspaper site.

Lastly, the recent addition of the iPhone app "Huff Post" has pushed this online newspaper from my news thermometer of "frequently read" to "reading everyday." Even the iPhone app is easy to use and contains the same themes that the website carries throughout, page by page. This certainly keeps the old users up-to-date on their iPhones while simultaneously through the original website itself.

I give The Huffington Post 4 (1/2) stars.

Lupton: Text

Having read the second chapter of Lupton's book, 'Thinking of Type', I find myself learning so much more about text than I ever have although I've been writing/typing practically my whole life! Like typography, I took text for granted and never once gave thought about spacing, letter kerning and punctuation. While I have always thought that that was how text worked, Lupton states in her book that, 'Typography made text into a thing, a material object with known dimensions and fixed locations.'

Throughout the chapter, there were two particular things that I paid more attention to. Firstly, I found myself agreeing to Lupton when she wrote that one of design's most humane function is to help readers avoid reading. Most of us are accustomed to organizing our written/typed work like putting an indent to create a new paragraph or capitalizing and bolding the section headers. Like many books, I used to think that the purpose of doing so was to enhance the readability of the written word but now I agree completely with Lupton - these text functions actually help us navigate our way around the body of the text to pick up the content we want to read.

The next thing that greatly interested me was when Lupton proposed the question, 'Why, for example, are readers on the Web less patient than readers of the print?' This question leads me to the idea that people read more printed material than they do on the Web. If this is the case, then I have to disagree with Lupton. I find myself reading more on the Web than reading printed material. I feel that while it is more convenient to have printed materials in my hands, reading online material keeps me focused. I find that online materials are more interesting because online sites usually have more pictures or hyperlinks that will direct me to other interesting sites. Although going online puts people in a 'search mode', I feel that people do not necessarily disregard their 'processing mode'. After all, what is the point of finding something if one does not process the meaning of it?

Overall, not only did I enjoy reading the chapter and the thoughts that arose from reading it, but I loved the examples she gave particularly about the alignment of text because that gives me more ideas about how to align my text according to the purpose I am trying to achieve. This time, my text will be aligned as justified to give my blog post a clean structured look, and you can tell me if it works or not!

LUPTON II: TEXT (Starter Post)

Reading the second section of Ellen Lupton's book "Thinking With Type," hopefully the section about "Birth of the User" (Pg. 73-76) http://www.elupton.com/index.php?id=38 caught your eye, as it is very relevant to what is going on today with the emergence of the Internet.

"The dominant subject of our age has become neither reader nor writer but user, a figure conceived as a bundle of needs and impairments—cognitive, physical, emotional. Like a patient or child, the user is a figure to be protected and cared for but also scrutinized and controlled, submitted to research and testing." (73)

Objective: Pick out one website where the user interaction is crucial in the communication of the message that the website and/or organization is trying to convey. Keeping in mind everything we've talked about in lectures, classes, and information found in the Lupton book, how does the current design enhance the user experience and why? Or how does the current design provide "creative interference" and ruins the user experience?

Bonus:
"The impatience of the digital reader arises from culture, not from the essential character of display technologies."

In your opinion, describe our media culture today and how it affects the way we will have to display content now and in the future?

Note: You probably will want to take a screen capture or add a link to your selected website.

Screen capture on a MAC:
Apple Key(Command) + Shift + 3
Screen capture on a PC:
Hit the "Print Screen" button (usually found on the top right of the keyboard). Then paste into your favorite image editing program (photshop, paint, etc.) and save the file as a jpeg.

Reflection on Lupton's Thinking With Type

I never realized that typography had a history or a creative process to it. I always thought of it as just different presets of fonts on a computer. Lupton helps explain why typography is so important in conveying a message. This is relevant to us because we are surrounded by type everywhere we go.

For example, cursive writing denotes sentimental thoughts or sophistication.
Serif fonts gives off a sense of professionalism, sans serif sometimes gives a 'youthful' look (and is also easier to read on the web), bold fonts show power, all Caps is alerting, and so on.

I thought the information on producing new fonts was really interesting. The details between two different fonts can be so minute that an untrained eye probably cannot readily notice the difference. Yet, the differences do have an impact. I like how the book describes fonts as if they have a personality. "Gotham expresses a no-nonsense, utilitarian attitude that persists today alongside the aesthetics of grunge, neo-futurism, pop-culture parodies, and straight historical revivals that are all part of contemporary typography." (30)

Thus, typography can give off the essence of the message you are trying to get across without having to spell everything out. It's interesting how typography can say so much.

My friend who recently graduated from Parsons just posted this video on his blog (nice timing). It's on typography and how it's so important to choose the right font, colors and spacing so that they can appeal to our 5 senses. On the flip side, it also shows how our 5 senses can inspire creativity in producing new typography. This video and the Lupton book show us that type is something that we can experience.

Typophile Film Festival 5 Opening Titles from Brent Barson on Vimeo.

posted by

A picture...oh, uh, strike that, a LETTER is worth a thousand words!

Whoever first said that writing is a form of expression should have added a little note to give credit to typography too.  Sure, when reading a sentence, paragraph, advertisement, or story, you can use your voice to inflect emotion and character, but when you are only given a visual, designers rely on typography to get the point across.  The size, shape, and font of the text matter.  The color, the flourishes, and the placement of the text have a difinitive impact on the way that text is interpreted.  In advertisements and logos, text is crucial to the product and the company.  In class, we looked at the Hummer® logo, and tested out different fonts o

n the word, but none seemed to fit besides the bold, Sans Serif text that we all recognized as the real thing.  The letters are bold, bulky, and in all capitals, creating an overpowering sense, such as many feel on the road with one of the big, tank inspired cars.

If we looked at a poster for any one of the 

infamous "Saw"

films, even without any visuals besides the text, we would instantly recognize it as a horror film because of the spooky text.  Text is one way that we use to draw associations with brands, movies, places, or emotions.  Other examples include Verizon, which features an added descender to the "z", and Walt Disney,which, without the distinctive lettering, would not be as recognizable.  Both brands are instantly recognizable by the text, which proves that a picture, or in this case, a font, is worth a thousand words.   Lupton stresses that everything–stems, bowls, ascenders, descenders, and everything else that makes letters in different

fonts look like they do–are important.  Whether the reason be because the letters were created for digital display, like Matthew Carter's Verdana type, or Times Roman, originally created for use in a London newspaper, each font and the individual letters involved are important to the way the message is both read and conveyed.  

Reaction to Lupton's "Thinking WIth Type"

I never really thought too much about typeface until reading Ellen Lupton's "Thinking With Type." The world of type, for me anyway, is pretty much limited to Times New Roman. However, after reading Lupton it has become clear that typeface does much more than just create words or a logotype on a piece of paper. We are bombarded on a daily basis by typeface. Often times, unbeknownst to us, we form connections and emotional value to them.

For instance the Coca-Cola logo is known all over the world. It has changed over time sometimes even depending on the holiday. The one thing that has remained since 1886 is the logotype. The typeface that Coca-Cola uses is known as Spencerian script. It was developed in the mid 19th century based on a form of formal writing that was popular in the United States at the time (see www.logoblog.org for more information). I think I can safely say that if any of us saw any other word put in the Spencerian script, we would automatically think of Coca-Cola.

I suppose that it is quite easy to take typography for granted. After reading Lupton I think it will be really hard to ignore the impact it really has. The first part of the book Letter, offers the historical background of typefaces. I found it interesting they originated from calligraphy and how it serves as a functional basis for design.

Lupton and the importance of typeface

After reading Lupton and after talking about typeface in class, it's hard to believe that I never really took notice of different fonts, word arrangements, etc. All my life I've been exposed to typeface in numerous ways (ads, different websites, books, etc.) But only now have my eyes been open to the importance of typeface.
The font, the spacing, the arrangement-it's all important to how the message is conveyed. Never before have a realized this so clearly. In the past I have been ignorant to the fact that typeface is so important. I never looked at an advertisement or a company's logo and thought, "That's nice, but the typeface looks off." Now, I'll look at a logo or poster and think if the typeface conveys the right message.
What really opened my eyes to this was the example of Hummer. If the Hummer logo was any different, a thinner font or more spaced out, it wouldn't fit the product Hummer sells (which are over sized, gas-guzzling SUVs).
As we have said, typeface is used in different ways to convey the type of a certain product. this is ertainly evident in movie titles. The way in which a title of a movie is written often hels to predict what type of movie it will be. Look at the poster below for "30 Days of Night." This movie was classified as a horror movie. On the poster, you can see that the title is written in blood read and in a font that looks as though it were speared on, which gives it an eerie tone.


In contrast to this, look at the poster above for "Dude, Where's My Car?". In this poster, the lettering is big and bubbly, which gives it a fun effect. This is much more fitting for a comedy, which "Dude, Where's My Car?" is.

characters & calligraphy

Fonts that I used on my macbook used to seem like mundane characters that I utilized to get my points across - black scribbles on a white piece of paper - nothing special. But after the reading and class lectures, my font world has opened and I now view calligraphy and typefaces as not merely characters, but accessories to the world that surround me.

The beauty that I find in typefaces and characters is the story that it tells. Never before have I ever analyzed a logo without putting in so much thought and effort. San serifs and serifs have made me more observant, but most importantly, present in the current social media limbo that we are all actively taking part in. Never did I imagine that there could be "good" and "bad" typefaces, and like many minute details in the world, I have often overlooked the construction and history that goes behind these characters and fonts.

I do agree with the other students that the first 20 or so pages in the reading were not as interesting that I imagined or hoped it to be. But what is so fascinating about this subject is the fact that we can finally apply something we're learning right here and right now into the real world that so desperately awaits us. The transformation of fonts and typefaces has transcended just beyond logos and brands, but it has slowly sneaked into our daily lives, bombarding us.

One of my favorite logos is by a shoe company based out of Los Angeles that aims to provide shoes for children in Argentina. Its logo TOMS speaks of the simplicity beyond this concept. The company's One for One campaign gives buyers the reality of giving one pair of shoes to a child in need for every pair that they purchase themselves. The idea is simple and direct, and the logo conveys the idea.

As Told By Lupton, Interpreted by Lilian

I've always thought that typeface was limited to what was found in the font toolbar of Microsoft Word. Needless to say, I've always been a Windows user (though I am slowly switching to a Mac...), and I've always encountered moments of frustration when Microsoft Word doesn't provide the typeface I want.

Now, after reading the first chapter of Lupton's book, I realize that while I may not have used the ideal typeface all these years, what I did not realize is how much I've underestimated typography. Who knew that there would be this many different types of typefaces? And, who knew that just like human beings, typeface would have anatomy?

Just like music and other various aspects of life, the modern typeface that we have now did not just magically appear. Through different eras, different typefaces were formed. As Lupton wrote, the first typefaces were modeled on the forms of calligraphy. Despite all the new and hip typeface that has been created, my personal favorites have always been those that resembled calligraphy/handwriting just because such typeface has a more personal feel to it.

Though said typeface may appeal to me, they might not work in some situations. That's when typeface becomes more than just a font you use to type in a computer and becomes an important part of everyday life. Here's an example of a typeface that I found interesting:

image source: http://creativereview.co.uk

Most of us know Kate Moss as an international supermodel but it wasn't until she created a line for British's high street brand TOPSHOP that she became a brand herself. This woodmark is actually for her line for TOPSHOP; it has since then became her new identity formed by Peter Saville who collaborated with typographer Paul Barnes. In the article, Saville mentioned that for the brand, he needed something that was popular, boho and long-lasting. He consulted Barnes who then suggested Brodovitch Albro, a typeface by Alexey Brodovitch.

Personally, I feel that the typeface for this woodmark did not strike as particularly popular and boho, but it did seem different compared to the other brands I've seen. I would've like to see a more striking typeface but I guess my personal opinion probably doesn't matter since the line Kate Moss for TOPSHOP has been selling incredibly well in many countries, my own included!

LUPTON: Letter (Starter Post)

Type bombards your everyday life. Every waking moment you are surrounded by messages expressed in typographic form, whether it is the box of your favorite morning cereal to your school textbooks. Designers take a lot of time and consideration to select the most appropriate typeface to convey that message to you.

In the first section of your reading entitled "Letter" from Ellen Lupton's Thinking with Type, she discusses how typography derived from handwriting and evolved over the years.

Through the evolution of type during the Renaissance, Baroque, and the Enlightenment periods up to present day, the preservation of type heritage became very important in the classification and identification of typefaces.

As a graphic designer, it is through these classifications (humanist, transitional, modern, etc.) that you will be able to express certain moods and emotions by selecting an appropriate typeface(s) to accomplish the message you are trying to send to your audience.

From page 30 of Thinking with Type:

There is no playbook that assigns a fixed meaning or function to every typeface; each designer must confront the library of possibilities in light of a project's unique circumstances.

Now take time to explore the use of type in your everyday life. Find, post, and discuss examples of type in design used appropriately, or even inappropriately, and the message the designer is trying to send to his/her audience. Keep in mind the discussions we've had in class including the lectures on gestalt and typography.