Nintendo’s long-running Mario series has afforded them quite a bit of time to get Mario “right.” Early on, they didn’t have the technology to do anything fancy in games like Donkey Kong, but they worked with what they had. But you can see that as the years passed, Nintendo took their previous work and iterated on it.

Nintendo was wise to ship something and not worry about exactly what Mario’s nose would look like in the end. As you can see, his nose got rounder as time passed. But it got to be that way in small, calculated steps, with a ton of trial and error.

How this applies to web design

The typical lifecycle of a website goes like this:

1. Invest up-front for a design. You love it at this point. Everyone involved feels great.
2. Build out the site and its content. Almost done!
3. Take a break from this website business for more pressing issues. It is done after all, right?
4. 12-18 months later, get tired of the design, so start over at step one. Here we go again. But this one will be so much better!

I call BS. Think about this: wiping the slate clean often does not prove that you’ve learned anything from the process. And if you’re a new manager stepping in to manage an existing website, think twice before throwing everything out the window for a massive redesign project.

A successful website should be maintained continuously in an iterative fashion, just like the Mario design. The Web isn’t like a print brochure where once you send it to the printer, you’re done and stuck with it. You can make changes on the fly and try things out. And you should be doing that.

Scrappiness: work with what you have

I’m not calling for a complete redesign every few weeks. That would be costly and disadvantageous for your business. I’m talking more about Mario’s nose: an evolution if you will.

• Examine what you have: analytics data, advertising data, usability testing data.
• Talk to your customers.
• Pick the weakest part of your site and improve that.

New techniques and design trends will also surface. Evaluate them one at a time, figure out if you need them and where best used, and add them in one at a time. The technology in the 8-bit NES afforded fewer advantages than today’s Wii.

You’ll save time, money, and a costly redesign project in the future if you keep up with it all continuously. If you can’t commit to this, then don’t invest in a website to begin with!

Having a “master plan” is no excuse for a massive redesign project

Let’s make one final point clear. Some of this sounds short-sighted, and it can be if you don’t have a plan.

If you feel like you have a “master plan,” a “vision,” or whatever, I have a challenge for you. Plan out how you can get to your vision iteratively rather than in one giant uber project. Which elements can you change one at a time in bite-sized chunks?

Your team of implementers will thank you for not overwhelming them, and your business will thank you for consistently showing visual progress. Don’t hide away for six months to a year to redesign the site. Business must go on, the website must be maintained, so any redesign efforts should be lumped in with that.

Technorati Tags: agile, agile development, ccm, chris peters, clear crystal media, design, glass case, internet marketing, mario, nintendo, web development

As many fields, products, and services are becoming commoditized, it’s become increasingly important to plan and implement a great customer experience. Much of this involves planning and gauging how your business makes your customer feel. Creating those “wow” moments aligned with your strategy is key.

The role of prototyping in McDonald’s and Apple

Two key examples were explained and demonstrated in E-myth Revisited and Subject to Change: McDonald’s and The Apple Store, respectively. Both stories involve building physical prototypes of each business and refining them until they ran as smoothly and customer-friendly as possible. Steve Jobs had several versions of the Apple Store built in a giant warehouse so that his staff could test several possibilities. And whether you like McDonald’s or not, Roy Kroc worked with a prototype until he could perfect a McDonald’s business that works for franchisers.

Working on prototypes in a professional services environment

The heart of what I want to do is offer a service, and that’s a tad trickier because I don’t have a physical product or storefront to mock up and prototype. Also, offering a professional service in a creative and technical area is messy. Some efficiencies can be factored out into processes and procedures, but those same efforts can stifle innovation if taken too far.

Adaptive Path had a compelling solution to the problem of prototyping services, described in Subject to Change. They draw comics that mock up key touchpoints in the customer experience. These comics show what’s going on in the customer’s head, how the customer interacts with elements like the website and phone, and what’s going on overall in the customer’s “story.”

Balance between prototyping and execution

While this planning is helpful (and I encourage it), sometimes it’s best to jump in too. I plan on jumping in to some ideas and innovating on the fly more this year. I will try my best to plan as much as possible, but it is time for action in addition to planning and setting up all of my GI Joes.

I will be working for an actual customer or two, work with them to refine the service, all on the fly. It’ll be really tough, but if I play my cards right, much of the discovery will only need to be done a couple times.

We must balance planning and execution. Each is important, and each is really hard work. At some level, your execution is also a prototype that always needs to be refined, only if you’re willing to inspect it and improve it.

Working with both requires curiosity, insight, introspection, and creativity. Wish me luck.

