Martin Ringlein of n’clud recently wrote a post called
“Should Web Designers Know How to Code?”:

All designers must know the medium and canvas in which they design for. How can a sculptor sculpt without knowing the difference in stones? How can a painter paint without knowing the difference in brushes, paint or canvas? How can a print designer create without knowing about the printing process, types of paper stock or difference between CMYK and RGB? And how can a web designer design without knowing how to code, or at least how the code works? The important aspect to mention is that a web designer must know how to code, but doesn’t need to or have to actually code.

I started to write a comment and realized I really had a blog post…

I find myself smack in the middle of this debate all too often and I can’t agree with Martin more. I especially disagree with the argument “that designers who code will let that knowledge limit their design “. Thats a load of crap and a poor excuse. Since I have learned CSS and HTML it has allowed me to see the big picture, understanding the limitations puts me in the position to think of new ways to push the boundaries. Some important advantages of knowing HTMLand CSS as a designer (in addition to the ones that Martin has listed) are:

Being able to estimate budgets and timelines more effectively. A designer who understands how much work it will take a developer to execute their design can more effectively design within budget constraints.

Cutting corners on load time. The first time I shaved several seconds off of a site for replacing image based navigation with one that utilized system fonts felt great. The satisfaction of knowing the user was not going to have to wait a few seconds longer was a release on that anal retentive print mentality that it had to be that very specific font.

Appreciation for Bad Asses. Its one thing to be a killer designer but its another to be a bad ass. My biggest “AHA! moment” came when I experienced the site of a developer who was just as innovative in his use of javascript as he was in his use of beautiful swiss typography. There is a creativity in development that you can not understand until you learn it and it will change the way you look at the web. Don’t miss out.

Remember designers; a Photoshop document is not your canvas. A PSD file will do nothing on the internet but take a really long time to download.

Disagree? I would love to hear opposing opinions… I know they are out there.

Thursday evening a few colleagues and I visited the interactive offices of the WashingtonPost.com. With super impressive digs the folks over in their Arlington offices are doing some multidimensional work that ventures far beyond the expectations one would have for a local news paper.

When taking a look at the Top 20 Online Current Events & Global News Destinations from Nielsen//NetRatings for September 2007 you will see the Post hanging tough amongst national and global news leaders such as CNN, Yahoo! News, Google News, ABC and CBS. While the Post is not the only local new paper on the list (the NYTimes hold tight in the top 5), it is in a minority amongst large national and global news organizations.

What I find so fantastic about the WashingtonPost.com is the quality of their online media. While a percentage of their content is repackaged stories from their print edition, they have a hefty number of reporters and videographers who are exclusive to the online addition. The team’s online video coverage of Hurricane Katrina won them an Emmy for outstanding achievement in content for non-traditional delivery platforms in a category where they were match up against other major players such as MTV and National Geographic.

My background is in print design. I was a real pain in the ass when it came to accepting the ways of the web, so when the age old argument of print vs. web surfaces I really can say I understand both sides of the spectrum. There is a certain comfort and experience in holding a printed piece of paper in your hand. There is the way it feels, how it smells… the convenience of having it to roll into a tube to wack* your cat’s ass when she jumps on the kitchen counter for the umteenth time. The Washington Post is an interesting experiment in this arena, a news organization operating both in print and online very successfully. The Washington Post’s average weekday print circulation is 635,087 for 6 month circulation yet they receive 8 million unique visitors to WashingtonPost.com every month. Honestly, I am not going to figure out what the hell those numbers really mean. I don’t need quantitative data or stodgy old stats to support my perspective… I just need you to go and watch Gladys Mitchell recount “being so close” to Dr King on WashingtonPost.com….
http://specials.washingtonpost.com/onbeing

I can not see how a printed article or photograph could evoke the same emotion that prickled down my spine as I watched her hand jesters, her eyes flutter, and heard her southern accent peppered with long deep pauses. You could argue that broadcast could bring you those same feelings, but the magnificent difference is the user’s capability to look through the comments, join the conversation, and control their online experience. The user can reach out and connect with others who were just touched by the same spine-tingling feeling run down their spine… that is the beauty of digital. That is what you call interactive news, and while print will never die it will never provide the same level emotion that an online newspaper has the capability of delivering.

