snap2objects

snap2objects header image 2

How To Destroy The Web 2.0 Look

November 20th, 2007 by mao

header.jpg

A trend always appears as the result of the opposition with another. The once full of detail Gothic art was replaced with pure straight lines from the Greek temples in the Renaissance. The tons of hair spray, glitter and multicolor spandex 80’s were demolished by the black & white minimalism from the 90’s.

The web is not the exception. In the beginning, there was not light on the web. It was awfully crowded with dancing marquees, tedious frames, unbearable midis and annoying spinning @’s. It was the dark ages of the web. Then refreshing empty spaces, vibrant, high contrast colors, lovely gradients, big text, original gloss shine effect, diagonal lines and of course reflected logos came on our rescue. Everything was shiny and with that great brandnu smell. The Web 2.0 look was born.

But guess what?

There are some people getting tired of that. Call them revolutionaries, or trend setters. I call them visionaries. Elliot Jay Stocks is my new hero. He took part on Future of Web Design event, held in NY, with a talk called “Destroy The Web 2.0 Look“.

In his talk, he demonstrates how the current web style is overdone and making sites look like Dollies (cloned sheep). Mr Stocks also noted that what makes a site part of the web 2.0 is not its looks, is the way it works. He shows how the “Web 2.0″ is not about aesthetics, it just has been misunderstood by the web design recruitment industry and marketers, among others; thinking that look will translate into success. As a conclusion, the designer invites us to educate people on what the web 2.0 really means, and to learn from the best and try to adapt the trends to our own designs.

I agree with Elliot Jay when he recommends us to adapt trends and to try and educate our clients in the matter. Also, we must agree that despite the obvious cliché repetition, there are some characteristics worth being preserved even on the trendiest designs: nice big text, loads of white space and centered alignment, for example.

Now, if the web 2.0 look is already dated and we have been told to destroy it, the remaing question is:

How To Destroy The Web 2.0 Look?

First lets retake what makes the looks of the web 2.0

  • Vibrant, high contrast colors
  • “Special offer” badges
  • Gloss/ Sheen
  • Bevelled edges
  • Gradients
  • Diagonal Lines
  • Shinny Table Reflection Effect

Now you may agree with me that the result of that is an attractive, clean and neat design, but some times almost aseptic and due to its popularization lack of personality.

First I recommend you to read an excellent post Why should your site have “personality” made by Robert, a guest blogger. Robert describes how to be honest in design and the importance of uniqueness and how it should reflect the business true personality.

Then I am going to show and describe the common characteristics of some sites I believe are the answer to the cloned-aseptic current web style.

http://www.biola.edu/undergrad/

http://www.bandpush.ca/

http://www.bittbox.com/

http://www.cameronmoll.com/portfolio/

http://darklightart.com/

http://elliotjaystocks.com/

http://eyecandyanimation.com/

http://fisticuffdesign.com/

http://www.jrvelasco.com/

http://www.kcrevolution.org/

http://www.knoxville.org/

http://student.opendoorsuk.org/

http://student.opendoorsuk.org/

http://trojanrecords.com/

http://www.dirtyprettythingsband.com/

As you could see, those sites are the opposite to the current style. Despite this, it is an answer to the current trend you can still see some elements that survived, like the big text and the main layout.

However, in the unique and trendy design of each of them we can put the finger on common elements like the retro/vintage look and influence of grunge organic elements and rich textures.

Let’s identify those elements in detail:

  • Retro-Vintage
  • Warm Dark Color Palette
  • Rich and Organic Textures
  • Grunge-Retro Fonts
  • Rough Edges
  • Ornaments
  • Stains
  • Rich Full Layered Headers

Retro-Vintage



The allusion to retro is a commonplace giving a cozy yet evoking feeling. Here we can see an old Polaroid photo (a very nice retro resource). And also notice the old radios in both of the samples as well a representation of vintage printings.

Warm Dark Color Palette

The use of dark colors, like dark brown, burgundy and mustard in lots of variations and shades in association with that retro look. Contrasting with the brilliant, high contrasting colors of the current trend.

Rich Textures

Sometimes organic, simulating wood, stone, stained walls or vintages wallpapers.

Grunge-Retro Fonts




Say goodbye to the typical rounded-corners bold fonts we use today. Say hi to old school looking fonts and grunge typefaces full of rough edges and detail.

Rough Edges


This is another grunge feature. It is the uneven finishing effect on boxes, frames or heading. Achieved by effects like ripped paper of paint splats.

Ornaments


Ornaments have been doing their shy appearance on many current web 2.0 designs nowadays. But even more so in the retro designs. I particularly like the clean look of the 2.0 look with some ornaments like floral partterns.

Stains



This is again a grunge feature, but also vintage. Adding stains like paint splatters gives the ilussion of something worn by the passage of time. Something that has been used and abused resulting on a sense of familiarity.

Rich Full Layered Headers


This headers are designs masterpieces, not big solid areas anymore. Many layers and objects telling a story, speaking with voice about its author or the product sold.

The current web style is going to last for quite more time. But we can’t deny that there are some trend setters that are in the quest for their own identify, trying to avoid cliches. Of course if this trend happens to replace the ongoing one with time, it will turn to be a cliche as well and then another trend will come. I think the secret is to be an early adopter and adapt each one to our needs and design angles.

Bookmark and Share

Popularity: 30% [?]

Follow me on Twitter | Subscribe by RSS feed or by Email

Related posts:

  1. Elliot Jay Stocks, The guy who told us to “Destroy the web 2.0 look”
  2. 10 Free Web 2.0 Fonts
  3. 10 Best and Worst Looking Sites From The Web
  4. Tons Of Hi Quality and Affordable Web Templates
  5. Inspiration from 20 alternative and interactive web designs

Tags: 159 Comments

Leave a Comment

159 responses so far ↓