P'unk Avenue Window

Archive for ‘Design’

Of Our Time

March 2nd, 2009 by Geoff 1 Comment

I am very thankful that colonial era architecture exists in Philadelphia. The materials, the scale of the rooms, and the original lack of indoor plumbing tell a story. These buildings embody an historical spirit that you can feel when you visit them.

However, I really dislike it when people build facsimile colonial homes today. They lack heart. They tell no story.

Authentic art, design and culture should reflect the time it was created. It should reflect our time. Our situation. Our realities. It should tell the human story of now.

That is why I love the dance company Chunky Move. The video above is of their Mortal Engine piece. I was tipped off to it by a post from Live Arts Fringe and have thought of it frequently since. It is moving, intense, beautiful and it haunts me, but most importantly it is of our time.

It is hard to imagine this piece being made at any other time in our history. Yes, for technical reasons, but also because of it speaks to current issues, our issues. Organic, yet mechanical. Human. Computer. Individual. Swarm. Death, and yet affirmation of life. I don’t know, but it hits me in the gut.

A Hint

February 23rd, 2009 by Geoff 2 Comments

Scallop & Prosciutto

One of our favorite places to get out of the studio to discuss big picture business of P’unk Avenue is Beau Monde. The discussions cover internal projects, the next Junto topic, conferences we might like to attend, budget figures and anything else that would benefit from some distance from the studio.

Beau Monde does a lot of things right: the service is great, the food is delicious, and the environment is refined, but comfortable. Their food presentation also embodies a great web design principle that we can all learn from. On the top of each crêpe, they put a small amount of each of the ingredients that are contained within. They let you know what is inside the crêpe without having to cut or bite into it.

How does this apply to web design?

When you browse the web, you have many opportunities to click on a link. This might take you to another page, reveal a hidden element or start a video. In that microsecond before you click on that link, you are weighing many factors including relevance and interest. If you are looking for something, you are really hoping this is getting you closer to what you are looking for (scent of information). In the case of pleasure browsing, you are hoping that the link will reveal something that holds your attention.

As designers and builders of the web, we have an opportunity to place a metaphorical scallop and touch of prosciutto on a link. We can give them a hint before they have to bite into that site. We try to do that in subtle and obvious ways in our projects. Can you think of some great of examples of this on the web anywhere else?

A few tenets of Metabolism, maybe one tenet of Essentialism

January 9th, 2009 by Rick 1 Comment

In 1977 the Centre Georges Pompidou opened in Paris. The design of a museum had not previously been approached with such an inverted set of goals: accommodate the public first, then consider the art. The museum was an immediate success as a social institution, an inviting and unpretentious place to engage in art. The chilly distance between viewer and work had been removed conceptually, it seemed to lack all proverbial velvet ropes.

Its success derives from a fusion of its functions and aesthetics. You could say it’s a naked museum, there is no façade, there are no stone columns, there are no imposing Rocky stairs. It is a seven-story metal matrix, wrapped in weaving colorful tubes that contain all the buildings life systems (electric, water, waste). That’s where Metabolism comes in—approaching the museum, you get to see its guts. This novelty has a warming effect on visitors, a trip to the conceptual art museum feels more like a trip to the how-things-work museum, engaging curiosity.

So—here comes the segue—what an interesting approach to designing everything, show them how it works and they’ll want to know more. People often call what we do here at P’unk Ave “minimalist,” but I’m going to be nitpicky and call it “essentialist.” And since that name sounds stodgy, I will not refer to it again. Minimalism implies reducing things until they avoid literal interpretation and take on poetic/interpretive meaning. “These three fluorescent lights represent the Nina, Pinta, and Santa Maria, clearly.” We would rather do design that invites curiosity, gets people exploring, and reduces all those pesky barriers to entry.

We rarely use “design elements” in the way museums have columns and stairs and two-thousand pound front doors. We like our buttons to be round so you feel obligated to click them. We try to make it damn clear where in the site you currently are. We have a “please touch” section in many of our sites where users get to contribute. Marketing sites have no excuse to be static these days and museums should stop shushing.


Above represents the entire /images folder of a site we recently completed. There are little more than icons, buttons, and arrows (and some rounded corners to keep things friendly). We feel it’s possible to use very little, an essential amount perhaps, and still manage to create something friendly and useful.

The Centre Pompidou draws a crowd every day, coming for the art, coming to stare at the building. The public always feeling engaged in the experience, less a faceless part of the throng, that’s what the Louvre is for.

Will 2009 liberate us from Internet Explorer 6?

January 6th, 2009 by Johnny 3 Comments

This is my inaugural post and I am writing about this topic because it has been on my mind a bunch lately. Really, when will this browser die? Will 2009 be the year developers slam their coffees down and say, “No Way Man!” Will Windows 7 and IE8 show up and deliver where IE7 and Vista failed miserably?

