Making the Redesign Case

Previously, I wrote about the old version of Sampa and how I came to the conclusion that it was necessary to create a completely new UI. But I still had to make the case for such a radical redesign and I didn't have the time (or the money) to run usability tests or create a variety of designs that I could compare. But, I did have a few things going for me:

• There was quite a bit of data about what people had used and not used in the old Sampa. Marcelo's built quite a stats engine. Of course, the data has to be taken with a grain of salt, but if something was particularly hard to do and users went through the pain anyway, I could pretty much assume it was valuable. I knew we needed to prune the interface and focus on the key features for our customers.
• There was a decent understanding of the target market -- probably as good an understanding as you can expect without the benefit of hindsight (it's always easier then!).
• There had been a lot of research about competitors and potential competitors and even some non-competitors. This enabled me to make a much shorter pass through them than would have otherwise been possible.
  
• Someone else had created a partial, rough proposal for the UI that went in the direction of making it look more like a standard Windows or Mac application. My inclination was to move in the opposite direction and seeing a fleshed-out version of the system as an app helped solidify my opinion.
• Finally, I knew I didn't have to create the final art itself. I was going to be able to work at the conceptual level and there were graphic designers who would make it look beautiful. This saved me a lot of time.
  

I quickly set out some primary goals for the new user experience. As much as possible, we would:

• ... accommodate easy exploration and provide users with the ability to tinker.
• ... give users both instant gratification and the ability to procrastinate.
• ... give users a warm feeling and a feeling of ownership.
  
• ... provide for both incremental construction and re-entrancy.
  

I also concluded:

• All editing and site management would be in context, but not in place. At all times, site owners would see the site pretty much like their visitors would see it.
  
• We would provide instant (one-click) access to the top things that users wanted to do.
• We would organize the UI around the way users think of their site.
  

This was all fine and good, but, in order to do the next step, I had to go out on a limb. Basically, I had to design (almost) the whole experience in order to show what it could be. If I couldn't do that, how could I convince anybody that it was viable? Even though I didn't have to create the final art, it had to look good enough to make the points and not be distracting. So, I did what any reasonable person would do -- I went home, closed the door to my home office, and spent a solid week drawing and redrawing until I was happy.

And the result? Not only was the redesign given a go, but the design was solid enough that we were able to proceed with implementation and final graphical design in parallel. Coming up, I'll talk more about the new design itself.

Here are two unmodified mockups from the set that I drew in those first two weeks, along with similar screen snapshots of the current live UI, plus one bonus image of the new UI.

A Few Hundred Options

They say a picture is worth a thousand words, so let's start there:

Unfortunately, this is just a part of the picture. There's more, lots more. Beyond what you see here, there are another 40 or so items that are available. Altogether, you can get to a few hundred possible options in two mouse clicks or less. You’ll commonly see a statistic like that touted to indicate that an interface is good.

But, it's not a good thing -- it's overwhelming. As a user, I don't know why I'm here. The things that are shown are all over the map -- ranging from configuration to content editing to status information that's not actionable -- and there is little to help the user get oriented, figure out how the system works, or accomplish the tasks that they want to get done. Although the options are organized into sections, the sections aren't parallel, which makes them less useful. The result is that it's a Winchester Mystery House of an interface.

I could analyze this interface to death, pick apart every piece of it and tell you every single little nitpicking thing that's wrong with it.

But I'm not going to.

So why am I showing this random interface to you? Well, in November, this interface became my problem. It's the old interface of Sampa, a web site creation service, and I joined Sampa to tackle it. So what did we do with the interface?

We tossed it.

And that's the real reason that I'm not going to nitpick the old interface. It's history. I wouldn't have joined Sampa if there hadn't been a clear commitment to make big changes, whatever they were. Paul and Marcelo (CEO and CTO, respectively) signed up. At the beginning, I'm not sure they really knew just how big those changes might be.

Even before I started, I had reached the conclusion that the interface was unfixable, but Paul and Marcelo hadn't. Just today, Paul reminded me that he had thought that I could just fix the old interface. This meant I really had to make the case for a new interface.

To cut to the end of the story, we launched a completely new Sampa today.

If you're lucky enough to be presented with a problem like this, I highly recommend looking at the big picture. You can't take an unplanned explosion and overlay it with a solid foundation. In the long run, you'll regret all the time you spend on bandaids. It's a big commitment (and you might have to make the case), but you need to build a new foundation and provide yourself room to grow. Next, I’ll write more about how I made the case and, after that, I'll discuss Sampa's new UI foundation.

I just wish I could solve the clutter in my garage as easily.

Update: Follow-up article: Making the Redesign Case
Press release about launch: PDF

It's Childish

I was at Seattle Children's Hospital today. In a way, it's sad that there are entire hospitals devoted to Children. But, in another way, it's wonderful. A children's hospital can be an opportunity, not a problem, and I am pleased to say that was what I saw today.

The childish touches (and I mean that in a good way) were everywhere:

• It starts at the parking lot, which are named Whale and Giraffe (and they have free valet parking, which means parents can concentrate on their kids).
• As we walked from the parking lot, we passed the topiary whales, then traversed an elevated walkway, where we could look down to see a playful sculpture garden on one side, and, on the other side, a nicely designed outdoor courtyard. On both sides, the railings were glass, almost 5 feet tall, so that no parent would ever have to wonder if their kid could fall over.
• Inside, everything is decorated wonderfully, with bright colors -- even the elevators, which had dolphins on the back wall and clouds on the ceiling. The lobby had a giant Native American-style whale hanging from the ceiling. Nearby, there was a 15-foot long bench that looked like a Native American canoe, with a bench height of maybe a foot. Everywhere, furniture came in both large and small versions.
• The waiting rooms had crayons and playing cards for the kids with signs that said you could take them with you (although my kids are older now, I certainly remember times when I had to explain to my kids that they couldn't keep something like that). Another waiting room had a GameCube, while another had a giant screen with rotating images of marine life. Each image would appear and then, after a while, text would be shown telling what it was, like it was a little puzzle for kids to guess what the animals were.
• In radiology and other rooms like that, the TVs were pre-tuned to kids channels.
• In the hallways, intersections always seemed to have little pieces of artwork. I'm speculating, but I imagine that it's so they can give directions like "go down to the turtle and turn left."
• Parents can go into X-ray rooms (etc.) with their kids when necessary.
• They have sibling day care.

And, by the way, they did all of this in a top-notch, state-of-the-art medical facility.

Each of these items alone could be considered a small attention to detail (and I've barely scratched the surface, I'm sure). But, all together, they indicate a strong focus on who the hospital is for. This hospital is clearly not for the doctors, the hospital staff or administrators, or the parents. It is for the children. And that's the way it should be.

Put simply: They understood their real users.

By the way, I feel the need to note that I haven't been to any other children's hospitals, so I'm by no means trying to suggest that the Seattle hospital is better than the others. I sincerely hope that they're all wonderful.