Michael Histen is blogging

On being willfully ugly

2011-02-08T11:51:00.005-05:00

In case you haven't noticed, most ad-supported websites today are desperate for your attention. Every ad, every element, is shouting at you, "look at me! over here! HEY!" The end result is often they all cancel each other out, and there is a well-documented phenomenon of "banner blindness" where people are so attuned to ignoring ads they don't even notice them anymore. Unfortunately that extends to ad-like things as well, which means if you are trying to get your visitors to pay attention to something important by giving it a fancier visual treatment, you may inadvertently be triggering them to ignore it.

A recent study caught my attention with its finding that "funky" (read: ugly) fonts actually made people remember content better. At the same time, a project I've been working on had the issue of figuring out how to make visitors notice availability of a product before they head to the store and find they can't buy it. We had done a version of a design that introduced red and green coloring to a part of the design to indicate "unavailable" or "available" very obviously. The reaction wasn't very positive because it didn't look very visually appealing since it was inconsistent with the rest of the design, which didn't have red or green in it. And yet, it jumped right off the page as clear as day, in much the same way an ugly font can get you to pay closer attention.

All of the above made me realize that sometimes the solution to getting someone's attention may in fact require a willingness to get ugly -- literally. After all, one of the key methods to getting attention is contrast (imagine a red shirt on a rack full of white shirts -- which one would you notice?). If your design is well-executed, it is probably slick and visually appealing. And if making one element even slicker to get attention actually triggers people to ignore it, then maybe what you need to do is just go with something visually discordant. Be ugly. Use a different font. Use a different color. After all, the opposite of pretty is, well, ugly.

(But -- please, keep this in mind! -- this would only work if used extremely sparingly. If you start making every element ugly in order to give each thing attention, you just end up looking ugly across the board, and your visitor becomes attuned to seeing this same treatment, which makes it lose its impact.)

Bottom line -- for situations where you have information that is of vital interest to the visitor/consumer, sometimes the best way to get their attention is to be willfully ugly.

Do one thing right

2011-02-01T11:17:00.002-05:00

I love this post about file storage service Dropbox:

Well, let's take a step back and think about the sync problem and what the ideal solution for it would do:

There would be a folder.
You'd put your stuff in it.
It would sync.

They built that.

Why didn't anyone else build that? I have no idea.

"But," you may ask, "so much more you could do! What about task management, calendaring, customized dashboards, virtual white boarding. More than just folders and files!"

No, shut up. People don't use that crap. They just want a folder. A folder that syncs.

"But," you may say, "this is valuable data...certainly users will feel more comfortable tying their data to Windows Live, Apple Mobile Me, or a name they already know."

No, shut up. Not a single person on Earth wakes up in the morning worried about deriving more value from their Windows Live login. People already trust folders. And Dropbox looks just like a folder. One that syncs.

"But," you may say, "folders are so 1995. why not leverage the full power of the web? With HTML 5 you can drag and drop files, you can build intergalactic dashboards of stats showing how much storage you are using, you can publish your files as RSS feeds and tweets, and you can add your company logo!"

No, shut up. Most of the world doesn't sit in front of their browser all day. If they do, it is IE 6 at work that they are not allowed to upgrade. Browsers suck for these kinds of things. Their stuff is already in folders. They just want a folder. That syncs.

That is what it does.

This is the same kind of thing the folks at Signal v. Noise have been talking about for years.

People who have never designed complex commercial websites may not realize the headache-inducing number of special considerations you need to take into account. For any given product there may be a million unusual scenarios you have to plan for -- and many projects get bogged down with the vast majority of time and energy being spent on fixing issues that may affect fewer than 5% of visitors. Think about that -- spending only a small portion of time on a project for the part that affects 95% of people! Few things frustrate me more than realizing I've fallen into that particular rabbit hole.

The Dropbox tale is a good reminder of how simplification at every level is ultimately much more successful than trying to accomplish every possible goal for every possible customer. Dropbox was willing to say, "we are not the product for the person who wants a corporate-skinned RSS feed of multi-folder data backups." And they beat the competition by a mile.

Year 30: Fitness

2011-01-21T15:45:00.004-05:00

I've decided to try to get back into blogging. As limiting myself to just design-related posts ended up yielding a rather slow stream of posts, I'm going to expand to cover all sorts of stuff.

I recently turned 30, and like many people, I felt like this was a milestone that deserved a little introspection. I've decided to refocus on some things that have been important to me. The first thing is my health and fitness.

I've been on a new fitness plan/diet since January 2, and I waited until today to post about it because I was waiting for a major milestone: I've officially lost 10 pounds already.

First, a little background -- I've never been fat or scrawny, but instead have vacillated in roughly the same 30-lb. weight range for half my life. I was 185 lbs. when I was 15 (I was already at my full height of 5'11"), and started realizing that was maybe a little big for me. I changed my diet and began exercising and within a year was down to 155. Through high school and college it slowly climbed back up to 175, and then for some reason in the first couple years post-college I lost about a pound a month until I was down to 152. At this point, I genuinely was too thin, and I decided to finally join a gym. Having built some muscle I ended up reaching the peak of my fitness around age 25, weighing around 160-165 lbs. and even had some slight ab definition in the right light. But in the years since I've gained some back and have mostly been 175-185.

This past fall I sort of "fell off the wagon" in terms of exercise and not only was I back at my peak weight, I am fairly certain I had lost some muscle. Basically I looked the worst I'd ever looked and wasn't happy about it. I then learned about the Four Hour Body by Tim Ferriss, and was particularly enticed by three major points: you get a day off each week to eat whatever you want, on other days you do not have to limit portions as long as you stick to "approved" foods, and apparently the whole thing works fast. (He claims you can lose 20 lbs. of fat in one month.)

So I decided to do it, but waited until the day after New Year's so I could ride out the holidays without watching what I ate.

The diet is pretty simple to remember but is quite restrictive. You can eat anything from these three groups but nothing else:

1. Proteins (meat, poultry, fish, eggs, tofu, etc.)
2. Legumes (beans, lentils, etc.)
3. Non-starchy vegetables (mostly greens -- no potatoes, for example)

That's it. This is hardcore low-carb (the only carbs allowed are basically beans -- not even brown rice is okay) and doesn't even allow eating fruit (other than tomatoes) because of the fructose (sugar) in it. No alcohol, aside from a couple glasses of red wine. You're not even supposed to consume artificial sweeteners (aspartame, Splenda, etc.) as they trigger some of the same chemical responses in the body that real sugar does, basically telling your body that you should store calories as fat and increasing your hunger. One day a week you are required to eat whatever you want all day -- not just allowed, but required -- as this "reboots" your metabolism to prevent it from thinking you are on a starvation diet.

This diet was especially hard for me because I am the pickiest eater you'll ever meet. "Oh I'm worse," you say? No, you're not. Of those three things allowed above, the only thing I ate was the protein part, mostly in the form of insane amounts of chicken. I could go into more detail, but just trust me -- everyone I've met has been flabbergasted by my limitations with food (a lot of things actually start to make me retch).

This is part of why I picked this diet, though. It was forcing me to try new things that are healthier for me. The first week of the diet was painful. The vegetables I tried were mostly terrible, and I was only able to really stomach some spinach being tossed in with the few things I actually liked. I tried a variety of beans and found them barely edible but mostly unpleasant. I was eating chicken, eggs, and turkey bacon constantly, as some of the few "recognizable" foods I was allowed. I was aching badly for my first "binge day" when I could revisit the foods I loved. And yet, I was surprised to find my hunger greatly diminished very quickly. Something about the carbs in my diet (I used to eat a LOT of whole grains -- shredded wheat, oatmeal, whole wheat bread, etc.) had made me feel like I could eat non-stop. The new diet was painful, but it was changing my appetite, and in that first week, I lost 5 lbs. It was working, but I wasn't sure if I'd be able to survive week 2.

Realizing 5 lbs. was nothing to sneeze at, I relished my binge day and then decided to try the diet again for another week. I found myself doing the previously unthinkable -- searching across the grocery store for new legumes, soups, vegetables, and seasonings that would fit in the diet. If I was going to have to eat like this, I was going to find foods that I didn't just tolerate but actually liked. And somehow, things started turning around. I realized that since bacon was okay, I could add it to a salad. I tried mixing beans with my favorite marinara sauce. I learned that cooking lentils with soy sauce outweighed their natural flavor and made them tastier. Things began looking up. In week 2 I lost another 3 lbs.

Week 3 wasn't even a question -- after my second binge day I felt ready to hop back into things and was actually starting to (gasp!) enjoy some of these new foods. I've eaten 2 salads pretty much every day this week, and although at first the weight loss seemed to be plateauing, I am down two pounds and still have one more weigh-in tomorrow morning before the official week count is up.

I'm a little more than halfway to my total weight loss goal, and it's exciting. The plan includes some other elements -- supplements and vitamins, lots and lots of (cold) water, and three 30-45 minute weight training workouts a week (which is actually less than I used to do as recently as this summer) -- but it was the diet that I knew would be my biggest challenge.

Why am I sharing all this? Well, first, I'm proud that I have been able to actually lose some weight, but mostly I'm proud that I've finally been able to bust out of my old patterns and expand my diet to include healthier foods. Once I reach my goal (and I'm fairly certain I will), I may even share my before-and-after pictures. And at that point, I'll move into "phase 2," which will switch from weight-loss to muscular fitness and involve some other beneficial changes.

I will say, if you are looking to lose some weight yourself, most diets will work -- if you stick to them. And this is where almost everyone fails. What I think differentiates this one is that it is somehow both one of the most restrictive and one of the most freeing, by balancing the diet limitations with a weekly day off, and does not require you to ever feel hungry. I had tried low-carb diets before and always felt deeply sad at the prospect of potentially never eating some of my favorite foods again (pizza, chocolate, and oddly, shredded wheat). There is no feeling of that here. I'm never starving, I don't have to count calories, and I always know that whatever I want to eat is just a few days away.

And still, I've lost more weight faster than I ever have before. I hope I can keep it going!

Websites are not applications (...usually)

2010-05-27T11:02:00.002-04:00

One of the increasingly blurry lines in the online world is the concept of websites vs. applications. Since the rise of the iPhone and its app store (and the corresponding app markets for platforms such as Android and Blackberry), the word "app" has rapidly spread into the mainstream. This is largely a distinction of marketing -- an "app" is really no different from what we've previously called "programs," "software," or even "games." But it also has started to overlap with the definition of "website."

For example, think of something like Google or Facebook -- these are websites. But they can also function as applications -- tools that you use often. And indeed, both have released "apps" for platforms such as the iPhone. But whether you use them in "app" format or "website" format, they function pretty much the same. The primary difference, really, is that an app is catered to the particular device you are using (although, with browser detection capabilities, a website can cater itself to your device as well).

The problem with this increasing overlap is that a lot of companies are misunderstanding what it means to have an "app," and they don't think about why other companies even have (or need) apps in the first place. I suspect a lot of people see the "social media" revolution and the increasing dominance of smart phones, and think they need to get in on it -- Make an app! Integrate with social media! Create user profiles and personalize based on each individual person! It's a marketing mantra that seems sensible -- reach your customers where they are rather than forcing them to come to you. So if Google and Facebook are websites, and they have apps, if I have a website, I should have an app too, right?

Well, no, not necessarily.

The fact is, most websites are NOT social media hubs or tools. Most websites are standalone pieces that people may visit once in their whole lives, or perhaps once every few months or so at a maximum. You might visit a furniture website when shopping for a couch and never come back. Maybe you need an exterminator and find them online, and then you never need them again. Perhaps you're going on vacation and check out a spa online at your destination, which you might never visit again. These are websites that deliver value at the time you use them, but you're not going back again very often (if ever). You're not going to make that exterminator's website your home page. You're not going to download the spa's app. And you're probably not going to set up a personal profile at a furniture studio's website.

But what about your favorite pizza delivery place? Your bank? Your favorite local clothing store? You might visit all of those places often, and would benefit from apps, profiles, or other long-term connections. Here's a few questions to ask yourself before you start thinking you need to be investing in these alternate methods of customer connection.

1. Do you provide a service or sell things that people tend to purchase frequently -- and can they make those purchases online?
If yes, you might benefit from an online profile that lets customers save their payment info and other preferences. You might also consider a simple mobile phone app that does the same thing.

2. Is there a useful (free) tool that you could provide online or via an app that your customers would use often and find valuable?
If yes, then you might benefit from providing an app or online tool. For example, I worked on Tide's "Stain Brain" website and app -- it gives tips for removing small stains on the go, which keeps Tide in the customer's mindset without requiring them to pay anything to use the app.