I was a PC user for nearly 10 years before buying my first Macintosh. And I rocked my PC and Mac in tandem until the intel chipset and the virtual machine stuff made it possible to own a single computer. I grew up amidst the Netscape and Internet Explorer mayhem of the 90’s and I cut my teeth the first half of the decade tearing apart the ‘net with IE6 as my chariot.

Microsoft Internet Explorer 6.0 was in 2001. And it is long overdue for retirement.

http://ajaxian.com/archives/i-wont-support-ie-6-in-2009

Ajaxian posted a cute article to kick-start the new year, indicating that IE6’s numbers are down further than ever before. (Exciting!) But of course that’s not always the case, especially where building web based  applications for Corporate or Academic institutions are concerned.

How much can javascript hacks bubble gum IE6 into behaving on the modern web?

And How effective is simply denying visitors access to information or services if someone continues to use the old browser?

Basecamp phasing out IE6

Basecamp phasing out IE6

I know there has already been an infinite amount of discussion, griping, moaning, kicking, screaming on this topic so I am going to finish up.

I am just excited for this year and what it could bring – As a web developer, a designer, a user of the vast internet, and a citizen of the world. I love what I do for a living and I have enjoyed my involvement with these technologies as they have matured over the last 14 or so years.

So I’m holding my breath, I’m crossing my fingers. Let’s all plan a massive geek party to celebrate this year, 2009, when Internet Explorer 6 dies.

Holiday Punctuation

January 5th, 2009 by Geoff 2 Comments

The Cookie

The year-end holidays are always a good time to spread some cheer.

Last year, we silk-screened on coffee bags and worked with local roasters, Old City Coffee, for our gift. This year we took the opportunity to work with a local baker, Zoë Lukas, owner of Whipped Baked Shop. She had “our” apostrophe fabricated into a cookie cutter and then baked and decorated 100 of these beauties.

Not only did they look great, they were delicious.

Most importantly, we were reminded of the old adage, “it is better to give than receive”. It was great to get so much warm feedback from our clients that received the gift, and the experience of working with Zoë was fantastic. Supporting other creative entrepreneurial people is its own reward.

Looking forward to figuring out next year’s project.

Lubricate Your Shredder!

November 26th, 2008 by Geoff 6 Comments

Fellows Shredder Instructions

In some ways this post is a public service announcement. It turns out you need to lubricate your cross-cut shredder every time you empty the bin. If you are not doing that, you should start now. You can get shredder oil or shredder lubricant sheets.

In most other ways, though, this post is really about the value of design.

I always assumed a shredder needs no maintenance. You plug it in, turn it on and it is ready to go. However when our shredder stopped working, the customer service person at Fellows told me it is critical to lubricate a shredder. Critical.

Let’s take a look at how this critical information is communicated. Note the red arrow and gray box I added around the maintenance section in their manual:

Fellows Shredder Instructions Highlighted

The type that explains the importance of lubricating the shredder is in 8 point (or smaller) and not highlighted in any way. If I was designing this manual, I might make everything else in the manual 8 point and make that section much larger.

Prescription Bottle

This is really the same issue that was tackled by Deborah Adler for her SVA thesis project. Her grandmother accidently took her grandfather’s medicine since most prescription bottles look the same. Traditional labels represent all information at mostly the same size. The medicine, dosage, doctor’s name, pharmacy name, and all other information is not differentiated in any way.

Her redesign places real emphasis on the drug name and dosage instructions. The critical information gets weighted more.

In the prescription bottle case, design is the difference between life and death. In the case I am describing, it is the difference between spending another $50 and filling up the landfill with a broken shredder. I certainly recognize the difference, but I can’t help but think that designing the shredder manual better would not have been that difficult.

Once again, design matters.

Oh, by the way, in case you want to know what the lubrication instructions say, I blew them up for you here:

Fellows Shredder Instructions - blow up

Why not have the interface teach?

July 2nd, 2008 by Geoff 6 Comments

Recently Google Calendar changed the way you hide and show a calendar.

It used to work with check boxes. Checked is visible. Not checked is hidden.

Former Google Cal UI


The system worked well for me and I used that feature all the time to hide my civic association’s calendar, for instance.

Currently you click on the name of the calendar to hide or show it. The check boxes are gone.

New Google Cal UI

The issue I have is that I was never informed that this change was made. I just figured the feature was removed. It confused me that it was gone, but I did not have the time to dig deeper at the moment. (For the record, I like the change.)

It occurs to me that Google could have used the interface to inform me of the change.

Imagine this scenario:

    You log-in to your calendar and the check boxes are still there.
    You click on a check box and a little bubble of sorts pops up and says, “Hey, we have changed this feature. From now on, you can just click on the name to hide/show it.”
    The check boxes then disappear.

How cool would that be?

And, it would be informing you of the change at the time you need to know.

If you did it this way, there would be no need for documentation to be created.

To all of our fellow interface designers out there, what do you think?