For more insight into the cool stuff thats going on at the WashingtonPost.com check out Apple’s awesome Pro video on them.

*When I say “wack” I mean make a loud noise… not really hurt her. I would never hurt my cat, and I do not endorsing anyone hurting theirs. If you are interested in helping some local cats please check out http://www.mcatdc.org/

I have a bit of a fetish for awesome information design and it gets nearly compulsive when it becomes a reacting entity on the world wide web. The idea that massive amounts of information, many times being ever-changing and dynamic can be molded into a visual form, manipulated, and sifted through is all sorts of awesome to me. I will admit, I am the type of person who flips through a Magazine (backwards) to look at all the pictures first before deciding what I want to read in it. Maybe its my ADD that makes bare-bones text not interesting enough to hold my attention, or perhaps its just my love of pretty pictures, but I foresee a future where information on the web is presented in more interesting interactive methods more often. With the user interacting and producing data through social media, creative interactive visualizations of the data produced brings a whole new fresh engagement to the experience.

Obviously this concept is not that revolutionary, there are many places on the web that showcase stellar interactive information design. Technology such as flash and Java have made it possible to illustrate and animate static concepts. Popular examples of these are interactive timelines, maps, and experiences.
Examples:

Explore Monticello

British History Timeline

Battle of Gettysburg

Now lets take this concept a step further. Rather than illustrating stagnant information lets visualize dynamic content. Instead of actual events or places the user can now see broader concepts such as emotions or relationships. A major attraction to social media is discovery, the process of finding that 6 degrees of separation between them and someone they met at a conference or party. Interactive information design illustrating that connection introduces the user to tangible representation of what that relationship is.
Check out some examples!

We Feel Fine

We feel fine was built by Jonathan Harris and Sepandar Kamvar as an experiment. The system…

searches the world’s newly posted blog entries for occurrences of the phrases “I feel” and “I am feeling”. When it finds such a phrase, it records the full sentence, up to the period, and identifies the “feeling” expressed in that sentence (e.g. sad, happy, depressed, etc.). …

The interface to this data is a self-organizing particle system, where each particle represents a single feeling posted by a single individual. The particles’ properties – color, size, shape, opacity – indicate the nature of the feeling inside, and any particle can be clicked to reveal the full sentence or photograph it contains. The particles careen wildly around the screen until asked to self-organize along any number of axes, expressing various pictures of human emotion.

Digg Arc

Arc was developed as a collaboration between Digg and Stamen Design (who are Bad-ASS) to display stories, topics, and containers wrapped around a sphere. Arcs trail users as they digg stories across topics. Stories with more diggs make thicker arcs.

Twitter Blocks

According to this site Twitter blocks was designed

to allow users to navigate Twitter neighborhoods (or “blocks”) in an abstract way. A public timeline is represented by an orange sequence of blocks, which offsprings a set of block series that depict the statuses of users & the people they follow. The visualization is designed to allow existing twitter users to discover other existing twitter users.

While many of these applications serve as entertaining ways to wade through tons of information there is rarely a deeper motivation or end goal than to just find more interesting information. I am hoping to see this type of interactive information design utilized to not only enhance the enjoyment of surfing through social media but elevate the effectiveness of the experience.

A great example of a site that is using visualization to enhance their search function is

etsy.com

Not only does this method help shoppers but it helps buyers to connect with others in the network who are interested in their products. Etsy is a marketplace for “all things handmade” where you can find a seller who creates products with a specific style, and then see their connections to locate other products. These visual functions help the user manage a concept that is vague to verbalize and subjective… “style”. You can also search through a geo-locator and sort by color. These search methods contribute to the experience of shopping, making Etsy as much a social network as a marketplace. In some circumstances I even feel addicted to using these visualizers, like a video game… gradually becoming more effective at navigating through the merchandise to be rewarded with the perfect product.

Social media can be visually interesting and innovative. If designed with the user’s end-goal in mind creative ways of surfacing content can enhance the overall experience of the web.

[tags]interactive information design, twitter blocks, digg labs, digg arc, etsy, wefeelfine.org, interactive social media, user experience , Web 2.0 Design, Web 2.0, visual thesaurus, Stamen Design[/tags]