Archive for the ‘Design’ Category

Design (R)evolutions : A Chromeless Browser

Friday, January 30th, 2009

Alex Faaborg and Aza Raskin of Mozilla Labs explore the possibilities of a chromeless browser interface. It’s an engaging discussion not only around browser conventions but graphical user interface conventions in general:

One of the most treacherous things an interface designer can do is rethink well-recognized and well-understood conventions – no matter how “bad” they are from a design perspective. Alex and Aza rightly point out the inefficiency of making the mouse pointer travel all the way up to the top left of the browser chrome for Forward and Back buttons. Still, everyone knows how to do it.and do it well.

It’s a tricky proposition, but alas, this is where innovation happens. If they’re able to get it right, it might sting at first, but everyone will ultimately benefit. After all, if designers completely adhered to conventions, there would be no real progress, nor the occasional revolutionary stroke in design.

Flying Virgin America

Wednesday, July 23rd, 2008

I recently flew to L.A. We all know ticket prices are at an all time high and the standards for service in general are very low, so with this in mind, I was extremely delighted to find a reasonably priced ticket on Virgin America Airlines, which is considered a “premiere airline.” I’d never flown Virgin before so I was very excited.

Online Experience

My first discovery was the great interactive experience on their Website. This informative site outlines all the cool perks that Virgin provides–like mood lighting and plug-in ports for all your little gadgets including a laptop. I’d been scrambling to find a way to charge my computer on the plane and had even considered buying an extra battery until I found this out. Problem solved.

Continue reading»

Deposit-friendly Development

Wednesday, June 11th, 2008