3. Does your business interact with the community in a way that engages people in a non-customer role (e.g., you sponsor a charity event with participants who aren't necessarily customers)?
If yes, then you might benefit from branching out via a stronger social media presence -- people are happy to support a cause by posting about it on Facebook or sending messages on Twitter to ask their friends to donate or help, and your name gets out there in the process.

If you can't answer yes to any of the above questions, there's a good chance you may not be in need of apps, social media, and user profiles. Any of those avenues done wrong can actually harm your image -- a useless app ends up looking like little more than an ad taking up space on your phone, a Twitter feed that is never updated just looks like you don't care about your business, and adding a user profile for a site you may rarely visit just frustrates the visitor and may serve as more of a barrier than a convenience.

So while everyone is shouting about the next wave of "customer enablement," keep in mind that it's not just whether or not you have an "app" -- it's a matter of whether or not that app (or profile, or Facebook page, etc.) actually offers any value to your audience.

When solutions create more problems

2010-04-19T14:49:00.002-04:00

This will be a brief post, but it's been awhile since I've posted and I wanted to put something up, even if it was mostly an "aside."

THE PROBLEM
I listen to a lot of music and have several thousands of songs in my iTunes library. The problem with having so much music is that it can be hard to organize it and listen to songs I know I like while maintaining variety. If I only pick the songs I know I love, I end up just listening to a smaller and smaller subsection of the total library as it grows, leaving tons of songs sitting idly, unlistened. Yes, this is pretty mundane, but it is a problem I wanted to solve.

THE SOLUTION
One of the great aspects of iTunes is its "Smart Playlist" ability, where you can automatically generate playlists based on a number of factors. To re-introduce songs I hadn't heard in awhile, I created a playlist called "Listen Again." At first, I just set one parameter:

-Songs that I have listened to at least 10 times (showing that I liked them at some point) but haven't listened to in more than 2 months (showing I have forgotten about them).

This started off great, I started hearing songs again that I really enjoyed! But then another issue came up...

THE PROBLEM, PART 2
Some of these songs hadn't been listened to in 2+ months for a reason -- I didn't really like them all that much, or was already sick of them. As I continued to listen to the playlist, when I skipped those songs, they remained in the list, while the songs I liked automatically got booted off the list since they had now been played in the past 2 months. The result is that as time went by, the list became increasingly populated by songs I didn't want to listen to.

THE SOLUTION, PART 2
Well, lo and behold, there is another parameter I can use in iTunes to fix this!

-Songs that have been skipped at least once in the past month (removes songs I don't like, but allows them to return to the list in a month's time in case my taste changes by then).

Fantastic! The songs I skipped immediately got booted off the list. There are still two remaining problems, however...

THE PROBLEM, PARTS 3 & 4
I hadn't considered this until the playlist started cooking, but -- a lot of these songs haven't been played in 2+ months because they are Christmas-related songs! Whoops! There is no easy fix for this -- unless I go back and tag all those songs as belonging to the "Christmas" genre, and exclude that genre from the mix (which I may go and do later).

And then there's the biggest problem, really -- what to do with those songs that this playlist has allowed me to rediscover and enjoy? By virtue of being played, they are now immediately off the playlist! Is there another smart playlist I can create to capture them? This one I don't know how to answer. There may be a way to create a hybrid of songs that appeared on this and also were recently played, but I haven't figured it out yet.

Interestingly, iTunes offers several default smart playlists (recently added, most played, etc.) -- it'd be interesting to see if they expanded their default lists to include some similar concepts. Perhaps sparing users the work I just went through. They have made efforts with their Genius tool to expand your listening (which can also lead to expanding your buying), but I bet there's more that can be done.

New work up: JohnCorvino.com

2010-01-25T16:30:00.005-05:00

http://www.johncorvino.com/

I met John Corvino in person several months ago, and after learning his partner worked in the same company as I did (albeit in the Detroit branch), we stayed in touch, and he asked me to take a look at working on his website. John is a prominent speaker/writer/lecturer on moral issues surrounding gay rights (hence the moniker "The Gay Moralist"). In fact, he debated Maggie Gallagher, president of the National Organization for Marriage, just last week.

For his site, he wanted to not only give it a clean, vibrant visual makeover, but also make it easy to update and provide an automated way to sign up for an email newsletter. I've found that virtually all clients at this point want the ability to update their sites themselves, and it can be tricky to build a site with a content management system that does not require any coding knowledge on the part of the person doing the updates.

For this execution, I did a slight restructure of the information architecture, and then used WordPress (which I also used for my 2k50 site) for the implementation. I wrote a visual theme for it from scratch and used the "Pages" and "Categories" features to organize the content. I also figured out a few other cool things -- I managed to sync up an RSS feed of the columns John writes for 365gay.com so they appear on his site automatically (and in the proper category). I also used a combination of WordPress plugins and Feedburner to build a free, automated email newsletter for him -- all within the same admin interface as updating site content.

I am finding that WordPress has a lot of benefits (although there are some unfortunate issues that require workarounds), and will probably continue using the service for similar clients in the future.

Check out John's site at http://www.johncorvino.com/.

Marketing-speak is killing me

2010-01-22T15:39:00.005-05:00

A lot of my work involves looking at other websites to see what's going on in terms of structure, interactivity, etc. And one thing that I keep noticing is just how often websites are plagued by utterly-meaningless, corporate marketing-speak. Here's one example from a financial institution's home page:

What does that mean? I will give the copy writer a little benefit-of-the-doubt -- they at least understand that a major issue people have with financial institutions is trust, and being valued. The problem is that this says absolutely nothing about how they plan to establish that trust or "commitment." There is no action to take here. There is no proof of their claim. It would be like having a slogan that says "We are good" and leaving it at that without an explanation of why. Note that they don't even tell you what they do here -- the only thing that establishes any sense of financials is that the two guys in the generic stock photo are in suits. But they could be lawyers, politicians, who knows. And yet this is the largest piece of real estate on their website's home page. Who would be convinced of anything here?

I'll contrast this with a better example from a similar company:

This is a little better. I could still do without yet another generic stock photo, but I know that research shows people do respond to photos of other people, and at least the photo does roughly connote either retirement or saving for your child. But where this site gets it right is that it is establishing a bunch of things with its headline and copy very quickly. It tells you what the company does, how that can help you, how they accomplish that (including a product name), what it will mean for you, and then invites you to action. It's not just saying "we care about you." It's saying "we understand what your problem is and we are offering you this solution." Much more effective.

It's the old "show, don't tell" adage. It's a lesson too frequently forgotten.

Prioritizing Content

2010-01-19T11:29:00.004-05:00

The field of "information architecture" is essentially about organizing. Where do things go? What's the hierarchy? You can't answer questions like this without first figuring out your content and prioritizing it.

This is extremely challenging for a lot of clients. It's like asking them to pick a favorite child. How can you say that product A is more important than product B? Or that one type of information is more important than another?

The reality, however, is that prioritizing is not optional. Even if you somehow designed a website where literally every single piece of information was given equal weight, you'd still have the bias of the order in which that is presented. Something neutral like "alphabetical" now gives weight to A-named things. Abandoning any particular order and randomizing every time you load a page now completely leaves the user helpless as they have no way to find anything as there is no structure anymore. You have to make a choice in terms of priority.

The good thing is that you don't have to make these decisions in a vaccuum. There are two key methods to determining priority: user goals and business goals. Fairly basic site statistics can tell you what your users are doing (more advanced analysis could of course give you additional insights). If 20% buy products, but 60% go to the help forums, you could probably surmise that the majority of your site visitors are existing owners of your product who come back to look for assistance (it also may suggest that your product has some problems!).

But hold on one second. If you followed that priority path, you would be greatly diminishing the prominence of shopping for your products. This may match user behavior but is probably not a great match for your business goals -- no doubt your top priority is selling your product. And this is where that delicate balance of both comes into play.

The key to managing both sides of the equation is understanding that users looking for particular things tend to exhibit different behaviors. Most people will probably expect that the main area of your home page will be promotional in nature. If they are coming in with the intent to get help with your product, they will probably start by looking in your menus, footer, or other contextual link areas searching for key words like "support," "help," or "FAQ." You can cater to them by making such a link highly visible and easy to spot, without sacrificing your promotional space for products.

Conversely, someone who is in a "shopping" mindset may skip your menus altogether and interact directly with your main content area. Further prioritizing here (showing the most popular products, for example, or the best new discount) gets that user to the content they're looking for right away.

This is all rather high level, I'll admit, and prioritization decisions are often much more difficult than this. Take, for example, a website with a homepage that has three clearly defined areas for promotions. If these three areas are different in size and location, you can probably give a clear order to their visibility. Let's say you have a large banner, a medium-sized tile area, and a small text link, going from "most visibility" to "least." Now let's say you have three new promotions coming up simultaneously. Your first instinct for each may be to give them all top priority. They are all important, right? Can't we just make three large banners? You could... but then your website would start becoming a monster with no organizational structure. It's never a good idea to re-structure a website based around a single one-time occurrence, unless it's something truly huge (like, you're going out of business, for example). You confuse return visitors and disrupt the visual "brand" your site establishes.

It becomes so much easier to solve design problems when you get comfortable with the idea that not everything is going to be equally important, and that the way to give visibility to content may differ based on the type of content you are presenting. Smart prioritization not only makes your website easier to navigate, it can increase user satisfaction and supports your business goals by steering people to the content they want while also giving them an easy path to turn from visitor into customer.

2k50: An Experimental Project

2009-12-25T13:10:00.002-05:00

I've been working on a personal side project called "2k50: The 50 Best Songs of the Decade," which just went up a few days ago. I spent weeks compiling my 50 favorite songs of 2000-2009, and am now posting 5 more every day until December 30 (50-26 are up as of this writing). This project also served as an opportunity to further explore Wordpress as a site management solution. It worked wonderfully, and has given me a lot of insight into how to build sites that clients can update themselves even if they don't know how to code. Furthermore, I even learned a new thing or two about CSS layouts. This may not mean much to those who don't know coding, but I was able to design the site using solely text and CSS-scripted boxes of color -- this is a great technique in general as it not only makes pages load faster, but improves searchability.

Check it out: 2k50: The 50 Best Songs of the Decade

New work up: Duracell.com

2009-12-21T01:24:00.003-05:00

A few months ago I was on the team redesigning Duracell's website, with my focus on the user experience side of things. The wireframes I worked on (which were partially based on designs another interaction designer had created - I certainly can't take 100% credit!) were used by the creative and tech teams to implement the site. I'm pretty happy with the end result!

Visit Duracell.com

Removing ego from design

2009-11-24T16:47:00.000-05:00

One of the most difficult aspects of any web design project is reconciling the goals of the designer with the goals of the audience. (And by "designer," I am including everyone involved in the design process, including the client, the design agency, etc.) This is so difficult because the goals of the designer include so many facets -- the client wants to get more money coming in, the agency wants to please the client to get more work in the future, the creative director wants to wow other creative types with his/her vision and maybe win an award, etc. And amidst all of that as well are political power plays, internal arguments, and some "selective hearing" when it comes to research and statistics that don't support their individual goals. (I speak of no particular agency or experience here -- these are accumulated observations.)

The whole rigmarole can be a bit exhausting and it is very easy to get caught up in the "designer" side of things. It all seems quite serious - to step back and think about the fact that people can get into shouting matches over a single word on a website (I've seen it happen) - I don't know, it seems like the perspective is off. People take these battles very personally, and fight for things because they want them, or because it means something to them, and it's easy to forget that all that really matters is whether or not somebody going to your website is going to have a good experience.

This is why I've found it so valuable, in my own work, to start viewing the work I do as completely separate from who I am. Much of what I design is based on research - knowing what works and what doesn't - but there is not enough research in the world to make every decision foolproof. If something was a subjective call, or I designed based on a hunch, and someone takes issue, I'll explain my viewpoint but recognize that if I don't have an empirical study to back it up, it's really just an opinion.

In addition, when working in a group environment, letting go of ego can make the brainstorming and overall creative process a lot more open. An idea prefaced with "this may be stupid, but..." could end up being the best idea of the day, while one that someone thinks is surefire could be quickly tossed out as the details are thought out further. When ego is involved, the initial "stupid" idea might never be brought up for fear of a negative reaction, while the "surefire" idea might be fought for tooth-and-nail to the detriment of better options. Letting go of ego - where you perceive comments about your idea as a comments about you - switches the emphasis to the ideas, not the people.

This ends up being quite liberating in the long run, because not only does it make it easier to edit and adapt your design as more learnings come in, it also makes you focus more on what will best serve the end user. And in the end, that's really the truest measure of a successful design.

The best restaurant site I've seen in a long time

2009-11-20T15:44:00.004-05:00

I live not too far from a little pizza place called Emilio's. The other day I was looking through the handful of delivery menus I have and realized I didn't have one for Emilio's, so I figured I'd check online to see what they had.

It took a few clicks to find their site (Google didn't surface it to the top like I'd hope), but once I did, I practically jumped up and down for joy. This one page is their whole website:

(Click to enlarge it, or just visit it here: www.emiliospizzaboston.com)

Okay, so, obviously this is not the prettiest website, but from a usability standpoint I was so happy to see an eatery get it right for once. There are pretty much three main reasons why you'd want to visit a delivery restaurant's website:

-What's on their menu? (And how much does it cost?)
-Where are they located?
-What's the phone number to place an order? (Or for fancier restaurants, to make a reservation)

What does the site for Emilio's offer? A direct link to the menu, their address, and their phone number in large text. No marketing gobbledygook statement from the owner. No pages about atmosphere. No unintuitive naming conventions (everyone knows the word "Menu," so calling it "Food" or "Cuisine" or something cutesy like "Tasty Nibbles" just ends up being confusing).

And furthermore, finding the menu didn't require me to click a location, then click a time of day (brunch, dinner, etc.), then click further into another sub-set of pages for "appetizers," "entrees," etc. I just got the whole menu right away, which is exactly what I wanted.

There are definitely more things the site could offer that would be helpful - hours, a link to a map next to the address, maybe a picture or two of the place (and if it was a fancier restaurant, probably information about reservations and maybe some press reviews), but the essentials were right there. It could also certainly be more visually appealing, but the fact is I found exactly what I was looking for within a split second of landing on the site, which is worth so much more than looking pretty.

Progressive disclosure: making decisions easier and more satisfying

2009-10-21T15:30:00.004-04:00

I'm not sure if I've directly used the term on this blog before, but the concept of "progressive disclosure" is (in my opinion) a very important part of good design for any website or application. A good design will help the user find what they're looking for easily. Some people interpret this as meaning you should present up-front every possible piece of information they may need or want. In reality this just confuses the user. Imagine if, when you landed on Amazon's website, you were given a full list of every single product with full product description all on the home page. It would be completely unwieldy and almost impossible to find what you really want. Does "everything up-front" still sound like a good plan?

Progressive disclosure tells you that the best way to get people the information they want is to provide just enough at any given point to help their get to their desired result. To continue with the Amazon example, let's say you wanted to buy a Samsung HDTV. In our "up-front" example, you'd have to scan through an unwieldy page with millions of products to find what you want. Instead, progressive disclosure lets us get the shopper to Samsung TVs by clicking through a hierarchy. "Electronics," then "Televisions & Video," then "Samsung" is highlighted as a brand.

Furthermore, when you land on the Samsung page, you don't just see a text list of products or a full spec sheet for each product. You see each product with its name, an image, its price, and its consumer star rating. You're not given the full list of specs and item description for each item, but you're given extremely quick glances at three major pieces of information - aesthetics, price, and quality - which can then help you narrow down to the selection you want.

There are a lot of other ways of using progressive disclosure that aren't just hierarchical. It is helpful also in stepped processes, such as a shopping cart checkout (often you'll see steps shown, such as "Choose Payment Method" and "Enter Shipping Address," with your current step indicated). This lets the user know what's coming next and how long the process is.

You can also use the concept for things like optional features, such as when you are uploading a photo to a site. You may just want to put the photo up and leave it at that. Or maybe you want to add a caption, or tag people in the photo, or edit the photo, or assign it to an album. Having all these options shown up-front can be overwhelming, particularly to the user who just wants to put a photo up right away, a better method would be to make the most commonly used options visible and then hide some of the less-often used features behind a tab or link called "Customize" or "Edit" or something similar.

If you are already in the user experience field, this is probably nothing new. But it seems a lot of clients are frequently unaware of or even fearful of the concept. "I have this great [product/event/etc.] with all these amazing features and aspects to it, I want people to get excited and know all about how awesome it is! Why wouldn't I tell them all about it as soon as I can?"

The answer is that it doesn't help you if you overwhelm or turn off your potential audience. The above quote comes from a perspective of what the company/organization wants, not what the customer does. What your customers probably want to do is figure out what they are interested in, and then learn more about it. (How would you feel if the moment you walked into a car dealership, the dealer gave you a stack of spec sheets and owner's manuals for every car on the lot before you'd even looked at one? Wouldn't you rather find some cars that interest you and then get ask for more information?)

