User interface design is a subtle, subtle art. The smallest detail can mean the difference between an application or site that is fun to use or one that grates on the nerves.
I discovered this insight the hard way, by making Flash games and iPhone apps. Often the difference between a successful app and a failed one is a single button out of place, a screen that doesn’t respond quickly enough, a frame rate that skips and hitches.
A few years ago I released a game called Scataract. Go ahead, click the link—it’s free to play and will load in your browser.
Ah well… since you’ve decided to skip the game, I’ll just say that you’re not the first. I worked on Scataract for months. I poured my love, my soul into it. I gave it awesome power-ups and time travel and gravity and alien bad guys—everything a good game should have. But nobody played it. And neither will you.
Why? Two reasons.
First, the name is terrible. I thought it sounded kinda cool. Everybody else thinks it sounds kinda lame. So you skip it because the name doesn’t intrigue you. The original name for the game was “Super Time SUPER-TIME!” which I thought had a Japanese ring to it, but also sounded stupid. Still, I wish I had gone with that one.
Second, at the beginning of the game you are suspended in space. The game tells you, “Go find the bomb!” You’re supposed to hit the Control (or W) key to make your ship go and use the mouse to move. The game shows you an arrow, pointing which way to go. I added these helps after playtesting because nobody knew what in the heck to do.
But I realized later that these helps don’t help that much. Some players figure out how to move and steer their spaceship, they find the bomb, blow it up, and seem to have a blast. Most players sit there, twirling around, suspended in space for a few seconds. Then they realize they have better things to do with their life (like look up “Vlad the Impaler” on Wikipedia—was he really a real person?!) and they drift off into the ether.
My six months of work earned maybe 100 plays. Scataract (not too late to click the link!) proved a waste of time. Because of nine silly letters and a less-than-obvious opening.
Microcompetition
In a world where everything is free, competitors wrestle over molehills. The tiniest difference between games, applications, sites becomes a Major Selling Point.
Take Facebook and Twitter. Don’t they essentially do the same thing? If you open up your Facebook account to the world your status updates are Tweets, all right? They just are. But to open up your updates means editing your account, and that’s work. That’s a good thirty seconds you just don’t have time for.
Contemplate the death of MySpace. Wasn’t MySpace basically the same idea as Facebook? But I use Facebook because it’s white and clean. I hated—absolutely loathed—MySpace because every visit was like a vicious stab of ugliness that poked me right in the cornea.
When I buy a car, or breakfast cereal, or shoes, I make decisions based on value and gas mileage and calories and taste and durability and support and so forth—substantial criteria. But when I make a decision about where to click, I’m chasing the brightest, bonniest blue pixel that the screen can wave before my nose. In a world where every decision is free—it comes at the cost of moving a finger—and customers have no commitments whatever, content producers make battle on fields that are measured in millimeters.
The sites, the games, the applications that win are those with the bonniest pixels. The simplest details—an uncluttered interface, lush colors, lovely glass buttons, an attractive font—can make for victory or defeat.
Phit
The next game I made after Scataract was a little puzzle called Phit. Phit did not take months to make. It took a week and a half. But guess what it had?
- A white, cute, clean opening screen (with a spinning flower!).
- Clear instructions for how to play the game embedded right in the opening screen.
- An automatic resume-your-game feature so friendly that several reviewers mentioned it.
- A cute, short name.
- Bright, bonny blue (and red and green) glassy things you could drag around.
And do you know what? That sucker sold like hotcakes. I had 30,000 plays in the first day. Over a million people have played it since.
Moral:
| Every pixel | (and animation and button and sound effect and response time and word and name and phrase and icon and slider and image border and drop shadow blur factor and glyph and indent and padding) | matters. |
One Comment
This is why I always loathed web design and would probably do horribly in UI. I’m huge on control systems, tho, so go figure. A friend here at guildhall recently told me he thought web 2.0 simply meant round edges. But that’s the first thing you notice. And heaven forbid anything today has a corner–gone in seconds.
It presents another problem. Competing free content means less and less substance replaced with style. It’s why my favorite TV shows regularly get canceled. I sincerely hope gaming doesn’t go in this direction which is part of why OnLive scares me. That and I never trust a subscription service to put money in the right places.