Yesterday I had to deposit a check. My bank, Chase, has begun rolling out new “deposit-friendly” ATMs that require neither envelope nor deposit slip for check-only deposits. The process is shockingly simple. Here’s what I had to do:

  1. Select Deposit from the on-screen menu
  2. Insert the endorsed check into a slot, just as I would insert a dollar bill into a vending machine
  3. When I saw an image of the check on-screen, enter its amount [2008/07/02 UPDATE - It gets even better. I discovered today that it actually OCRs the check amount! After I inserted a handwritten check this morning it magically asked me to confirm whether the amount it read on it was correct. It was! I deposited two other checks and it asked me to enter the check amount, indicating that it couldn't read the amounts or it didn't have a high degree of confidence in its scan, so it didn't waste my time asking me to confirm them. I assume OCR would work nearly 100% of the time on machine-generated checks.]
  4. Repeat for any additional checks
  5. Press Done
  6. Get receipt showing an image of my check(s)

Here’s what I DIDN’T have to do:

  1. Fill out a deposit slip, which means I didn’t need to…
  2. Find a working pen, which I would need if I could…
  3. Remember my checking account number, which I never do, so I used to have to…
  4. Wait in line for a teller to give me my checking account number, before I could…
  5. Check the under-copies of the deposit slip to make sure nobody leaned hard and smushed their deposit info down into my slip or surreptitiously wrote in their account number to scam me into depositing my check into their account. (And to think some people trust paper.)

Chase saw a process where a machine that is already operating in a high-security and high-knowledge context asked me to write down the account number it already knows on a piece of paper it can’t read and seal it into an envelope it can’t open. What a wonderfully archaic set of steps to get rid of!

For me the customer, life is now clearly simpler, but what about the poor machine? Like all banks, Chase is very comfortable with ATM software and hardware, but surely the addition of machine-reading and imaging each check makes the ATM vastly more complicated and error-prone, yes? Well, no. Every check in the U.S. banking system has the issuing bank’s routing number, account number, and check number printed along the bottom in a standard Magnetic Ink Character Recognition (MICR) format designed for accurate high-speed scanning. Banks have been whipping checks around and reading those numbers all day every day for decades. And the check image I saw onscreen and printed on my receipt? They’ve been doing that for years as well. When’s the last time you got actual cancelled checks back in your statement? What might seem like an incredibly complex and high-risk project for you or me was to Chase essentially sticking together a few very familiar Lego pieces they’d used a million times.

Any time you see a business process that asks for information it either already knows, already should know, or can easily find out for itself, there is an opportunity for vastly improving the user experience. When you further see that you can do so with technologies you already live and breathe, to me it reads like the story of the perfect development project. Let’s review:

  • First, there was a clear customer benefit: Customers will spend a lot less time doing tedious and error-prone steps that do not benefit them.
  • Second, there was a clear client benefit: Bank staff will spend a lot less time looking up account numbers, opening envelopes and deciphering handwriting on incorrectly filled out deposit slips, and making sure the ATM kiosk is stocked with envelopes and deposit slips. Chase will also spend a lot less money buying and almost immediately disposing of NINETEEN MILLION deposit envelopes a year.
  • Lastly, from an IT standpoint, the requirements are clear and the risk is low: Get rid of all that paper by gluing together all these things we already know very well.

Dare I say it, this project sounds fun! Unfortunately, not all IT projects are such no-brainers. It’s not uncommon for a project to be approved with only two of those three stars, or sometimes even one. Maybe it benefits the client and the customer, but it’s going to be a huge and risky endeavor to implement. Maybe it will be a huge pain to implement and actually infuriate the customers, but the cost savings make it worthwhile (“Your call is important to us. Please listen carefully as our menu items have changed”).

In my experience, the one-star and two-star projects tend to come from an incomplete understanding of the business problem, either by IT or frequently from the business itself. Sometimes clients don’t really know what they want. Sometimes they’re too close to the action to think long-term. Sometimes they don’t understand technology at all. And sometimes we in IT just don’t ask, because we’re too busy trying to keep production up and running while watching Twitter feeds of the iPhone 3G announcement. I’m just saying.

No matter how it happens, if you simply treat isolated problems as isolated technology projects, you’ll get paid for your work, and life will go on. However, a deeper relationship with your client lets you do so much more. Understanding your client’s business plans and long-term goals lets you and your client both see the big picture. You’ll be surprised to see how this wider worldview leads to a more holistic approach to these seemingly tactical technical problems (“the ATMs fill up with deposit envelopes by 11:30. Make it hold more.”) When you do that, you’ll see that those one and two star problems can often be rearranged into three star solutions that make everybody happy. Sometimes so happy that they’re inspired to stay up late writing paeans to something as mundane as a deposit-friendly ATM.

Keynote Suggestion: Add Diagramming Support

Thursday, May 22nd, 2008

Just submitted to Apple via their Keynote Feedback page:

I’m using Keynote all the time to display complex diagrams step by step. I find that by building the components in one by one I can walk people through a complex diagram much, much easier than if I make a static diagram in OmniGraffle, where I’d need to show the entire thing all at once. And then, after I’ve built in all the various components of the diagram, I can even use the awesome animation actions to move things around and change things, to explain a plan to people.

So, I’m frequently creating diagrams in Keynote. And it’s going well – it’s totally worth it. But there are a few things that Keynote could make easier for me. The #1 thing would be the ability to connect shapes using lines (usually with arrowheads). That way if I move a shape around, the connections to it would move with it.

Another feature which would be very helpful would be more alignment help. In OmniGraffle, when I drag a shape around, little lines will appear which help me know how the shape is aligning with other shapes. This is very useful for making diagrams which have an orderly feel to them.

Thanks for the great software!

Avi Flax

Thus continues my infatuation with Keynote.

Need to cite this article?

Monday, April 28th, 2008

Online science magazine ScienceDaily has a great little feature at the bottom of its articles: a simple, straightforward display of how to cite the article in APA or MLA format. Brilliant. This is one of those little things that goes a long way; I would have killed for this in college!

ScienceDaily Article

Ux is Holistic

Friday, July 6th, 2007

When developing software for the web, it’s easy to forget that the end user–the human that’s clicking around in a web browser–doesn’t necessarily view her experience as a collection of disparate tasks (although she may), but rather as a singular experience focused on one goal, that gets harder and more complicated with each additional destination.

Let me provide an example. When signing up for a new payroll system, if our user is asked to enter a provider ID for her primary care dentist, but doesn’t have the number on hand, she gets frustrated.

Terrible dentist code box in ADP's TotalSource
A simple solution is the one employed during the enrollment process for the ADP TotalSource system: just provide a hyperlink to the insurance company’s web site, and let the user search for the ID.

Except not only has her enrollment experience just gotten significantly different (she’s looking at a new web site in a new window… for the same task?) but the search for the ID is many, many clicks away–clicks where she’s making decisions she’s already made (like plan choice) and entering information she’s already entered (like zip code).

A better user experience would be one that incorporates this additional and helpful functionality without exposing the stitches underneath. In software buzzspeak, this is called making the experience seamless.

The burden on the ADP development team here is a serious one. They have to take information they don’t have control over, slice and dice it down to the sought after results, and present it in the existing interface. In most cases, the initial cost-to-benefit ratio here will always prohibit the effort, since typical management will say, it’s okay, it gets the job done (or something to that effect).

A breath of fresh air, then, when the time comes to enter an ID and I have a list of available choices inline; when designers take the time to craft every point of the process; when the user experience is holistic. This effect isn’t lost on users. This is how to make people happy, encourage product loyalty and create a market for yourself.

10 Things We Can Learn From Apple

Thursday, June 14th, 2007

There’s no need to restate the high reverence (or pangs of envy, depending on where your loyalty lies) of Apple. They have innovated, floundered, and in recent years, risen from the ashes to make one hell of a run in computing and electronics devices. Love them or hate them, you can’t deny that they are adored by their fans. Their brand has reached that highly sought-after place in the world of marketing: they can do no wrong.

So how did they get there? Is it dumb luck? Or are they just much smarter than the rest of us? The most common reason given is Apple’s rabid devotion to design. That is, without a doubt, a key component of Apple’s success. But I think there’s more to it than that. Here are ten reasons why I think Apple is so successful today, and what we can learn from them:

  1. Understand The Total Experience. Apple is not a software company. It’s also not a hardware company. It’s an experience company. Software and hardware just play a part in the broader experience. Imagine your iPod without iTunes. Hardware and software are industry demarcations that the masses could care less about. By ignoring that separation and focusing on solving real problems in a cohesive way, they obliterated the portable music market.
  2. Less Is More. You see it in all of Apple’s interfaces. That “clean” look. Sure, the power is there, but wherever possible it’s hidden away. As for controls, there’s hardly a single button on an iPod. Hell, there isn’t even a power switch. It seems counter-intuitive to the engineering mind. Less features and less controls appeal to people more. But it makes sense. With less, there’s less room for error. Less to digest. Less to learn. In other words, a shorter path to enjoyment.
  3. “He’s Got His Father’s Eyes.” Take a look at an iPod. Then take a look at the Apple remote. Load up iTunes. Then visit apple.com. Nearly all of Apple’s products share common genetic characteristics. One of the most striking examples is a previous version of the iMac that actually looks like an iPod. Why is this important? Two reasons. First, by reinforcing common conventions, the learning curve is flattened. Second, these familiar profiles reinforce Apple’s signature. You could probably pick an Apple product out of a line-up that you’ve never seen before.
  4. “I’d Like To Introduce You To Some…Thing.” How many other companies do you know of that introduce a product line personally? Rather than a press release. Or a meme that starts out among a collection of bloggers. Or some sort of email list. Apple personally introduces their products to their loyal fans. Often times, it seems like magically, their web presence is simultaneously updated – sometimes allowing for purchase of just-introduced products.
  5. Control The Hardware. This isn’t even a secret. Steve Jobs said it bluntly at the iPhone introduction: if you want to build great software, you have to control the hardware. This is precisely why the iPhone feels four or five generations ahead of any portable device available today. Phone carriers like Sprint and T-Mobile fish around looking for sexy, powerful hardware from electronics manufacturers like Samsung and Motorola. Microsoft will go to bed with just about anybody to promote their software platform. Apple knows better. To create truly compelling experiences, you need to have a hand in all the pieces of the puzzle. The iPhone is a great example of that synergy.
  6. back_ipod Hide The Screws. This is a classic Apple move. Mimic real world artifacts and make things feel less like technology devices and more like something you’d find in the real world. Pick up your iPod. It has no visible screws. It isn’t even clear how the device comes together. Hiding the ugliness of technology makes these toys more endearing. Features like coverflow and the upcoming time machine further this notion of pulling design inspiration from the real world.
  7. retail-fifth-ave-pr2 “Go Ahead. Touch It.” People are scratching their heads wondering why the Apple retail stores are so successful. Gateway tried it years ago and their stores are all gone now. Dell is trying to sell through retail as well…through Walmart. Somehow, I don’t think finding Dell laptops across the aisle from 60 lb. bags of fertilizer will amount to the same shopping experience. Above all else, Apple stores are designed to allow you to touch, play with and interact with every one of their products. You’re implicitly invited to approach an iPod or Macbook and just play with it. This evinces a confidence in the ease of use of their products, and more importantly, a confidence in you.
  8. Feeling & Thinking. Good functional design and thoughtful product management is a struggle to appeal to and connect with others at a cognitive level. While that’s important, Apple understands there’s more to it than that. Their products have a welcoming, anthropomorphic quality about them. They lack the rigid right angles and black tones that dominate so many computer devices. They appeal to our emotions as well as our intellect.
  9. Colour corrected by ChrisHAu 22 May 2005 Great Design = New Invention. The MP3 player was around for years before the iPod hit the scene. While others were vying to somehow coax consumers towards this new way of carrying and listening to music, the iPod reset everything. It was, for the great majority of people, the real invention of the portable music player. Apple understands that great design (not just good design) can have such a staggering impact that it can introduce a product to the uninitiated masses. Another example is Spaces, one of the new features on their upcoming operating system. Virtual desktops have been around for years, but one look at Spaces and it feels brand new.
  10. 07hands It’s About People. The one over-arching theme that seems to penetrate everything Apple does is their basic understanding that every single thing they sell will be touched by a person. They don’t build API’s. They aren’t integrating with back-end systems. They aren’t making sure machines talk to machines. They’re creating things that people are going to touch and, at the risk of sounding hokey, have relationships with. Every bit of their philosophy – from how a box is opened to how a clickwheel feels – reinforces this unavoidable fact.

Ultimately, the points listed above are really lessons about design. If we think through what makes a great design, it’s something that someone else connects with – whether emotionally or intellectually or both. When they connect, it’s a great feeling of achievement and connection with the creator. Never mind the features and wiring and CPU’s underneath. They’re all a means to that single, common end. Apple understands this better than any other company in the world. And we can all learn a lot from them.

This post was also published on Richard Ziade’s personal blog, basement.org.

Celebrate .Net Framework 3.0…With Flash

Wednesday, November 8th, 2006

Oh the odd irony. We’ve been tracking the WPFblog here because, well, it’s one of the most informative blogs on WPF, XBAP and the like. And today we noticed a great little animation celebrating the release of .Net Framework 3.0. So we click on it and to our bewilderment…it’s in Flash.

Is this some sort of sign?

The Importance of User Experience

Friday, October 27th, 2006

Yeh, we’ve gone on and on in the past about how important the user experience, but someone actually went ahead and drew an explanation. Experience Dynamics have put out an attractive poster that nicely ties good user experience with real value. Nicely done. You can download it off Flickr or buy a poster from their site.

Why Interfaces Matter for Every Business

Friday, October 20th, 2006

Perhaps an alternate title for this post could be “How Time Warner Won My Money with an Interface,” or the equally appropriate “Why Cablevision Sucks.” No matter what you call it, interface design played a big role in one company getting my monthly cable dollars over another. In fact, one could say that a UI played a significant role in convincing me to move to my new apartment. And anyone who has had to move recently knows that’s persuasion.

My first place in Brooklyn only had one cable provider servicing my building: Cablevision. That was fine by me. I didn’t have especially outrageous expectations for cable service; I really only wanted the basic stuff, plus high def channels, plus HBO (for The Sopranos, of course). Cablevision gave me all of that for a reasonable price, and I didn’t give it a second thought.

Except every time I watched TV, I got frustrated. The user interface for Cablevision’s digital cable service constantly and consistently made me feel stupid and impatient. The worst part was the performance: when I launched the “guide” feature, it would take ten seconds or more to appear, and sometimes just sit at a black screen until I got angry enough to unplug the box and plug it back in. Browsing the info screens for my favorite programs would lag for a few seconds before displaying. Even just changing channels would take about 2-3 seconds per channel.

I put up with Cablevision’s atrocious service because I just figured that it was representative of the state of digital cable software right now. We just hadn’t figured out proper caching yet, or how to best use the generous bandwidth provided by the coax pipe, or the formula for inexpensively squeezing better hardware into the boxes. Since I wasn’t really interested in solving these problems, I figured I was doomed to suffer in silence.

Imagine my surprise when, at my friend’s apartment, I experienced the Time Warner cable interface for the first time, and realized that all of the problems I had with Cablevision were, in fact, just Cablevision’s problems. Time Warner’s interface was fast and responsive. It was clean looking, understandable, unobtrusive. The remote even had a one-button on/off feature that controlled the TV and the cable box at the same time! Why didn’t Cablevision have this stuff?

My lease was up on September 30, 2006, and during the month preceding, when I was deciding whether or not to move (I really didn’t want to have to go through the hassle), the fact that my prospective apartment was serviced by Time Warner played a significant role in convincing me to take the new place. Just to escape a crappy UI. Think about that for a second.

I think there are two important lessons here. One – little things make a difference in the user experience. The Time Warner interface is much sleeker, sure, but just the fact that it doesn’t make me wait for more than a second is a huge improvement over Cablevision’s sloth-like software. Two – and this is the real kicker – users will pay more money if you improve their lives. I am paying more money to Time Warner, for the same service, then I was paying to Cablevision. And I’m happy about it. I want to give them my money, because they are providing me with superior service.

Long story short? Spend time on making your user experience great, and they’ll pay you for it, even if you cost more. If that’s not a pretty big incentive, I don’t know what is.