On any given page of a website, ask what the purpose of the page is and why the visitor may be there. Is it a list of products? They are probably there because they are trying to decide or find a product they want. Provide just enough information to get them to a good match, and then on that product's page give them the full run-down.

There are a lot of adjacent concepts that are relevant as well. "Information scent" is the practice of making sure links are providing just enough information to make the user feel like they are on the right track. And the "paradox of choice" is a concept that it is typically much easier, and much more satisfying, to make a choice from among a handful of options than hundreds of options. You could show 512 choices on one page, or you could add a measly 2 clicks to the process by placing a couple hierarchical categoies of 8 options each, giving your customer a much happier path to their goal.

Don't be afraid that you are going to lose a customer by making them click a few times to find what they're looking for. In reality, you are creating an easier and more satisfying route to guide them.

Offer an answer before the question gets asked

2009-08-10T15:22:00.004-04:00

I'm going to give Bank of America a thumbs up and a thumbs down for two recent changes that raised my curiosity.

First, the positive. Bank of America (and a few other accounting/banking sites I've seen) seem to be switching to sign-in process that involves entering your username on one screen, and then your password on the next screen, rather than doing both at once. I don't know the research behind this, but my assumption is that this must be a more secure way of managing the login.

However, the first time I noticed that I wasn't being asked for a password, I got concerned. Did that mean that now someone only needed my username to access my account? It raised an alarm. However, right below the username field I noticed a link that said "Where do I enter my passcode?" Even without clicking the link, my concerns were relieved, because it was clear just by providing the link that I would, indeed, enter my passcode at some point to sign in. This is an example of smartly predicting a user's question and providing an answer without them having to ask. It saves the company time and money by reducing customer service requests, and it reinforces the user's confidence by being transparent and anticipating their questions.

Now the negative. I recently deposited a somewhat large check in my account. The pending deposit showed up immediately on my online banking. A few days later, however, a negative "deposit hold" for a slightly different amount appeared. Had it been the identical amount to my deposit I would have been less worried, but the fact that it was a different number, and that it was showing as a separate debit to my account rather than just a note on my original deposit, had me concerned that someone had somehow erroneously withdrawn that money from my account. There was no additional information, and even a search through customer support gave no explanation of a "deposit hold." I suspected things were probably fine and it was just an odd line-item while waiting for my deposit to clear, but to be sure I sent a message to customer service. They eventually confirmed that it was just a note until my deposit fully cleared and not to be worried.

However, they missed two key opportunities to provide information in advance, left a customer worried for a few hours, and ended up expending the time/cost involved in responding to an individual customer request. Had they included a clearer note with the "deposit hold," or even at least had an easily searchable answer in their customer support, they would have saved money and prevented any cause for concern.

I've seen similar examples of anticipating questions/concerns online, such as ING Direct adding a simple disclaimer to accompany a slight site redesign: "

Typical can be good

2009-06-29T11:55:00.002-04:00

Anyone working in a creative field will feel, from time to time, a little bored. It may feel like you've done the same thing before, and it feels like you're going through the motions. "This just feels so typical." So you try to shake things up by doing things differently, by starting from scratch, deliberately avoiding the way you've done things before.

That's good, right?

Well... not necessarily, particularly in web design.

While creative people may get bored, most people -- your consumers -- tend to resist change. Change is uncomfortable and unexpected. We operate on muscle memory a lot -- most web visitors know to click a logo for the home page. Most people know how tabs work. Most people understand a dropdown menu.

When you start changing those fundamentals, you're forcing people to learn something new, you're breaking well-entrenched habits, and you are putting your visitor in a position of unfamiliarity.

You can try to push past the typical in many aspects of design, just don't forget that the visitor is probably coming to your site to get something done, and they will accomplish that better if, at least at the interaction level, the design follows standards they are familiar with and have used before. Typical is often actually the best way to go.

The road sign metaphor

2009-04-13T22:25:00.004-04:00

I've mentioned before how I think road and highway signs are a really interesting example of usability in action -- they have to be extremely clear, concise, and informative, and it is literally a matter of life or death in some cases (consider a world without "stop" signs).

I've begun using them as a metaphor for web design in the hopes of making it easier for clients to get in the mindset of their site visitors. We'd all like to believe that people coming to our website are deeply interested in our materials and want to read everything we have to say about them. Unfortunately, it's much more accurate to think of your site visitors as ruthless hunters with non-existent attention spans who are scanning for relevant content rapidly, and are willing to toss you aside if they don't see what they want in 2-3 seconds (note, that 2-3 seconds is actually borne out in testing -- that's about how much time you have before someone hits the back button and leaves your site altogether if they don't see what they want).

So that's all well and good to get that in your head -- your visitors want everything fast and easy, and want to do as little reading as possible -- but I think you need to add a little more to the equation in order to figure out how to deliver that content.

That's where road signs come into play.

When you are driving down a highway at 65 MPH, it's generally not that hard to read road signs. They typically do simple things like list the name of a place with an arrow, or they indicate with symbols and short words whether there is food, gas, lodging, or other amenities available at this exit. A road sign wouldn't say "Turn right at the next exit if you're heading toward the greater metropolitan Toledo area, where we have a number of fine hotels and dining options for the whole family." It might simply say "Toledo" with an arrow, as well as "FOOD" and "LODGING" icons. Those thirty words have been boiled down to three words and an arrow. Was any valuable information really lost? And furthermore, if you were flying down the highway, would you have even gotten past the first few words before the sign was gone behind you?

This is a good way to think as you construct your site, particularly when it comes to navigation and basic site structure. You want to pick "content-heavy" words -- typically short words that clearly indicate the content they will lead to. And just as a signpost with 25 signs is going to be harder to parse than one with 5 signs, you want to keep the number of options to a minimum.

This is not to say that you should avoid writing sentences at all -- it's important to keep prose available, but make sure it's where it counts. You don't need to describe in detail how great your parking garage is, but you do need to provide directions that tell you how to get there. Conversely, if someone is trying to pick your next book to buy online, a simple title, author, star rating, and genre is not going to be enough -- a brief prose description of the plot, potentially with quotes from reviewers, is probably going to do a lot more to sell the book than just providing the bare bones. That said, providing a quick look at the genre and rating information on a previous page may be all you need in terms of navigation to get that visitor to the full product page.

If you're not sure how to set up the text and navigation for your site, it may be helpful to stop and thinking of your visitor cruising down the freeway, looking for a particular destination. What would they be able to quickly read on a road sign that would make them turn in your direction?

One great logo

2009-03-11T11:49:00.004-04:00

This is apparently a few months old, but I just spotted it for the first time this past week. Boston has long struggled to make the Downtown Crossing area into a nicer shopping area/pedestrian mall, and their efforts have largely been met with a "meh."

If this logo is any indication, they are moving in the right direction. I generally think overly clever logos with overlapping words just end up looking confusing and overwrought, but in this instance the words overlap brilliantly and the T-as-cross really fits perfectly with the "Crossing" aspect.

I haven't been this impressed by a logo in a long time!

Pointless "innovation" (the new iPod Shuffle)

2009-03-11T11:04:00.002-04:00

Before I began this blog, I attempted a different style of blogging elsewhere that was intended to focus more on good/bad examples of design. My first example of good design was the iPod Shuffle. The multi-colored clip-on items were only a little bigger than a postage stamp and I loved them. They were perfect for the gym, or if I wanted to ride the subway in town for a night out without having to stuff my pockets with an iPod.

Today Apple announced the new version of the Shuffle. It is not all that drastic a change, and there are some new features I like, such as the ability to hear the song/artist name spoken to you while listening and the addition of controls to the headphones.

But most of the other changes seem either pointless or actually negative.

The Shuffle is now even physically smaller than before -- but was anyone even asking for this? The previous Shuffle was tiny as it was -- it weighed less than an ounce already. I can see the benefit in reducing weight with slightly larger objects, even something as small as a cell phone can benefit from being a few ounces lighter. But when you are changing something to be tenths of an ounce lighter, will anyone care?
There are now no buttons on the Shuffle itself. The idea of adding inline buttons to the earphones is great -- but making that the ONLY way to interact with the device is a mistake. You are now requiring your audience to use only specially designed earphones with the device.
The size of the storage has increased to 4GB. There really isn't any harm in adding more storage, but for many people the 1GB (or 2GB) was probably sufficient. And the new 4GB is over 60% more expensive than the old 1GB. Is that price increase worth a memory jump that many may not need? For now, the old 1GB version is still available, but it will undoubtedly be phased out.
This is purely cosmetic, but -- why only silver/dark gray options for colors? Apple has an affection for clean lines, which I love, but when your object is about half the size of your pinky finger with no buttons or interface on most of the surface, you risk going from "sleek" to "lifeless." A little color would at least allow some personality.

I have to wonder, why did Apple bother? The voice reading of tracks was a very nice touch, but otherwise there is little innovative here. In terms of convenience, the size of the Shuffle was no longer an issue. The area probably most asking for innovation is the headphones now -- wires still get tangled, they are aesthetically unpleasing sometimes, and can get caught on things. Why not focus their innovative efforts on something like making wireless earphones standard? And if that is a difficult goal, why even bother at all with tweaking something that was already extremely effective as is?

Trust and faith in design

2009-03-10T10:09:00.003-04:00

It's a cliche to make fun of older generations and their discomfort with technology, but that stereotypical technophobia is really just an extreme version of something all of us probably feel at some point or another: a lack of trust and faith in the system we are using.

What does this button do?
I remember having someone ask me, "What do I do to submit the form? Do I press the submit button?" The answer, to most of us, is "yes, duh." But what if the question is less clear? Navigational terms don't match what you thought you'd find. Something you thought was a free trial asks for your credit card and doesn't explain why. A link that seemed obvious takes you to a completely unexpected page or site. In each case, the design is playing fast and loose with the user's trust and faith, and as a result, is probably failing the user's needs.

Anticipate the next step
Good design anticipates what the user will want. On your homepage, offer links to the things your visitors most likely will want. Look at the search terms people use to find things on your site, and make sure your navigational terms match them. Whenever you ask a user for information, explain why you want it and how it will be used.

Explain yourself
One place that I frequently see abused is the "contact us" page -- many sites will ask for name, address, phone number, email, sometimes even fax number and company, and in worst-case scenarios, they'll even tack on some "survey" type questions -- even if all you wanted to do was maybe email them to ask about the release date of an upcoming product. In that scenario, literally the only piece of information the company actually needs is your email address. So why ask for the moon? Is it because your designer just used a "contact us" template and didn't really think about what that means for the user? Is it because you are adding me to a database you are going to sell to third parties? And even if all you do ask for is my email address, will you start sending me unwanted email newsletters without asking? Tell the user up front, and let them make the informed decision. (Even better, in this scenario, you could save the user and yourself time by having just clearly listed the product release date on your site in the first place.)

Expect questions, and provide answers
One thing I try to do when starting any project is just write down a list of questions I think a user/visitor may have, based on the type of site/product and the customer base. I try not to get overly specific but the questions should not just be the broad ones either -- for example, on a shoe site, I wouldn't write out questions about a particular pair of shoes, but I might write out questions about broader types of shoes, or questions that might apply to any individual pair of shoes.

Prioritize and group logically
From there, I try to group the questions logically, and see if they align to particular terms. If possible, prioritize the questions as well, and make it easier to find the answers to those more essential questions. This is also where some statistical data can come in handy -- search terms used, frequency of visits to particular areas of a site, volume of support emails/calls about particular topics. Maybe half the visitors to your site are just trying to find your address, and already know all about your product/service. You could have a beautiful, highly usable presentation of your product line, but if that address is hard to find, you are failing half your audience from the start.

I've found that structuring a website around this is a good way to meet user's needs, and a lot of this work can inform other decisions down the line, and make it easier to work in changes/new ideas -- just follow a mini-version of these steps (asking questions, grouping them, working out logical answers) and see if your architecture already accommodates these changes or if you need to restructure.

By anticipating everything the user will want, and providing easy answers to key questions and presenting them at logical points, you build that trust and faith. You're more likely to have a happy customer, and you reduce anxiety.

Usability Case Study: Comcast

2009-03-04T09:56:00.005-05:00

I've heard a lot of horror stories about Comcast -- terrible customer service, too expensive, half-assed installations that sometimes end up destroying walls -- but when I moved this past weekend into a new apartment in Boston, I had to say goodbye to RCN and sign up with Comcast.

I try to keep an open mind, so I was willing to let the bad stories I'd heard recede, and look at my Comcast experience with out prejudging. Some of the experience was bad, some was good. Overall, for Comcast, this can serve as a case study in how they could improve their sign up process.

1. Signing up online
The first thing I did was visit the Comcast website and try to put together the package I wanted. We needed cable and internet, but no phone, and they did have a bundle for those two things. But they only had ONE bundle -- oddly enough, with the most basic cable offering they have, which excluded a few too many channels for my liking. When I tried to build my own bundle with the next level of cable, any bundle savings were erased, and there was no option to upgrade the basic bundle. Here I was, a customer wanting to spend MORE than the basic bundle offered, but the online system offered no way to do this. I gave up.
Verdict: FAIL
How to fix it: System should genuinely show all options, and make it easier to customize your package.

2. Signing up by phone automated prompts
Defeated by their website, I decided to just call to set it up. The very first thing that comes up in their automated prompt is "Enter the phone number where you would like service." This is a problem on many levels. First, Comcast offers phone service, so you could conceivably NOT have a phone number yet for the place you want to have it installed. Second, and here's what applies in my case, I am a cell-only person and do not have or want a landline. So the place where I want service has no phone number. Hoping to get to a prompt that makes more sense, I hit #. It asks me for my number again, and I hit # again hoping I'll get an operator or something. Instead it reads me back the phone number of the line I am calling on, assuming it is where I want service. Since I am calling from a landline at work, this is definitely not the number I want, so I hit a series of other buttons hoping to get out of installing cable at my workplace. Eventually, I somehow get a live person.
Verdict: FAIL
How to fix it: I suspect this may be the case, but a simple change in language could go the distance -- "Enter the phone number you would like to use for your contact information. If you are ordering phone service as part of your package, press *." This addresses both problem scenarios -- you don't have a landline, or you are adding a new landline.

3. Signing up by phone with a representative
Once I finally got a representative, which didn't take very long (no 30 minute wait for me), the process actually went quite smoothly. The man was helpful, understood exactly what I was asking for, explained the pricing and the promotional period, set up installation, it was a breeze. The only thing I realized after the call was that he had never taken my email address, which would've been nice so I could've gotten some email confirmation. But, not a big deal.
Verdict: SUCCESS

4. Installation
The installation was supposed to happen between 11am-1pm, and just as scheduled they showed up just after 11am, even though there was a huge snowstorm. They installed everything quickly, and were very nice -- they even took my roommate's old cable box with them to save him the return hassle.
Verdict: SUCCESS

5. Setting up internet
The one thing I had to set up on my own was the internet. They brought the modem but I had to activate it. Which would've been a breeze, except the first thing the system asks for is your account number. Since I had never been asked for my email address, I had no email record with that information. I looked through the documents the installers brought, and nothing had any personalized information -- no account number there either. I had never been given my account number! And the prompts offered no "don't have your account number?" prompt like many online services offer for people in my shoes. I had to call to get it, and this time I did have to wait about 10+ minutes on the phone to get a representative. Fortunately they gave me my number quickly, and then I was able to complete the setup.
Verdict: MIXED
How to fix it: Installation should come with some sort of confirmation sheet or other personalized document including your account number. But ideally, the internet activation should offer a "don't have your account number?" link that lets you enter in other information (SSN, phone number, address, etc.).

6. Ordering TiVo service on the website
Once I got everything set up, I tried to hook up my old TiVo box and realized that my new fancy HD setup did not work with my old school TiVo -- and the TiVo couldn't even communicate with the cable box to change channels, making it useless completely. I had seen billboards around town advertising that Comcast had partnered with TiVo to offer that service. Since I hate typical cable DVRs, I thought this would be a great alternative. I go online to the Comcast TiVo site, and it asks me for my zip code to check availability. Success! It is available locally (which makes sense, given the billboards). Now it's redirecting me to the order page, and... "This package or service is no longer available." What? In fact I can't find anything on the site to actually order the service. Which I know they are offering.
Verdict: FAIL
How to fix it: See #1. Don't tell me you have a service and then don't let me sign up for it. Get your system up to date, Comcast! Furthermore, include pricing information up front -- the page for TiVo did not include this.

7. Ordering TiVo via live chat
Just to try one more avenue of communication, I decide to use the live chat function rather than waiting on hold for a phone representative. No one is immediately available on the chat, but it does tell me what number I am in the queue, which is nice. It takes about 5-10 minutes for someone to show up, but since I am online I am able to do other things so I don't mind the wait. The representative is very helpful, answers my questions quickly, and I am surprised to learn that to get TiVo HD I do not need to buy a box or even pay an expensive initial setup fee, and the monthly fee is actually less than I was paying on my old TiVo. A pleasant surprise. The installation is set up quickly, and I'm done.
Verdict: SUCCESS

Overall, I was impressed by the actual human interactions -- people were friendly, and although not every phone call/live chat was answered immediately, the waits weren't too terrible. As for the website, it proved almost completely useless. It did not show all the options available, and in the case of TiVo, didn't even show the service at all. Even worse was the automated phone system, which started of on such a wrong footing that I got worried I was going to accidentally set up something at the complete wrong location.

Now I am not someone who hates using websites and automated phone systems to complete transactions -- in fact I prefer it greatly. If I can set something up without having to talk to someone, I am happy, as it saves me time and I can do it whenever I want. And, as far as I know, it greatly reduces the cost to the company. One client I worked with once mentioned that it cost them $14 per call due to the costs of maintaining that system and paying for call representatives. It would be to Comcast's extreme benefit to improve their system. And considering they are a company offering internet service, it speaks quite poorly of them that they cannot even offer a successful online interface.

Now let's just see how billing goes...

The economy and usability fail each other... again.

2009-02-13T17:07:00.005-05:00

In this story from CNN about the economic stimulus bill, there is a quote from a Republican which has a lot of validity to it:

Some representatives expressed frustration over how little time they had to read the 1,000-plus page bill.

"You can't be serious. This would be humorous if it wasn't so sad," said Rep. Tom Price, R-Georgia. "What's in it? Have you read it?"

I blogged before about how usability could improve the mortgage process, and I think it could stand to do a lot to improve how bills are handled as well. No doubt the fine print of bills are necessary, but, at some point you have to be realistic. No one has time to read 1,000 page bills. It would take, probably quite literally, a few days straight of reading to get through it, let alone fully digest and understand it.

And furthermore, it reduces transparency -- we do operate in a representative government where we don't expect average citizens to have the time (or inclination) to know everything about every bill, law, and regulation -- but sometimes it would be nice to know exactly what our reps are doing.

So why not have a straight up bulleted list up front of all the items contained within? It could look as simple as this, or even break down each section a little further:

$12 billion for street repairs (p. 193-195)
$27 billion for environmentally friendly fuels (p. 344-350)
$19 billion for school construction (p. 507-524)
And so on...

Of course, that may oversimplify things, but if you're fairly certain you're on board with street repairs, but not so sure about environmentally friendly fuels, you can focus on reading the fuels section.

This isn't about being too lazy to read, it's about realistically improving the decision-making process. Big long documents shouldn't be impressive -- clearly written and easy-to-understand documents should. If you have to have the former, the least you can do is provide the option of the latter.

(Note: I'm not making any commentary on whether or not I agree with the Republicans' stance on the stimulus bill, but I am more than willing to highlight a valid point!)

Beware the permanent brainstorm

2009-02-05T19:41:00.004-05:00

There is a particular type of person out there who is very creative, who loves to come up with new ideas, who gets excited about a new concept they think could be really successful or beneficial. These people are vital -- without them, many (if not all) of the big ideas that have changed our lives would never have happened.

But there is one flaw that often comes hand-in-hand with this level of creativity and brainstorming. For every Steve Jobs (Apple), Bill Gates (Microsoft), and Mark Zuckerberg (Facebook), there is that friend you have who is convinced that adding zipper pockets to suspenders is the next big thing. Or maybe that was last week, and now they're pitching tiny umbrellas for cellphones. In any case, their mind seems to always be working, but never carrying through the thoughts to something that is not only a great idea, but one that they can (and do) actually implement. I call this the danger of the "permanent brainstorm."

Those examples are extreme, but I believe there can be a real danger to focusing so much on the brainstorming and "ideating" portion of a project that you never get off the ground and develop something real.

For a more grounded example, consider a project where a company wants to come up with a new marketing website. All they know at first is that they want to target a new audience that they don't currently speak to. The brainstorming phase begins, and the team narrows it down to one particular concept.

This could go two ways -- the team could further focus in, delineate their ideas, and develop them into a site and get it live.

Or they could just keep brainstorming. What if we broaden it to include this other audience as well? What if we focus more on the interactive games? What if we switch from an edgy/rough look to a clean/modern look? And then after trying all those alternatives, they keep spinning around to other ideas. A hot new competitor site shows up halfway through the project, and they want to take some of the competitor's ideas and re-think the original goal.

You get the picture. The ideas keep coming, the project keeps changing, people second-guess their original ideas and the whole thing continues to mutate and shift even as it's supposed to be nearing its completion. The budget has swelled, the timeline has been shot, and corners are being cut that could make the difference between something great and simple and something overly ambitious and complicated.

Of course, this is not to say that brainstorming is bad - as I mentioned before, it's the brainstormers who come up with all the big new ideas. The key is knowing when to shift away from generating more ideas and shift toward refining and implementing your original idea. It can be scary sometimes to do this, but it's all about putting a stake in the ground and saying "this phase is done, we need to move on to the next phase, or else we're going to get stuck."

That can be a hard thing to do. Nobody likes the idea of setting something in stone when they are anything less than 100% sure of it -- and rarely is any new idea a 100% bet. But this is where handy metaphors and sayings run short -- unless you are engraving tombstones, you're not literally setting things in stone. You can make changes later on if need be -- it's just important to respect that those changes should be based on fully reasoned thinking, not whims, or a dream you had last night, or what your 5 year old said when he saw a mock-up of the project.

Be excited. Think wildly. But recognize that as part of any project, brainstorming is just step one. It takes a lot of work to turn a good idea into a good product, and you'll never get to a successful end if you never leave step one.

michaelhisten.com 3.0

2009-02-02T15:07:00.003-05:00

It wasn't that long ago that I did a redesign of my portfolio website, www.michaelhisten.com. It was not a very dramatic change, it mostly focused on enhancing the content and involved adding my beloved color switcher. But as I started writing more in this blog, I realized I wasn't listening to a lot of my own advice when it came to my own site.

I was concerned about a few things -- one, the level of simplicity of the old site was so extreme that I was worried people would assume that's all I could do. To make up for that, I've ditched the "no graphics" concept and used some imagery and gradients, including using the font FD Helwoodica, an all-lowercase distressed take on my favorite font, Helvetica.

But perhaps my biggest issue with my site was that I was falling victim to that perennial trap -- thinking my content was more interesting than it was. Some site statistics bore this out, but basically, people didn't bother reading much of any of the content pages and just went straight for the portfolio section. To top it off, my portfolio examples did not have thumbnail imagery to give you a preview until you clicked on the name of a project. This, combined with some research into how other designers out there are presenting their profiles, led me to embrace the idea of a one-page website.

Yup, just one page, there's nothing more than what you see when you land there. Of course, clicking thumbnails gives you larger views (much larger than before -- more than twice as large, in fact) of each project, but now all those projects are front and center. I think the end result is that people will get a quick glimpse of what I can do, and they can then read a little bit in the area at the bottom of the page, and then I encourage them to contact me for more. If they want to read more about me and my design philosophy, the blog is right here. All in all, I'm very happy with the update.

Oh, and that color switcher is still there -- I still love the idea of giving visitors a little interactivity!

"In a perfect world..."

2009-01-21T15:01:00.000-05:00

Most design agencies are structured into silos, with people specialized in different aspects of the design and management. I wrote about some of the problems this can create in an earlier post, but there's another aspect to specialization: we expect people in later stages of the process to be able to fully realize the ideas we have as designers earlier on in the process.

I have seen too many times an idea get implemented either without the interaction/design fully realized, or just plain implemented wrong. The results are almost always disappointing, and sometimes that seemingly small difference between well-polished and rough-around-the-edges is the difference between easy and frustrating. A poorly-implemented great idea is often worse than a well-implemented mediocre idea.

This is a tough situation to deal with, because often you won't know if the idea fails in implementation until it has actually been implemented, and at that point it may be too late to try an alternate approach. And even if you know it is risky, sometimes it is worth the risk. My best suggestions?

Make a sample version/functional prototype
Try to create a mini version of your big idea. Problems may rear their head that you didn't expect, while things you expected to be difficult may work out smoothly after all. In either case, it should tell you if it is worth exploring further or abandoning.

Do it yourself
You can't always do this in a large agency (in fact, you probably rarely can), but one of the benefits of working small or being an all-in-one freelancer is that you know fully the skills and knowledge of every one at every step -- because it might be you in every role. You may not know every single aspect of how to create something in advance, but it's important that you at least know how to learn everything needed, and that you can do it within the scope of your project.

Have a well-thought-out Plan B
Sometimes your Plan B may just be an earlier brainstorm that wasn't fully realized, but just as you should design for user failure, you should design for designer failure too. Unexpected obstacles are common, and the more ready you are with an alternate approach, the more likely your end result will be successful. Trying to patch up a sinking ship that has been battered and bruised may be a mistake -- sometimes you just need to scratch that ship and build another one. If you've got the blueprints for the second ship available already, you'll have a head start.

I've half-joked before that I want to become a "reality consultant" -- someone who can look at all the big ideas and plans and offer some cold hard reality about what is or isn't achievable, what will be simple or difficult, and ultimately where energy should be spent to really ensure something good in the end. But until that is a real job, we can all be our own reality consultants and be ready to adapt if our "perfect world" vision doesn't come to fruition.

Predicting the future

2009-01-14T01:12:00.000-05:00

Recently I've been reading or watching a few different older sci-fi works, and I'm particularly intrigued by how they believed the future would be, and how wrong they frequently were.

Paper
In Philip K. Dick's "Do Androids Dream of Electric Sheep" (1968), there are numerous references to carbon papers and onionskins -- in fact I don't think there is any reference to anything resembling a modern computer with an interface. And yet in this same book, which is the inspiration for "Blade Runner," there are androids that are so nearly identical to humans as to require bone marrow samples to determine if they are human or real. He was able to envision a future with complicated thinking robots, but not a future in which something more permanent and flexible than paper existed. (Obviously paper is still used, but could you imagine if the entire record of a criminal only existed on a photocopy somewhere, and not digitally stored?)

Televisions
Watching "Aliens" (1986) and the later, rarely remembered TV series "Earth 2" (1994-95), I am struck by how they both failed to foresee the death of the old cathode-ray monitor. Thin LCD and plasma screens have already well outpaced old-school TVs, and new OLED screens are so thin as to be pliable. It's also interesting to see how whenever "static" or a weak signal is depicted, it is shown through the screen turning fuzzy or lines running across the screen, as one might experience with a weak antenna. Well, as anyone with digital cable or even online video watchers may know, when you get a crappy video, you see pixellation and possibly missed frames.

Gadgetry
Whether it's the phone in "Aliens" (dialing via sticking a plastic card into a slot) or the VR "gear" in "Earth 2" (a bulky headset with awkwardly swinging eyepieces), a lot of sci-fi failed to predict things like Bluetooth (which is little more than an earbud) or even simple speed-dialing. And interestingly, nearly every piece of sci-fi seems to have thought that video-phones would be the way of the future. Well, the technology has been around for quite some time, and it just never took off. Why? Because we multitask, and if we're talking on the phone, there really is no need to also see the person. We might be doing the dishes or driving or doing some other task. We just don't really need or want that most of the time.

So what are we getting wrong now?
There are undoubtedly a number of things that will begin to look foolishly short-sighted in our current predictions of the future. I think of the standard keyboard and wonder if that will die -- will we continue typing this way at all? Will "typing" even exist as communication? I'm willing to bet that we'll soon be seeing more and more examples of mind-controlled interfaces. I'm not talking anything magic here, but just complicated systems of interpreting electrical impulses in the brain. This may not be any time soon, but when you set something far in the future, it's worth considering.

There's also something I've been reading about lately -- devices that are essentially real "transformers" -- objects that can become other objects. Essentially a collection of "nano-machines" that can rebuild themselves based on the user's need. I don't know the limitations of this, but it wouldn't surprise me to start seeing self-reconstructing devices within the next 20 years.

But, hey, in the 1960s they all thought we'd be taking rockets to the moon for vacation by now. And boy were they wrong.

How things become "Things"

2008-12-29T10:59:00.000-05:00

I don't know quite what to call them but I am fascinated by "unintended special events." That's a horrible term, but I'm referring to things that became "Things" accidentally. This is hard to explain so I'll just start giving some examples.

Black Friday
The first day after Thanksgiving has long been deemed "black Friday" by retailers (which means black as in, "in the black" -- making profit). But there was never some universal decision to make this a special day. I can't give a particularly knowledgeable history here but my best guess is that this became "black Friday" completely by accident. Over the years, as a consumer focus on Christmas shopping became more prevalent, I think we as a society moved more and more toward a "holiday to holiday" mindset. The stores stock items relevant to Halloween, Thanksgiving, and Christmas in successive order, and the combination of Thanksgiving being over and most people having that Friday off from work turned that day into an ideal shopping day. Retailers capitalized on this, creating special sales, and the process fed on itself until the day became a shopping event. This year it got particularly crazy with one person at a Wal-Mart trampled to death and gunfire at a Toys 'R' Us. But when it comes down to it, there is no particular reason for this to be a special event. It is a byproduct of the holiday calendar and consumer marketing.

Superbowl Ads
By most standards, TV commercials are an annoyance -- they're something we put up with because they fund the networks that provide us with hours of (ostensible) entertainment. But now watching the Superbowl specifically for the commercials has become a national pastime. Much like Black Friday, this was an event that fed upon itself. Knowing the huge audience for the Superbowl, and the limited attention spans of viewers, companies put more and more effort into making their Superbowl ads stand out. As the audience got wise to this, they became more discerning, comparing the ads against each other, turning the event into the competition for the best Superbowl ad of the year. The free press (and today, re-viewing on sites like YouTube) often make the multi-million dollar investments for 30 seconds of airtime into cultural touchstones. Today, some people who don't even care about the Superbowl itself still watch just to see the ads -- something virtually no other program can lay claim to.

Red Carpet Fashion
The purpose of awards shows like the Oscars is to, well, give awards to the best films (or music, or TV, etc.) of the year, and to drum up some publicity and ticket sales in the process. But it was never the stated intent of such shows to promote fashion. But as more and more stars took the opportunity to look their best on Oscar day, the reporters on the red carpet in turn paid more notice to their clothes, and now many networks and publications give their own awards for "best dressed." Joan Rivers in particular has made "who are you wearing?" a key question on the red carpet. (It's worth noting that the term "red carpet" itself is a thing-turned-"Thing" -- it was only through the repeated use of red carpets on the walkways into awards halls that it came to be synonymous with awards shows and premieres.)

There are certainly more examples, but I love thinking about how these unexpected turns happen. There are a ton on the internet alone -- LOLspeak, viral marketing -- and I think it's important to distinguish this from "memes," which are brief trends that everyone knows about for a few months but soon die away. I may post a part 2 soon but I like being reminded that no matter how shrewd a marketer or advertiser may think he/she is, ultimately the biggest trends occur through a series of unplannable accidents.

More on the overlap of politics and usability

2008-12-19T15:02:00.001-05:00

In my last entry I mentioned how I feared getting too political. But despite that fear I'm going to soldier on. I've become borderline obsessed with the economy, and various approaches to handling it, and have constantly been thinking about the decisions I would think best were I in a position of power.

Full disclosure -- I have considered myself most closely connected to libertarianism, as I like the concept that we really should be free to do what we want without government intervention. But, and here's where usability kicks in -- we don't always *know* everything necessary to make the best choices.

There seems to be two sides to this -- either you say that it is up to you to educate yourself, and a bad choice is your own fault, but you are free to make it, or you say that people should be prevented from making such bad choices through regulation and laws that take bad options off the table.

I've come to appreciate the concept of "soft paternalism" or "libertarian paternalism," which basically says, you are free to make whatever choice you want, but we are going to try our best to steer you in the right direction.

This is almost the essence of usability in a nutshell. Make it easy for people to make choices that will satisfy them. Emphasize the most common or most logical paths but provide alternate routes to get to other options if someone knows specifically what they already want. The wikipedia article I link above has a great description, with specific reference to "defaults" -- a concept that usability expert Jakob Nielsen has written about, stressing the importance of setting defaults wisely so they are set to the most likely beneficial setting.

Compare the two. Wikipedia, giving the example of setting your retirement contribution from your paycheck (emphasis mine in both quotes):

The asymmetry of soft paternalism can be seen in the case of a policy which raises default rates. Those who are making an informed deliberate choice to put aside zero percent of their income in tax deferred savings still have this option, but those who were not saving simply out of inertia or due to procrastination are helped by higher default contribution rates.

Now read Jakob Nielsen:

Users rely on defaults in many other areas of user interface design. For example, they rarely utilize fancy customization features, making it important to optimize the default user experience, since that's what most users stick to. ... By educating and guiding users, default values help reduce errors. It's therefore important to select helpful defaults, rather than those based on the first letter of the alphabet or whatever the first option on your original list happened to be.

Imagine for a moment that at all aspects of our lives, rather than starting from "zero" on any new thing, we started anything by being told right off the bat what the most common or most beneficial starting place was, but were given the option to change that in any way we see fit. Smart businesses already apply this in many areas, essentially putting Nielsen's usability advice in effect. But I think the applications of such a concept are much more far-reaching.

I don't know that this means that "soft paternalism" and "good usability" are identical, or that the concepts therein can be applied universally, but I was struck at the similarities between the two. At the very least, it shows that you can successfully apply similar philosophies to different disciplines.

Could better usability save the economy?

2008-11-26T10:15:00.001-05:00

Okay, maybe that headline is an overstatement, but I'd say usability is an overlooked component in saving the economy. Like any American who pays attention to current events, the economic downturn is at the forefront of my mind right now. And there is one area that has troubled me quite a bit -- the whole mortgage meltdown.

There are kind of two sides to the mortgage problem (ignoring for a moment the whole "credit swaps" thing -- which is a pretty big piece to ignore but just roll with me here): there are the individuals who bought homes they could not afford, and there are the lenders who signed off on mortgages they likely knew the buyer could not afford to repay.

Much has been made of the "predatory lenders" -- the system is set up such that a lot of the places granting the initial mortgages get a few years of high (or all) interest payments before passing the mortgage off to some larger firm for the remainder and letting them deal with the fallout of potential foreclosure. Ultimately, the initial lenders don't really care about whether or not the lendee can pay it all back -- they just want that initial burst of nearly pure-profit payments.

But what bothers me about this attack on "predatory lenders" is that pretty much any business out there seeks to increase profit, so why pick on lenders? It seems to be to be attaching some moral expectation to something that is amoral (not immoral, mind you). Paying for goods and services is a mutual exchange where each side gets something they want.

The consumer-minded side says this is unfair, but I think it's risky to remove any responsibility from the individual. If you sign a contract that requires you to pay a certain amount of money, it's ultimately your own fault if you end up unable to hold up your end of the bargain. Really, a foreclosure is the fault of the homeowner, not the lender -- even if the lender suspected you wouldn't be able to pay it back, if you have stated that you can and will pay things back, you're the one who's made the promise you can't keep.

Where this all breaks down is that not every lender is going to be explicit in terms of costs, not every homeowner is going to know to check all the fine print, and those two problems can feed off each other into a pretty dangerous spiral.

This is where usability comes into play. One of the tenets of good usability is that you don't blame the "user" if they have a problem. Even if everything to accomplish a task is there, if your users are failing to do it, then you have a problem with the presentation. You don't just say your users are stupid (because then you're both insulting your customers and losing business), you try to adjust things to make it clearer and easier to understand.

I am not familiar with the rules and regulations around signing a mortgage, but I am virtually certain the amount of paperwork involved would be confusing to even the savviest person. From a usability perspective, it's a nightmare. I have no doubt that people have signed contracts not realizing that the initial $800 a month payment is going to balloon to $2000, or that the total they pay for a $300,000 home is actually going to be something like a million dollars.

Imagine for a moment that regulations required that all major contracts have a one-page cover sheet that included clearly the monthly payment, how the monthly payment may change over time, the breakdown of interest and principal, and the total amount to be eventually paid. All of this in nice big fonts with a clear layout that is easy to read.

I fear getting too political in this blog, but I can't help but think that so many of the problems in our current economic crisis boil down to people making decisions without knowing all the information. And while many people think that the problem was a lack of regulating the kinds of decisions that could be made, I would say that the greater problem was not requiring full disclosure and clarity be provided before anyone makes any major transaction. Whether that is a potential homeowner or a potential investor, if there was a requirement of a crystal clear one-sheet explanation of the pending transaction in layman's terms, you may find fewer questionable decisions being made in the first place.

As an analogy, New York City recently began requiring chain restaurants to print calorie information next to meals. The caloric totals shocked people (some salads have more calories than a burger and fries!?), but those trying to eat healthy had full information at their disposal rather than uninformed guessing. Compare this regulation to some alternative legislation that may have required that restaurants stop serving high calorie dishes altogether. The former regulation puts the onus on the individual, but provides them with full disclosure in a clear manner. The other is the government deciding what's good for you, expecting that you won't make the good decision for yourself and taking options off the table. I'm sure some people would still prefer the latter, but I really think that letting people make their own choice, for good or bad, is better than trying to make it for them -- just make sure they know the consequences of their choices.

Usability is ultimately about providng clear information. If we can manage that, and let people make fully informed decisions, we can encourage responsibility without removing choice.

So I got an iPhone

2008-11-15T15:54:00.001-05:00

I'm not really a gadget-head. As a diehard skeptic of, well, everything, I typically meet any new gadget with the question "why would I need this?" And usually there is no compelling reason.

But after spending months with a phone that repeatedly shut itself off upwards of ten times a day, sometimes mid-phone call, I was ready to switch, and decided to just go ahead and plunk down the dollars for an iPhone. I'm so happy I did.

I knew that it would combine my phone and MP3 player into one device, which I liked. I also knew it'd allow a few more things, namely web browsing. But I didn't realize the extent to which its app store would make the device an all-in-one EVERYTHING. I can play video games, control my desktop from the phone, update my Facebook status, listen to radio stations... it's pretty cool. (I should note, for the record, that lest this read like an Apple ad I am sure that similar smartphones like the G1 and Blackberry Storm are capable of doing many of these things as well.)

But as I was browsing reviews for good apps and downloading them on my laptop, it struck me as odd that I still have to actually attach a wire from the laptop to the iPhone. A minor problem, really, but it got me thinking about the future of computing and the whole concept of syncing. We are moving further and further away from a hard-coded "this machine does this" mindset to a software-driven wireless world where you can do anything from anywhere from any machine. We've already moved past some of the typical physical limitations of the world -- I haven't bought a CD in 2 years for example, yet have bought tons of music. Virtually every piece of software people get these days no longer requires a box with a disc in it, and can be just downloaded online. And as hardware limitations decrease to the point where, in all likelihood, we are just a few years away from pretty much every new computer can do pretty much everything, the actual machines we're on may reach a point of irrelevance as well. Imagine going up to any computer anywhere, logging in with some password, and having all of the same data and programs available to you anywhere. Services like this already exist, but this is by no means universal.

We're going to just all have our own "clouds" at some point soon. An amalgamam of files, programs, software, data, etc. that requires no physical anything except for the data storage facilities of the providers.

Not to get all sci-fi on you, but this basically means there will be two versions of any of us. The physical being, and the data identity. Some people find that scary, I find it fascinating.

And to me the most interesting part of all of this is that it happens so quickly and seamlessly. Just imagine ten years ago, the whole concept of your whole world reachable by one device in your pocket was probably hard to fathom. But it has happened, and is getting more dramatically omnipresent every day.

Which is just. So. Cool.

Designing for failure

2008-11-10T10:39:00.000-05:00

It only takes going through a handful of creative projects to realize that virtually every tiny thing is done purposefully. Very little happens by accident, and because of this, one of my mini-pastimes is looking at common designs and trying to figure out how they came to be (or, in contrast, why antiquated designs went out of style). Last night I was pondering how the anthropomorphizing of food -- a smiley face on a popcorn box or a cup of soda -- became a successful marketing technique. And I've been wondering for months about the process that led to the creation of traffic signs -- perhaps the most vital instance of usability in action, as a failure to communicate properly could be fatal.

But I'd like to focus right now on the concept of designing for failure. Of course, an ideal system would make it virtually impossible for someone to fail, but even the most simplistic and clear designs are going to stump a few people, and sometimes failure can occur due to other complexities in the system. My shining example? Copy machines.

(Okay I know that's not a copy machine but at least it involves a cat.)

Jams in the copy machine are obscenely commonplace, as anyone who has worked in an office knows, and they can be extremely frustrating. But they're unavoidable; the mechanics of these machines are so complex that the smallest problems can trigger a jam. I imagine that early copying machines broke down so frequently that calling for a repairman became an untenable situation, and the "fix it yourself" process for un-jamming a copier became a standard for the industry. You know the drill, open the side of the machine, pull out tray 3a, take out the jammed paper from some spinny thingy labeled 5c, etc. It's annoying, but it usually works, and you can get back to copying. The time and cost savings of not having to call a repairman is well worth the minor inconvenience of having to fix it yourself.

This same concept can be applied to just about any design, including a website. You can have what you think is the most sensible site structure and design possible, with a big clearly labeled button for some key task, only to find that sometimes your visitors just miss it entirely or click the wrong thing or otherwise end up lost and confused.

The keys to anticipating error involve eliminating opportunities to make a mistake (ahem), and offering alternative paths to get to the desired result if the visitor misses or doesn't understand the primary path. While a lot of web visitors will resort to the back button and try again, you have to remember that the back button may be taking them off your site altogether. For example, let's say they search on Google for something in your industry and use the word "compare" -- this may take them to a page on your site which compares your various products. But if the visitor was looking for comparisons across a variety of brands, rather than just within one brand, the page won't be what they want, and they may end up at another site altogether. But if you have a prominent link that says "Compare to the Competition," well they just may click on that and stay with you on your site.

Other suggestions to keep visitors on the right path: use logical naming conventions (e.g., "About Us" is much more intuitive than something like "Our Way of Thinking"), provide alternative paths (e.g., include a search option, and highlight relevant contextual links on key pages, etc.), and remove anything that does not hold a lot of value to the user (a page full of marketing copy may show up high on search results but will likely not actually provide the hard info the user is looking for).

Plan for the copy jam. If you do, your visitor will be able to get back on track to find what they want rather than abandoning you entirely.

A handful of basics

2008-11-03T16:09:00.000-05:00

There are some rules of thumb ("heuristics" for you fancy types) for designing with usability in mind that are helpful to remember. These are some of the things I try to keep in mind:

People don't read
They really don't. Sure, they'll read your blog if it's a topic that interests them, but on your marketing site, keep your text concise and support it with other visual clarity. People love to look at imagery and photos, but they will only scan snippets of your text until they find the one thing that interests them.
Make your text readable
When your visitors do read, they want it to be easy. Use medium-to-large fonts, use high contrast (no light gray on white, please), and don't use jarring color combinations, like red text on a bright green background. Also, avoid caps - we read based not just on letters but on shapes too, and all-caps denies us this.
Don't use "splash" pages on websites
Hoo boy is this a big one. No one, I repeat no one, wants to watch your fancy flash intro to your site. Visitors are there to get information, and all this does is slow them down.
Less is more
Is it vital? If not, get rid of it.
Good-looking does not equal good
Very pretty sites can be horrible to use. Ugly sites can be easy to use (hello, Craig's List!). Ideally you can be both visually appealing and usable, but never assume they go hand in hand.
Separate personal taste from your customers' taste
This is so hard to get past -- we want things to look and act in ways that meet our individual tastes. But if you're creating something for a particular audience, make sure it appeals to them -- not necessarily to you. I once watched a project that involved a camp brochure aimed at kids go from being bright, colorful, and fun to plain, conservative, and "elegant" in order to please some boardmembers. Wrong move. What appeals to 13 year olds and 53 year olds is going to be very different.
Be scannable
When creating lists, particularly in navigation, keep them left-aligned, and make each line start with the most key word. For example, on a site that lets you register copyrighted material, don't start each line with "Register Your Song" or "Register Your Album." Change that to "Song Registration" and "Album Registration" -- the leading word now carries more value and is easier to scan in a vertical list.

The shackles of innovation

2008-10-28T11:31:00.001-04:00

It's a word that has lost virtually meaning due to its constant repetition: innovation. Any number of industries must hear this word all the time -- it seems like the single most important thing to just about everyone. Is your product, or site, or approach innovative? If not, it might as well be worthless. Everyone is trying to "think outside the box" (a phrase so cliched at this point that even putting it in quotes doesn't give it the ironic distance it deserves). There is a widespread assumption that the status quo is bad, the way we do anything today is inferior to some "new" way we've yet to discover, and the search for this "new" way should trump all other efforts.

I can't agree with any of that. Striving fervently for innovation strikes me as severely misdirected effort, not because I believe innovation is bad, but because I think it is a side effect, not a goal unto itself.

The biggest problem with focusing solely on innovation, in my mind, is the assumption that current ways are bad -- it is starting with a ground floor decision to disregard all the prior work done by those in your field to get you where you are today. It is certainly true that previous work may have been done based on faulty information, incorrect assumptions, and other ill-advised decisions that could have brought things to a highly imperfect state today. But it is by no means a guarantee -- in fact, the opposite could also be true. Your product/site/whatever could be the way it is today because of highly reasoned research and testing that led to it being extremely solid and well thought-out. Unless you know all this background already, you can't really claim that innovation is necessary.

Focusing solely on innovation also sidesteps what should probably be the true goal of any project - to make the best product/site possible. A thorough process will explore the tried and true ways as well as newer, more innovative approaches. In many cases, more standard, "non-innovative" methods may prove to be the best fit.

Let's say you create a new site or product and all your testing and research leads to a conclusion that your best bet is to rely on well-established techniques. Had your goal been solely to innovate, this project would be a failure -- you've created nothing innovative. And yet, you've created the best possible product/site for your users -- the only problem was that it didn't involve creating anything truly new, just using existing principles to their greatest effect. How could that be bad?

Now let's consider the converse situation. Rather than seeking innovation, your goal at the start of a project is solely to create the best product/site possible. You do your brainstorming and research and find that the best solution is one that DOES in fact use a new, innovative approach -- it is thoroughly supported by your testing. No one would call this project a failure, and by focusing on making the best product/site possible, you've now overdelivered by also finding an innovative approach in the process. Innovation was not the goal -- it was icing on the cake.

There are a lot of reasons why innovation is still such a prized asset -- it's sexy, it sounds good, it shakes designers out of their boredom -- but these are not enough to warrant prizing it above quality. Think you've got a better way to do something? By all means, explore that new method and see if it works better -- but be willing to recognize the value in also learning that it's possible an existing method is still superior.

I should mention that this post is partially inspired by Scott Berkun, who I saw speak at the UI12 conference in Cambridge, MA, in 2007. He spoke about the "myths of innovation" and mentioned, for example, how innovations are often accidents, and he also talked about how the word "innovation" has indeed lost a lot of meaning over the years. I don't claim that this post represents his opinions at all, but his talk came back into my mind as I worked on a recent project that was driven by a client's desire to innovate. Check out his blog, it's got some good stuff.

Cut cut cut!

2008-10-20T11:18:00.000-04:00

For many people who have websites, this is a sad but almost undoubtedly true fact: No one wants to read what you have to say.

First, let me give a caveat - if you have a blog or some opinion-based or news-based site, chances are people that visit your site do actually want to read what you have to say. But, most sites do not fall into that category. Also, this is not to say that visitors won't read anything at all -- but all most visitors want to do is find a specific piece of information very quickly and move on. Nobody sets out looking for self-hyping or vague filler, and any amount of that present on your site is an obstacle to their goal.

What I've said in previous posts about being self-aware or maintaining objectivity applies strongly here -- do you read websites? When you search for something and find a relevant hit, do you explore a site, patiently sit through a flash intro, and read paragraphs of marketing copy? The answer is probably no. So why would you expect your visitors to do that?

I've seen cases where I get the distinct impression a client is afraid that not having a lot of pages and a lot of text will send a message to the visitor that there is a lack of substance there. This couldn't be further from the truth. A trim, efficient, streamlined site that is light on fluff but clear and direct on content will send a message that you know what you're talking about, you know what the visitor wants, and you don't waste time and energy on the superfluous. Probably the only commodity more valuable than money is time, and no one wants their time wasted.

So I'm going to listen to my own advice and keep this short. Some simple rules:

Be ruthless and be willing to edit - because your visitors are ruthless with the "back" button and will ditch your page in seconds if they don't see what they want right away.
Every piece of content you write needs to deliver vital information that the visitor wants to read, otherwise you need to get rid of it.
Be willing to delete entire pages if their content is unnecessary or so light it could easily be combined with other pages.
Don't be long-winded; write concisely.
And perhaps underpinning all of this: don't be emotionally attached to any of your content, or you'll cheat yourself out of making the best site for your visitors.

Objectivity is a dying art

2008-10-17T10:15:00.000-04:00

It's hard not to notice, as the US moves into the final days of election season, how increasingly polarized a lot of people are. Making an objective assessment of anything seems to have gone out of style, and I think it's to our great detriment.

This blog isn't about politics, but I think this concept of turning every decision into a battle has carried over into many aspects of our lives, including management and design. Take, for example, a designer who believes strongly in simplicity and reducing clutter (as I do). You'd think the best way to put together a recommended design in that instance would be to analyze what's needed and suggest a minimalist design that still offers all the necessary functionality. But I've seen situations where, expecting push back from a client to add more, the minimalist-leaning designer ends up recommending something that is even more scaled back than they believe it should be. If their design were approved right off the bat, it wouldn't even be what they want. They expect an equally opposing force to fight them, and hope that they land somewhere that looks like their actual recommendation.

The end result is that rather than working as teams to accomplish the best work possible, each faction takes the core of their suggested beliefs and recommends an "extremist" version of it, believing that it will be watered down over the iteration process to hopefully land somewhere close to what they really think is best. Everyone becomes an advocate for a particular strong viewpoint, and the end result is not so much a happy compromise as it is a series of concessions. We deliberately don't look at things objectively because we think, "well, if I'm objective, and the other person isn't, I'll lose so much ground that my stance will be lost." We turn off our objectivity, and sometimes don't even know why we're fighting for things anymore, except that it seems like it's the side we should be on. Sometimes the other side does have a good idea -- a better one than you had -- and we should embrace those as learning opportunities rather than as "giving in."

This process doesn't usually end with a happy solution. It ends with something everyone feels moderately comfortable enough not to continue fighting over.

I don't have any particular proposition for how to change this, beyond just trying to foster objectivity more in your own work. I try to look at my own designs and ask, "is this really the best way?" Sometimes I'll do a full design on something and scrap the whole thing because, after stepping back, I realize my initial assumptions about the best design were off track. I try to listen to critical feedback and objectively accept when that feedback is right. If I love something, but everyone who sees it is confused by it, it's irresponsible of me to ignore that -- I try to figure out why my instinct was off and how I can adjust to avoid making that mistake again.

I'm not perfect at this by any means, but I do value objectivity and think it's to everyone's benefit to be a little more willing to stand back and take a critical look through someone else's eyes. You might see something you never thought of before.

Launched: Trinity Boston Foundation concert page

2008-10-13T00:48:00.000-04:00

My association with Trinity Church and the Trinity Boston Foundation goes back over four years, and I'm very grateful that in the time since I left working for them full-time, I have still been asked to help with a variety of design projects. These have included invitations, postcards, brochures, email newsletters, and now a one-off set of two pages to promote their 2008-2009 concert season, which was launched about a week and a half ago.

This project was a fairly quick and simple one, as they were on a tight timeline, but sometimes "quick and simple" yields exactly the kind of bold, clear designs that get the job done.

You can see the pages here: http://www.trinityinspires.org/building/music/

Widescreens in motion

2008-10-12T21:49:00.000-04:00

With widescreens and browsers on the mind, I noticed a nice way to use some of that "extra" space browser windows may provide on larger screens. As I updated my Flash player, I noticed that the "Search" box was located on the far right of the screen, despite there being no other content that far over.

I suspected that changing the size of the browser window would trigger some alternative layout that realigns the search box in relation to the top links. My suspicion was confirmed:

The search box remains right-aligned, but is now placed above the top navigation links rather than next to them.

It's an interesting and well-executed approach, and it should be noted, is not even that difficult to do.

Our widescreen future (and present)

2008-10-06T02:30:00.000-04:00

You'd think we'd have this figured out by now, but the ever-changing nature of the internet, computers, monitors, and design has made "How big of a screen should we design for?" a question at the start of every web design project.

The super quick answer to that has changed over the years, from 640x480 WAY back in the mid-90s to 800x600 to the current "safe" standard of 1024x768. Basically, subtract about 25 or so pixels from the width to cover the size of the scrollbar and you should be safe.

But, if you look at trends in monitor sizes -- and many clients do -- you'll notice that the widescreen monitor is becoming more and more prevalent. The screen I'm looking at right now is 1680x1050, and there are plenty of monitors out there with even wider resolution. W3Schools lists the % of people using screen resolutions of "higher" than 1024x768 at 38% as of January 2008 -- which is an increase from 26% the year before. A similar jump would put fully half of monitors at higher than 1024x768 by January 2009 (I think it's time for them to start breaking out that "or higher" group).

For the most part, however, virtually all sites have stopped themselves from designing for anything wider than 1024, even though statistics would suggest that you are serving up unused real estate to about half your visitors. Why not design for larger?

Well, there's a good reason -- as screen resolutions get larger, people are less inclined to maximize their browsers to full screen. But that starts to be a sort of chicken and the egg question -- are users not maximizing their browsers because of the "wasted" space, or is the way we use our computers shifting such that we prefer seeing multiple windows at once?

It would be interesting to see a site take full advantage of wider browser windows -- it is sometimes being done (look at Clear Left or this Particletree example and change the size of the browser window, and you'll see the content adapt), but I think a lot of heavily-trafficked commercial sites are missing out on an opportunity here. There may be a fundamental shift in the thinking behind site design in the not-too-distant future as our viewing area gets increasingly wider and (thus relatively) shorter.

Some additional interesthing thoughts on the subject are at 456 Berea Street.

Why are the basics still so hard?

2008-09-29T00:13:00.000-04:00

Last week I encountered a few situations where all I could think was, "why is this still so difficult?" In one case, someone who was incredibly tech savvy was having difficulty getting a TV to work with a particular attached device -- shouldn't this be easy by now? Why do we all still have four television remotes? Why is there such a confusing jumble of wires and inputs? Why haven't we figured this out yet? Virtually everyone (at least in the US) has a TV and at least one device attached to it -- a DVD player, a cable box, or maybe a TiVo, or AppleTV, or even a full home media system -- but these systems still seem designed from an engineer's perspective, not for the average Joe.

I don't know how to answer all those questions I posited there, but I'm hoping that we eventually reach a point where we start making a little more room for real world usability. I've heard (unfortunately I can't cite a statistic) that HDTVs are frequently returned because people think they're broken, when in reality it's because they haven't attached it to their cable connection correctly or they have not properly adjusted the settings, and if you mess all that up, the end picture often looks worse than old analog TV. But, how is an average person supposed to know that? And at what point do you get enough complaints and returns to actually go back to the design phase and say, "let's simplify this"?

A lot of designers thinks this means that people are stupid, and you have to oversimplify to the point of babying people. Let's snap out of that mindset, and instead try putting ourselves in someone else's shoes. Imagine some field you know nothing at all about, and now imagine an expert working on something that is ultimately meant for you, the "average" person. Wouldn't you want them to make it as clear and easy for you to understand as possible? So why balk at doing that in design?

New Portfolio Site

2008-09-17T00:00:00.000-04:00

I've just relaunched my portfolio site. The re-design isn't hugely dramatic, and I will probably continue to do some behind-the-scenes tinkering to clean up the code and maybe do a little text editing here and there, but I'm proud of the relaunch!

The main differences:

The primary navigation is now along the top
There is more use of color throughout the site
The "About" section has been expanded
The thrust of the site is now more about making client connections rather than just showing what I've done in the past
The new color switcher!

I've also tried something new where the entire site is designed without any images (with the exception of the portfolio imagery). Most websites use combinations of background graphics, graphics-as-text, and other graphical embellishments, but I gave myself the challenge of doing it all solely using HTML and style sheets. There may be a slight benefit in loading speed, but for the most part, this was purely as a personal challenge to see what I can achieve, and I'm pretty happy with the result.

One of the key additions to the portfolio section is the recent relaunch of the SpeakEasy Stage Company site, one of Boston's premier theater institutions. Check it out.

I also finally linked to my blog, which has been running for about 3 months now, as I wanted to make sure there was a decent back log of content available before promoting the blog. So feel free to peruse past entries and let me know what you think - leave a comment on a post if you find it interesting! (Please note that for now I am using a blogger template for the blog, but I plan to create my own blog layout soon - one step at a time.)

Thanks for visiting, and if you're looking for a new designer, hopefully I might be working with you soon!

Introducing the color switcher

2008-09-16T22:48:00.000-04:00

I've just relaunched my portfolio website, and one of the main new features is the color switcher (pictured above). I realized a few things about my site as I was considering a redesign:

My site has a very simple color pallette - black, white, and green - but the green was chosen somewhat arbitrarily. Why not a different color?
My site should be more than just a place to show images of my work, it should show some of my coding ability as well.
Some of the best design firm/portfolio sites I've seen add a level of interactivity that engages the visitor.

Those three concepts tied together quite well in the concept of the color switcher. I used the code from this helpful tutorial at A List Apart and removed all color declarations from my primary CSS style sheet (sorry if this is a bit codey for the non-coders), and then created seven style sheets that dealt only with colors. It also creates a cookie which remembers what color you last chose when you return to the site.

All in all, it is a fairly simple concept that can be executed in larger ways for other sites, such as changing font sizes or allowing re-skinning for users, and can extend well beyond colors into entirely reformatting the visual structure. CSS Zen Garden is a good example of this taken to the extreme, although unlike CSS Zen Garden, my color switcher requires no page refresh.

Pretty neat, huh?

What is accessibility?

2008-09-08T14:04:00.000-04:00

One of my most enlightening experience at a previous job was learning more about web accessibility. At first the word "accessibility" may conjure images of people in wheelchairs needing ramps, rather than stairs, to enter buildings. This isn't so far off the mark in terms of web design.

Accessibility certainly deals with making websites that work for individuals with impairments that might make websites otherwise difficult to use. These can include:

Visual Impairment - Note that this covers a wide range, from the completely blind (who use screen readers to have content read to them) to those with poor eyesight (who can see but need larger text and clear imagery) to those with color blindness (who may have difficult seeing certain contrasting colors, such as red text on a green background).
Hearing Impairment - One might think this is not a problem on the web, but as video and sound are increasingly used, some sites have entire introductions and "avatars" that use audio to provide instructions and content -- without a text component, the hearing impaired are lost.
Motor Skill Impairment - I don't know the technical term for this one, but it's important to remember that not everyone uses a mouse, and not everyone who uses a mouse has the dexterity to easily click on a link if it is just a few pixels in size.

The funny thing about designing websites with all of the above in mind is that you generally are improving usability for non-impaired visitors as well. Some people with fine vision may simply prefer larger text for reading, and good visual contrast makes a site easier on the eyes for everyone. Similarly, someone may not be hearing impaired but may be browsing your site in an environment where they can't have sound turned on (such as at work or at a library) -- making sure your navigation and content is available as text helps here, and can also help those who may not be fully fluent in your language and find it easier to read text. And of course, we've probably all been in situations where we've moved our mouse through a set of complicated drop-down menus only to get frustrated as moving 1 pixel outside the target area makes the whole menu disappear -- that doesn't require any impairment to be annoying.

There are also behind-the-scenes benefits -- websites coded with accessibility in mind can often place higher in search engines, as semantic markup (for example, labeling your headers as headers rather than just regular text with fancy font formatting), image text replacement (that is, whenever your graphics have text in them, the text should be written into the code as well), and proper usage of "alt" and "title" tags will help the search engine find your content and mark it as relevant.

It's also important to keep in mind that many web technologies -- such as JavaScript and Flash -- are not enabled or available to some users (the most notable recent example being the iPhone's lack of Flash support). The concept of "degrading gracefully" has become an important one -- essentially meaning that should these technologies be turned off, your site content should still display in a readable (and hopefully visually pleasing) manner.

I do not consider myself an expert in accessibility but it is certainly something I keep in mind as I design sites, and with each new project I try to implement new learnings. I think it's important to share this concept, however, as many people have never even heard of or thought about website accessibility. Having this knowledge in the back of your mind, even if you don't necessarily know 100% what its implications are, can help in the decision-making process during design. Accessibility issues may only be strictly necessary for a rather small minority of visitors, but designing with them in mind usually has a positive impact for everyone browsing your site.

How much can you know?

2008-09-05T13:42:00.000-04:00

Confession time: I don't know everything. I know, you're shocked. But seriously, I was talking with a couple friends who are in web design, shooting the shit about various techniques and CSS and JavaScript (you know you're a nerd when...), and at one point I blurted out, "sometimes I feel like I don't know nearly as much as I should and I'm just making it up as I go along." My friend, who has had a few years more experience than I have, didn't miss a beat: "You just described everyone in our industry."

That was comforting, and probably true, as there are so many different things any individual could know in the field of web design that it's pretty much impossible to expect anyone to know it all. I'd argue that the greatest advancements in design have come from people who were making it up as they went along.

It seems to me that a good designer -- or perhaps more specifically a coder/developer -- doesn't necessarily need to know how to do every idea or assignment that comes their way. They just need to know how to LEARN how to do it.

I'll give an example of a recent project I did. There were a number of techniques I wanted to do, yet didn't know specifically how to do them off the top of my head. Among them: tabbed content within a page (rather than clicking to a new page for every tab), an automatic rotating image slideshow, a form that calculated various fees and totals in real time as you select different options, and a method to display content only if it exists on the server and how to present an alternative if it doesn't -- these are all things I had never done before, but knew I could figure them out, and I managed all of them successfully. Admittedly these are smaller features, and allowed me to learn in chunks rather than being presented with something as complex as "build us an online stock trading system." I felt confident tackling them because I at least knew enough about the various languages and techniques involved to know that they were all achievable, and as I worked on them, I learned more about other underlying concepts that will help me with the next new idea/design.

I think too many people, when given a challenge they don't already know how to complete, simply give up and think it's outside of their abilities. This is rarely true. There are still coding languages and techniques that seem so complex to me that I can't help but feel intimidated -- but breaking them down, and remembering that everyone who is now an "expert" was once in my shoes as well, has made me realize that knowing "how to know" is a skill that lets you do just about anything.

Learning to be self-aware

2008-08-25T15:13:00.000-04:00

Jumping off of a concept from my last post about common sense usability, one of the most important things a good designer (particularly in the usability field) needs to be is self-aware. In general, people are extremely un-self-aware. Concepts of time are often way off (anecdotally, I remember my mother, in 2007, referring to Princess Diana's death as having been "a couple years ago," when in fact it had been ten years), and we tend to conflate memories into events that either didn't happen or occurred in separate times and places.

This is particularly an issue when working on web design. Very few people stop to ask of themselves the kinds of questions that are absolutely vital for good design. Where does my eye go first? This can help you organize the layout via information hierarchy. Am I moving my mouse to follow my eye? This may suggest good places to have hover states. Do I quickly click from page to page until I find what I want or do I scan a page fully before making my first click? This could inform your approach to site navigation. How many seconds does it REALLY take for me before I get annoyed at not finding what I want? This may determine whether a long-loading Flash module or graphics-heavy page is worth the sacrifice in loading time it may cost.

As important as it is to do proper testing and remember that, as the designer, you are rarely the intended audience, and you certainly know far more about the site than the average visitor will, you can still glean a lot of information just by carefully noting your own reactions -- even reactions to sites that have nothing to do with the one you are working on.

This is also helpful for someone who is not in design, but may need to work with a designer on a project. Are you working at a small organization that needs a better website? You'll be better able to get a top-notch end product if you are able to articulate clearly what your needs are, and you'll be better able to stand up for good usability practices if you end up working with a designer who has a great eye but perhaps a poor sense of usability. Think about your own site. Are there places you (or your visitors) frequently go to on your site that are buried? Is valuable home page real estate being devoted to unsupported or barely visited portions of your site? What aspects of your own site or your competitors' sites frustrate you and what do you find pleasing?

Asking these questions and being aware of your emotional state (by which I mean, happy, annoyed, indifferent, etc.) while browsing can help you pinpoint the design aspects that work and those that don't. So next time you find yourself frustrated by a website, stop for a second and think about what exactly is bothering you, and maybe even write it down. Similarly, next time you enter a site and find the information you want right away, think about what they did right -- this is often just as important or more important than finding the negatives, and frequently we don't even notice when something is done right.

But even when trying these exercises, keep in mind that there will undoubtedly be things you are doing that you are not realizing. It may sharpen your instincts, but for any larger scale project, you'll still need to take that critical look and apply it to other users to truly find underlying patterns and problems.

Why isn't usability common sense?

2008-08-22T14:13:00.000-04:00

One of the things that has always amazed me is just how many books there are out there about every imaginable web-related topic from programming to strategy to marketing. And of course, there are plenty of books about usability and all its related fields.

Let me emphasize for a moment that I'm talking about BOOKS -- big thick tomes, hundreds (sometimes thousands) of pages long. I can't entirely fathom why they are all necessary. How much can you really say on any of these topics? But, I recognize that there is obviously a market for these books and I'm sure many find them incredibly useful. On that end, I chalk it up to a difference of approach -- most of what I have learned has come from experience and small chunks of learning, but I can certainly appreciate that others learn in a different way.

But the one thing that strikes me is just how much of this knowledge, particularly when it comes to usability, should be common sense but isn't. Certain things require research to determine, and may not be entirely obvious. People scan web pages in an F pattern. The first two words of a list item should carry the informational weight (even if it means poor grammar). Most people find websites via search engines. None of those things are all that surprising, but they're not the kind of things you'd expect the average person to know off-hand.

But what about some of the other, more "obvious" aspects of usability? Tiny fonts are hard to read. Straightforward, descriptive language is easier to understand. Human beings are creatures of habit. All of these things seem like they should be self-evident -- the last of those three is even a common proverb. But take a look online. The web is rampant with sites that use extremely small type, writers bury their content in made-up jargon and unclear, confusing prose, and many designers view it as a personal challenge to always break from traditional designs and interfaces in favor of flashy, unexpected interactions.

If you asked a construction team to build a house, but told them it should have no windows, the door should be a round porthole the size of a hula hoop, and the ceilings should be 4 feet high, you'd be called crazy. But, technically, it would still be a "functional" house, and it would certainly get some attention. A lot of websites seem to fall into this category, often because they are old and poorly made just due to a lack of skill/investment, but some newer websites even fall into this trap, as high-end designers seek to create showy, "interesting" sites that draw in the eye but fail when it comes to actual interaction.

Is it that these common sense ideas aren't common sense after all? Is there an innate drive among designers to always push against commonly-held perceptions? The challenge of anyone with an eye on usability is to recognize that the desire to question the status quo is enormously valuable -- but the ability to look critically at your own "innovative" ideas and recognize when change is a negative is possibly even more beneficial, and is certainly undervalued.

Don't blindly accept "the way things are," but don't abandon common sense in the name of innovative design.

Thinking too far ahead

2008-07-31T14:04:00.000-04:00

When I worked at a large company, one of the things that stood out to me was the level of specialization everyone had. All my previous jobs were at smaller organizations where everyone had to know broader sets of skills often outside what might be considered their individual job description. A larger company allows for individuals to hone in on a specific area and become true "experts," and from that point of view, as any project moves through its development cycle, you'd ideally be handing it from expert to expert.

This approach has its pros and cons. It allows individuals to devote their time, energy, and learning to a very specific area to presumably become better at it, but it also means that they may not understand the implications their well-researched ideas may have on later stages of development. They may be torn between two ideas for a website interaction that seem equally valid, not realizing that one is a coding nightmare and the other is straightforward and simple code. In fact, when it came to web design, I would say that probably 70-80% of the people at the large company I worked at had no idea how to code.

As someone with a decently broad set of web knowledge, I worry that sometimes I suffer from the opposite problem -- I think so far ahead to the later coding stage about how I'm going to do something, that in the early design stages I may stop myself from creating certain designs because I know they'll be a coding headache, even if ultimately the overall experience/design might be better by going the more "difficult" path.

In the end, I think the best way to handle this is to try to focus on getting each step of the process right in itself, but with an idea in the back of your mind about how, for example, interaction may affect the visual design or how the visual design may affect the coding. Whether that is multiple people on one project or one person doing the whole thing, don't let yourself think TOO far ahead, but don't have blinders on either. It's a tricky feat of compartmentalization but, at the very least, it's worth taking a look at and being aware of how each step in your process affects the others.

Using breadcrumbs to define IA

2008-07-22T10:16:00.000-04:00

"Breadcrumbs" is a technique used to let visitors know where they are in a site as they get deeper into content. An example might be:

Home > About the Company > Staff > Creative Director

Usually all but the current page is also a link, which lets you go up how ever many levels you want in one click. Generally it's a rather useful technique, particularly in large sites with many layers to them.

Rottentomatoes.com has an interesting take on breadcrumbs. In addition to setting up the hierarchy in a left-to-right manner, they also scale the text to match the relative "size" of each section. It's a good way of enforcing a mental map. Just as the United States is bigger than Massachusetts, which in turn is bigger than Boston, RT shows that the "Movies" section is bigger than "In Theaters" which is also bigger than the individual page for "The Dark Knight."

While there are a couple potential issues with how they have set this up (the breadcrumbs themselves don't really look like links, the / is not necessarily the best separator, and it is a bit odd that the movie name is in a different font), the overall concept is one I hadn't seen before and quite appreciate. It not only tells you where you are but reinforces the hierarchy and information architecture of the site.

Kudos, RT.

Starbucks misses the mark

2008-07-21T13:54:00.001-04:00

If you've visited the Starbucks website recently, you may have noticed the floating "Got a great idea?" link that follows you around the site. Generally I don't like floating elements like that which appear without you asking for them, but it gets people's attention, and at least this is a somewhat benevolent gesture.

The major problem? There's no "Close" button. This thing will follow you around on every page forever -- there is no way to make it go away.

They've turned an effort to increase customer satisfaction into a creepy widget that won't leave you alone.

The Hurdle of Visuals

2008-07-15T13:42:00.000-04:00

You've worked your heart out on a project, coming up with a great site structure, smart placement of content on each page, and a solid outer shell of basic fonts and colors, and you present the work to your client. What's the first thing you hear? "I don't like the photos." Many of us have been there before. After all your hard work, the only thing the client can see are the images (which usually they have provided and you have no control over). How do you get people to look at the right things?

One of the biggest challenges facing anyone in the field of information architecture/interaction design/usability (etc.) is the careful line of visual fidelity. Human beings are naturally extremely visual people. Look at the stats for most product sites, and you'll probably find that the most visited portions are photo galleries and other high-visual/low-text areas.

Unfortunately, strictly speaking, much of the work in this field is not particularly visual. Yes, a good information architect lays out where things lay on the page, but in many (most?) situations they are not the ones creating the graphics files, choosing colors and fonts, writing copy, taking (and choosing) photographs, etc. One of my favorite sayings comes from the field of film, and basically states, "a good editor has done his job when nobody notices his work." The point being, a bad editing job is going to be obvious and annoying, but a good editing job is going to be completely overlooked as the viewer is immersed in the film itself rather than the editing. The same goes for many user experiences. People notice when it's frustrating, but a seamless, intuitive experience lets the user focus on the content, not the process.

I bring this topic up now because I am wrestling with the best way to present work, both at an internal wireframe level and at a client-facing presentation level. I remember a project at my last job where five members of my team were independently presenting wireframes to a client -- the idea was to treat it almost like a pitch meeting as if we were different firms rather than just members of the same team. It was a fun challenge as we all got along well, but the differences in our approaches were stark. Some of us made ultra-simple wireframes, just black and white boxes with Arial text. Others added a layer of polish with gradients, nicer fonts, and drop-shadows. Some used photographs, others used representative "silhouette" images, some just used placeholder boxes. Before our client presentation, our boss looked across our examples and decided we shouldn't be biasing the client toward or against any design based on the fidelity of the wireframes. Let the IA speak for itself.

This posed a problem for me -- my design was very sparse, and was intended to highlight the imagery of the product itself by minimizing navigation and text. Removing images meant that there were large areas of blank space now in my presentation. Would the client be able to "project" the imagery in their own mind and see how it looked? Would she end up preferring a presentation that was heavy on text and navigation because there was no imagery competing for visual attention?

It's a tricky question. My boss could have suggested the opposite -- everyone HAD to add photos and gloss up their wireframes. But then would the client focus on images chosen rather than the IA? How do you make a client look at the right things? And on that note, how do you get your co-workers to even look at the right things when presenting internally?

The answer all depends largely on who your audience is. You could have a super-savvy client who can envision the finished product just from a wireframe, or you could have a client who sees a wireframe and dismisses the work entirely because it doesn't look like the polished, finished sites they're used to seeing. And on an internal level, particularly in firms where different people work on different aspects of sites -- such as an IA building wireframes and a designer creating the actual visuals -- you can find yourself stepping on toes. Does a high-fidelity wireframe make the designer feel like you're dictating their job? Conversely, does a low-fidelity wireframe make you look sloppy? Can you make something that projects a polished, dynamic end product while still respecting that technically, the visual polish is someone else's job?

In general, I think I tend to over-design wireframes and under-design comps. Most of my wireframing is in an agency environment, where it helps to have nice fonts and clean lines, but inserting sample imagery and venturing into the land of colors and graphics are going too far. Meanwhile, as a freelance designer, clients often can't see the finished product if they don't have imagery in place as well, although I think it's best to use different imagery from what they might see on their live site today, just to underscore that the imagery may change frequently but the structure and visual design will be constant.

Why are hosting admins so awful?

2008-07-08T13:59:00.000-04:00

One of the new challenges I've faced in expanding my freelance work is that I have to interact with a variety of admin interfaces for different clients' web hosts. And they pretty much all suck. Why is that?

To be fair, web hosts have a tricky line to walk -- in many cases, experienced coders will be the ones interacting with the admin interface, and it is appropriate to use more advanced knowledge and to reduce the number of "walk you by the hand" tools. But at the same time, you may be dealing with staff members at smaller organizations who know next to nothing about web coding and yet are in charge of doing things like setting up email addresses and uploading files. Ideally, this would never really be the case -- but in those situations it does make sense to have a few tools and wizards to help.

So why do these hosting companies build interfaces that confound everyone equally? I just logged into one that instructed me NOT to use FTP to upload files (an incredibly simple procedure that is basically "drag and drop"), and that I was required to use FrontPage for fear of corrupting files. Of course, I'm ignoring this, as there's no logical way I'd be corrupting anything, but it's bizarre that this was set up this way in the first place. I'd figure that if you are in charge of a hosting company, you'd probably be an expert on how that sort of thing works, and I can't imagine any expert would set things up to require a particular software program to function (unless there is some devious co-branding going on here).

The worst case I saw was a company that actually professed to be comprised of usability experts. Not only was their administrative back-end completely unusable, but just finding out how to get help was confusing. They listed different methods of help contact for different "plan" levels, but nowhere (even after logging in) did it tell you what plan you were on.

Hosting companies could take a serious lesson from the variety of new admin interfaces that have popped up -- whether it's Facebook or Blogger or Flickr -- and note how simple and clear those interfaces usually are. One might argue they are not as complex as a full hosting package, but that is no reason to bury tools and functionality in unfamiliar terms or to overcomplicate simple processes. If these interfaces are confounding me, someone who works in the web industry and knows how to code a site, I can't imagine how confusing they must be to those less versed in web technologies.

As a side note, this seems to be a persistent problem I find whenever I am researching new ways to do things. When I am lucky enough to stumble on to a tutorial for a new technique, it invariably turns out to be an overly detailed process for something much simpler than what I was looking for. Conversely, when I actually do find information about the technique I'm looking for, it's frequently presented with the expectation that the reader already has an advanced understanding of the subject at hand, thus offering little value to someone who is actually trying to learn something genuinely new to them.

Much like bad hosting admin interfaces, bad tutorials fail to think about their prospective audience. Either cater your instructions to multiple types of users, or say upfront what the user should already know before reading (and if possible, link them to where they can learn that information if they don't already know it).

Desiging for iPhones

2008-07-07T13:54:00.000-04:00

At my last job, for quite some time the place was abuzz with the word "mobile." Mobile apps, mobile this, mobile that. Every client wanted to have some sort of mobile aspect to their sites, and they threw the word out often with little regard for how mobile would be used and whether their visitors even had any need or desire for it.

Somewhat oddly, this seemed to have largely been triggered by the launch of the iPhone, which doesn't actually require any special "mobile" version -- it can access sites just as any computer can. Some folks internally thought that, as things continued moving in a "computer in the palm of your hand" direction, the distinction between mobile and desktop versions of sites would become a moot point.

But a year after the iPhone launched I think it's clear that you can't just plan for the iPhone version of the site to be the same. I don't own an iPhone myself, but I remember using a friend's iPhone last summer to check my Gmail. The process was clunky, and although Google tends to have fairly lightweight sites, it still was rather slow, probably due to the AJAX going on. Recently I borrowed a friend's iPhone and realized that Google had created an iPhone-specific version of Gmail, which showed a marked improvement. I've seen other sites create iPhone versions with far less success -- Fandango tries to get it right, but their decision to spread showtimes for a single movie theater over multiple pages, rather than just keeping them on one scrollable page, was a serious misstep ("scroll fear" really needs to be ditched completely) -- it made me have to memorize showtimes from one page to the next if I wanted to compare multiple movies, and slowed things down by requiring the iPhone to load multiple pages.

All this got me wondering about what sites are worth making iPhone versions available? What sites are users most likely to visit when a regular computer is not available? A few things come to mind -- email, maps, movie times, cafes and restaurants -- the sorts of things where you might want to get a little information about a place while you are out and about.

I don't have any statistics to back those things up -- they are based on guesses and about the kinds of things I think people might want to find when not near a computer. But I think it's important that whenever a company is looking at their own website that they think strategically about what their iPhone users might need. Do they really need an alternate version of the site? Can you design your site in such a way so that it works without needing separate versions for the iPhone? Are there particular tools that iPhone users may be more apt to use (i.e., a Starbucks.com iPhone visitor may need a store locator but not care at all about company info)? And since, to my knowledge, iPhones still do not support Flash, are you making sure to have your site available in a non-Flash version?

I'll be curious to see how sites evolve as the iPhone age soldiers on, and if the upcoming 3G iPhone will have any design ramifications. It is key, however, to remember to view any new web aspect -- whether it is iPhones or social networking or RSS feeds -- in light of your particular company's needs. A poorly executed (or unnecessary) implementation of features often do far more harm than leaving those features out and waiting until there is a clear need for them.

Dominant Design

2008-07-02T12:14:00.000-04:00

One of the most interesting concepts in design that I've come across covers all sorts of media, and that's the concept of dominant design. My understanding, in short, is that something is a "dominant design" when it becomes so ubiquitous that it is virtually impossible to replace it with an alternative. A good example is the QWERTY keyboard. There was certainly logic behind its creation (although the rumor that part of the design was based around being able to type the word "typewriter" using only the top line of keys is sure to make any usability person frown), but I've heard that testing other layouts has shown that there are, in fact, better ways to arrange the keys. But if you try to sell a computer with a non-QWERTY keyboard, you will fail. The design is too omnipresent to be challenged.

I find this issue particularly interesting lately because it seems a lot of things long considered dominant design are being challenged. The most compelling example I can think of is how the standard gasoline-powered car engine is now being challenged mightily by hybird, electric, and fuel-cell alternatives. The whole "green" movement is having an impact on dominant designs in a number of other fields too, from architecture to food to energy production (one of the most fascinating stories I've heard is how some engineers are attempting to collect the energy generated by footsteps in a building's lobby and use it for power -- a wonderful example of conservation, if it is achievable).

In the world of design, trying to "break the rules" is a perennial goal of many designers. Tell a designer something has to be a certain way and they almost always will want to do it a different way. I met many creative folks at my last job who were always trying to come up with new and "exciting" ways to handle website interactions - a headache for me from a UI perspective as generally "new and exciting" translates to "confusing and annoying" to users. Designers may love change but most people hate it, and many actions are so ingrained that trying to break those habits is generally not worthwhile.

But that doesn't mean that challenging a "dominant design" is a bad idea. It's just important to make sure it's being done in a way that doesn't put off users, and that the impetus for change is coming from the point of view of "there's a better way to do this" rather than "I just want to be different."

Designs often become dominant for very good reasons, and in a pinch, it's generally safe to assume that if everybody else is doing something a certain way, it's fine to follow suit. But stepping back and heading to the drawing board from scratch occasionally is definitely a worthwhile exercise. You may end up realizing that the "standard" way is the best way after all, but it's worth making the occasional challenge to dominant design. You may just end up finding a better way after all.

"The New Trends" (or "Why Web 2.0 is a Worthy Term")

2008-07-01T14:48:00.000-04:00

Recently a client asked me the fairly benign question, "so what are the new trends in web design?" My initial thought was that this was so broad a question that even listing a few dozen trends would barely scratch the surface. But upon further reflection, I realized it wasn't such a tough question after all. As a corollary, I imagine fashion editors are posed such questions daily, and any one of them could probably spit out a reasonably accurate soundbite. "Bright colors and loose, flowing garments cinched with thick belts are all the rage." I have no idea if that is actually what is popular in fashion right now, but it's certainly the kind of answer one might expect to plausibly hear, and that kind of answer would probably be sufficient for a casual observer.

There are a few different aspects to web design -- functionality, visuals, and programming among them -- and you can name quick responses to all of them. Social networking and interactive "make it your own" experiences are popular from a functional point of view. Visually, gradients, larger text, and reduced visual clutter are becoming widespread. And from a programming point of view, although I admit this is where I am least familiar, there is a renewed emphasis on semantic markup, open-source programming, and lightweight applications (basically, yes we almost all connect via broadband these days, but we can still make things move even faster). As someone in the field of usability, I'm tempted to say these are all ways of saying the same basic thing, a la the fashion editor soundbite: Web design is shifting from a "look what we can do!" showiness to a "look what you can do!" utility focus.

This is somewhat inevitable. As such a young medium, web design was really flopping around without a clue in its formative years. Since there were very few clear "right ways" to do things, trends came and went, and as anyone who has ever worked in a design agency knows, often the first thing a design team does when starting a new project is just look at everything the competition is doing, sometimes emulating work without really knowing if it's genuinely the best approach (this is not entirely without merit, however -- a key tenet of good usability is standardization).

This era of web design feels like the clean-up period after a major project's initial launch. Everyone is going back and looking at how they used to do things and seeing if there is a better way (there almost always is). Perhaps this is why the unquantifiable notion of Web 2.0 has caught on. It really does feel like the second phase. We get how this works now. We know the ground rules. Now it's time to make everything better.

A Beginning

2008-07-01T11:52:00.001-04:00

This is not the first time I've attempted to start a blog. I had one going for about 4 entries several months ago, where I was trying to present usability and design advice in a Jakob Nielsen-esque "this is how you should do things." But I realized rather quickly that limiting myself to usability design (and then requiring myself to write in a prescriptive manner) was far too restrictive.

So I'm letting myself branch out a bit. I want to focus on talking about design, but not limit myself. I tend to let my mind wander on to vaguely philosophical topics and I don't want to stop myself from talking about those things if I think others may find it interesting. And, more importantly, I don't want to write from a "do things this way" point of view because, while I have skill and experience, I don't know everything, and I don't think it's particularly responsible of me to claim that my ways of thinking will work for others.

I'm also letting myself (temporarily) disregard the visual design of this blog. I spent some time customizing templates the last time I tried to make a blog and, in retrospect, I realize I was valuing style over content. Maybe that's the first lesson I learn as a blogger: a good-looking nothing is still nothing.