Technorati Tags: adaptive path, book, books, business, ccm, chris peters, clear crystal media, design, e-myth, glass case, internet marketing, marketing, prototype, prototypes, prototyping, subject to change

Consider this example for ColdFusion on Wheels. There is a main feed with all site updates:
http://feeds.cfwheels.org/cfwheels

When I burned that feed, I signed up for “cfwheels” as my feed URL.

But if you want to subscribe to the blog only, you can subscribe to this feed:
http://feeds.cfwheels.org/cfwheels/blog

I signed up for “cfwheels/blog” as my feed URL in that case.

And here is the screencasts feed:
http://feeds.cfwheels.org/cfwheels/screencasts

Et cetera, et cetera.

It’s a very nice way to show the user what they’re subscribing to and where the URL resides in the information space.

Technorati Tags: ccm, chris peters, clear crystal media, design, feedburner, glass case, google, information architecture, internet marketing, mybrand, url, urls, usability

You’ll notice that they don’t really explain it. They show the info that you need to know and help you get to the next step, which is gravatar.com. And gravatar.com does a really good job of explaining how it works.

Sometimes the best way to explain something is to not explain at all.

Technorati Tags: ccm, chris peters, clear crystal media, design, github, glass case, gravatar, interface design, internet marketing, ui design, usability

1. Silverback by Clearleft

They give us a sentence, 6 bullet points, and a dead-simple diagram showing what it does. They even show us a video demo that was created using the product itself. Brilliant.

2. iPhone by Apple

The product is so great that their TV commercials don’t do anything other than show the product in use. And it sells itself. When I first picked one up myself, there were no surprises on how it would work.

3. Getting Real by 37signals

37signals lets you read their book online for free. If someone really wants to endure the eye strain or read it slowly, it’s there for the taking. But those who love having a memento or reading a print version can buy those. This works especially well for 37signals because they have other products that others may want to check out.

Technorati Tags: Advertising, ccm, chris peters, clear crystal media, glass case, internet marketing, marketing

Don’t get me wrong: the words are important. They’re what search engines see. People still need to read some.

But in this visual YouTube generation, people need to see that your product or service meets their needs, not just read about it.

Technorati Tags: ccm, chris peters, clear crystal media, Design, flash, glass case, internet marketing, marketing, web marketing, Writing

A single web page addresses a single topic. As the amount of information on your site grows, each page’s ability to walk this fine line grows more important.

Include the right amount of information—no more—and give the visitor a clear set of next steps. (You may have heard of these next steps referred to as “calls to action.”)

Even as a writer, you are also a designer.

Technorati Tags: ccm, chris peters, clear crystal media, Design, design, glass case, ia, indexed, information architecture, information design, jessica hagy, Writing

Take a look at the primary photo used on the home page of BackLinkPageRank, a link exchange service.

What the hell does that photo have to do with their service? Are free link exchanges fun for the whole family? Will your little girl laugh with glee as you gain low-quality links back to your site?

I’m hoping that the designer of this site thought, “Well, it’s better than empty space.” Then they would have at least a little saving grace.

But in this case, a better choice would have been leaving the space empty.

Technorati Tags: bad, bad design, ccm, chris peters, clear crystal media, Design, design, glass case, internet marketing, scammer, scammers, stock photo, stock photos, unprofessional

I had noticed on the label that it fit most plastic grocery bags but didn’t investigate it any further. When I got home, I was pleasantly surprised to see that it had holders for the handles of the bags, and they fit my bags very well.

As people are becoming more environmentally conscious, this is an amazing way to appeal to everyone with a very useful design.

Technorati Tags: ccm, chris peters, clear crystal media, design, glass case, product design, product review, product reviews, simplehuman, trash can, trashcan, utility

Good news! A usability test can be done anywhere, and you don't need expensive labs or equipment to reap the benefits.

This week, I’d like to point you to an article by Jared Spool called The $300 Million Button. Jared was hired to study the user experience of a $25 billion retailer’s web store. During his studies, he found that customers were being tripped up during a key part of the store’s check out process.

To sum up the direct results of his finding, Jared writes the following:

The number of customers purchasing went up by 45%. The extra purchases resulted in an extra $15 million the first month. For the first year, the site saw an additional $300,000,000.

Finding the places on your site that are confusing your customers can yield similar results for your business (though probably not at that scale).

I’ve seen it firsthand myself. Improve the experience, watch more business roll in.

Technorati Tags: ccm, chris peters, clear crystal media, glass case, jared spool, uie, usability, user experience, user interface engineering, user testing