Bits and Bikes

[ This is a lightly-edited version of an e-mail message I recently sent to Jason Goodwin of Piehead Productions as we discussed the place of visual, interaction, and interface design within an agile ("the Agile"?) development process.]

One of the reasons I prefer working at a start-up to either a large organization or for clients is that you need to do a lot of up-front design to get the Powers That Be on board with a design when you’re working in the latter sorts of environments.

When I did the design for Half.com, I got Josh’s approval on the visual identity by showing him the logo and a mock-up of the front page. Then I went to town on the site itself, basically by sitting next to the developers and designing things as they came up. We’d look at a page, and we’d figure out which established conventions made sense for each element of the page or feature in question, and occasionally we’d come up against problems that called for re-evaluating the visual and interaction language we’d developed up to that point. We might do a one-time-only variant or decide to make changes throughout the product because the solution we’d come up would make the product better if we applied it throughout.

This sort of approach is impractical in a low-trust environment. Large organizations are generally low-trust environments. Many client relationships are low trust (or high fear) environments. A lack of trust drives people to want to see very concrete designs, but early designs rarely reflect what comes out at the end. Or, if the early designs are faithfully implemented, they are likely to not work well, because it means the technical constraints that are inevitably discovered during development haven’t led to changes in the design.

High-fidelity prototyping (almost a contradiction in terms) makes sense when there’s little technical risk. But it’s extremely expensive (in terms of time and money) and of almost negative value when a project carries more than some threshold level of implementation risk.

Clients also don’t seem to realize that the skin of an application is almost completely malleable. The early versions of Billing Manager looked almost identical to Gmail, the product’s interaction model inspiration, and it completely freaked out the project owner at Intuit. I assured her that we could make it look like anything she wanted, and that we were keeping it borderline intentionally ugly in order to avoid giving the impression that this was the visual identity. She was not convinced, so we had to take a week or two and do the design that we could’ve done later, in parallel with QA, when our designers would not be busy working with programmers on building out the site.

I think it’s dealing with these emotional and inter-personal issues (trust, anxiety, fear) that represent the real challenges to successfully creating a successful product. I consider myself a designer in the most general sense, and designing a development process around the reality of the people you have and their personalities is something that deserves as much attention as the design of the product itself. Every product makes trade-offs in its designers’ attempts to deal with the constraints that are imposed on them, and dealing with a “problem” client or VP should be thought of as much a constraint as human factors considerations like “maximum duration in milliseconds a task can take to complete in order to be perceived as instantaneous.”

I like timelines. I like how they put events in context. One of my clients has me put together timelines occasionally, and while I did the first one in Adobe Illustrator, I quickly grew tired of manually laying out events. It’s time consuming and error prone. So I decided to write a program that would build them for me. In pure HTML.

I started off by creating a spreadsheet with the events I wanted to showcase. Here’s an example of a Numbers spreadsheet from Apple’s iWork:

Timeline data in a Numbers spreadsheet

I wrote a script that read the data, generated HTML with CSS styles the appropriately positioned the content. I initially dealt with potentially overlapping event descriptions by defining different classes that staggered descriptions vertically. I then assigned a staggered class to the event if, open visual inspection, it overlapped with another event. I latter wrote some Javascript that (with the help of JQuery) automatically modifies the vertical positions of event descriptions.

Here’s a screen shot of one a timeline, which visualizes data from the Wikipedia article on Antoine de Saint-Exupéry, one of the coolest men to have ever lived:

A screenshot of a dynamically-generated timeline

If you’re using Firefox or Safari, you can check out the live HTML at http://poseur.com/timeline/. I’m pretty proud of this—that’s why I’m posting about it—but there’s a lot more work I’d like to do, both in terms of user interaction as well as adding to the layout engine. Eventually, it’ll be web-based and anyone who wants a nice timeline will be able to build one.

This tool exists because of my laziness and impatience. Three cheers for hating shit-work.

We’ve all read—and written—far too many essays, articles, term papers, and love notes that start off with a dictionary definition of the central topic of discussion. I’m going to save you the pain of doing that, mostly because the definition that OS X gives me when I hover over the word “artist” and type Control-Command-D[1] is so ridiculous: “a person who produces paintings or drawings as a profession or hobby.”[2]

Things get much better from there if you read the full entry. Most interestingly for my purposes here is “a person who practices any of the various creative arts, such as a sculptor, novelist, poet, or filmmaker.”

Is a designer a practitioner of a creative art? Yes. QED. End of post.

…

You still here? Good, because that didn’t feel quite fair. It was like the last time I fell prey to checkmate in four moves, except for Jeremy, who wiped the floor with me, not me.

I’ve been trying to avoid providing context recently, because it gives me an excuse to digress and ramble on, things I need to do less, not more, but in this case, I will, because I think the context is actually important.[3]

Someone asked me what I was at a Fourth of July party. I had just finished a Solo cup full of Australian merlot[4], and was thus feeling a bit saucy, so I said that I was a “philosopher-programmer-artist”. And then Laura[5] asked me what my medium was. I replied, with a straight face, “products, mostly web-based applications.”

Sensing that this answer would be unsatisfying, I then delivered my standard monologue that attempts to square “artist” with “mostly web-based applications.”

You could say that Leonardo or Michelangelo were merely “graphic designers for God” or the Church or their secular patrons, because the idea that a work of art exists detached from any practical purpose is not grounded in the reality of the circumstances that led to the creation of much of what we call art. The art that these guys created was for very practical, very important purposes. Art instructs. Art persuades. Art glorifies.

The world we live in today allows a work of art to be reproduced without a loss in quality.[6] In fact, art can be created expressly for reproduction.[7] And by doing this, by giving up[8] what Walter Benjamin calls the aura of art, the artist has an opportunity to improve people’s lives in ways that a “fine” artist can only dream of.

The fine artist today is narcissistic. Fine art is about the artist. Real art should be about contributing to the human experience. Making it more joyful—or less onerous—no matter what activity your audience is undertaking. Consider the Japanese tea ceremony: it elevates the commonplace to the art, giving awareness to the everyday, in a way accessible to all, or to anyone willing to open their eyes.

I would rather create products that help people send invoices or sell their unwanted books than paint pictures, because I think in the end, there’s an opportunity to create more happiness than most “fine” artists can ever hope to.

As a philosopher-programmer-artist, I wonder about the transcendent, about its place in everyday life. It is not clear to me that the transcendent or the sacred must exist in items that are divorced from everyday existence. We need these things—it’s how we’re wired—and I think many of us feel the need to create these things, to try to create these things, at least, and it leads us to go beyond what is strictly necessary. And that, the going beyond, that constitutes art: the assertion of humanity’s value in the face of much evidence to the contrary.[9]

So is a designer an artist? I don’t want to be one of those people who twists words beyond their commonsense meaning, but sometimes we meet words whose meanings have been twisted. I do not know how practicioners of the traditional “fine arts” can legitimately lay exclusive claim to the term “artist” without bringing up grave questions that threaten to render art meaningless or powerless. Those who create, regardless of the medium, regardless of the utility of the objects being created, can be artists if their aspirations go beyond utility, and I do not think that including these people in the pantheon of artists degrades Leonardo or Michelangelo.

Notes

1. You need to remember this. It will quickly improve your vocabulary and become yet another thing in your computer-mediated existence that you wished existed out there in meatspace.

2. See what I just did? I just started off the post with a dictionary definition.

3. Important, and perhaps interesting. Perhaps.

4. I hate people who stopped drinking merlot after seeing Sideways. It made me not watch the movie until about nine months ago. A mistake. It was actually good. Like merlot can be. Whenever I hear people ordering pinot noir, I make a note to follow up later and find out if they were shamed out of drinking merlot by Paul Giamatti’s character.

5. Not Lauren. Laura. Sorry! I tried really hard.

6. Read about Walter Benjamin’s Thee Work of Art in the Age of Mechanical Reproduction for an interesting-but-ultimately-wrongheaded essay.

7. Like the work my friends at Cereal Art do.

8. Giving up, selflessly. Because no one’s going to call you an artist, and you’ll die anonymous, except to the sorts of people who read Metropolis and watch Helvetica.

9. “The world is a fine place and worth the fighting for and I hate very much to leave it.” Hemingway wrote that for For Whom the Bell Tolls, and it’s my credo. It sums up the world’s imperfection and the imperative to improve it. It is this struggle that, to me, gives life meaning.

[Note: Now with grammar and typo updates as well as more clarifying endnotes.]

Wirth wrote the book that gives this post its title. It’s a title that tells a today’s audience about ninety percent of what it needs to know about the content of the book. And I mean no disrespect to Wirth. It says much about how much his ideas have conquered the world that we find the title of his book almost tautological.[1]

Everyone in my professional circle[2] seems to be talking about UX: user experience. Users experience things in a context—or a set of nested or overlapping contexts—and the context that we have control or significant influence over is the product context. I call myself, among other things[3], a product designer. I truly despise this “UX” term. It’s fussy and arrogant and pretentious and puts the emphasis on the wrong thing.

Who isn’t a user and what isn’t an experience? We’re all “users” who are “experiencing” things constantly. Do people who design playgrounds call themselves SX—student experience—designers? I hope not. The fact is they design the playground. They may or may not design the see-saws, jungle gyms, and so on[4] that are arranged in a playground, but the key thing going on a playground is that you’re giving children a space to come up with their own experiences. It’s condescending to think that you, the SX designer, are determining what experiences a child is going to have in a playground.

A product is an environment. The idea that you’re designing a user’s experience stinks of the sort of simple-minded design ethos that results in “a wizard for every use case” product. A product that sucks.

Words mean things, and I wonder why the powers-that-be decided on “user experience” as the moniker for whatever conglomeration of knowledge, practices, and skills they’re claiming sovereignty over. I think it comes down to the sexiness of the letter X. Which makes me think very little of the members of the cabal that established this little cult.

The domain of UX is basically unlimited. UX is designed for abuse the way some quality assurance people go around talking about Deming and Six Sigma and the Toyota Production System aka Lean Manufacturing and use their quality bully pulpit to browbeat organizations into acceding to their proposals which in fact have little relation to quality and reflect the arbitrary taste and opinions of the perpetrator.

There’s nothing wrong with people trying to influence organizations, regardless of their job title, but what bothers me is when people argue that their area of expertise dictates that their opinion be heeded, that choosing to go another way means sure catastrophe. That is not rationale argument. It’s bullying and manipulative.

I spend much of my professional time asking questions. What do you think? Why? And if we don’t do that, what do you think will happen? What does everyone else think of this? What will this affect that we haven’t yet considered? How? Who deals with that? Relentlessly asking question after question can get you beyond statements like, “There are vague UX reasons why we most do this,” or “Accounting won’t like that.”

Why, why, why? Creating great products is about jiggling and wiggling and squeezing and pulling everything until you can get it to fit. Or learning that something won’t or can’t or shouldn’t fit and you decide to leave it out. I do not see the self-described UX community grappling with these issues in ways that are more productive that the rest of us.

Notes

1. Another book title, Small Pieces Loosely Joined, perfectly sums up why the web was successful, though that book was barely readable even back when it was published. I’m not even going to take the time to find out who the author was.

Wirth’s influence—or more properly, his fame—has been limited by 1) the Age of Object Orientation, which is mostly a scam when its “insights” stray far from self-evident statements or Alan Kay’s misinterpreted approach which he said would be better understood as message-oriented programming, and 2) Pascal, a pedagogic language wrong-headedly pushed into commercial service by Borland and Apple, the bad memories of which probably cause Wirth to receive more groin kicks than any man deserves at the hands (feet?) of traumatized developers from my generation.

2. It’s more one of my social circles, but the social circle of people who happen to do for money things vaguely related to the things I do for money.

3. Also: product manager, programmer, artist, plain old “designer”, mediator, facilitator, and other terms as circumstances warrant. Spending too much time trying to label people or activities is a sign that someone’s trying to start a professional association or play corporate politics.

4. Do these things even get built anymore? What does the current playground litigation environment look like?

Several people asked me to post my diagram of Old City drinking establishments. I made it in response to a friend (Julie P.) who inquired about the drinking options in the neighborhood. There are some places I need to add. I didn’t include Eulogy (”places to go when you’re too lazy to go to Monk’s” and “places that are okay during the week but filled with tools on weekends”) as well as many, many more “places you just don’t go”.

A disinfographic designed to help you choose where you should get drunk when in Old City.

I couldn’t get my preferred username at wordpress.com, so I usually have to try logging in a few time before I finally get in. The first time I try, I almost always click the “remember me” checkbox, but on subsequent tries, I often forget. It’s only as I’m staring at URL bar, waiting for the dashboard to load, that I notice: “Oof! Should’ve clicked that damn checkbox!”

What to do? log out and log back in, so I don’t have to log in again next time? I know it’s going to go the same way it just did. Yet I’ve already sort of forgotten my username/password combination. In fact, I never exactly knew it, I simply started exploring the cartesian plane of possible username/password combinations.

So: designers, please ask your developers to create log in forms that remember whether the user has clicked the “remember me” checkbox.

One of my favorite user interface atrocities to point out was in Netscape Communicator.[1] There was an alert box[2] that appeared when you tried to close an e-mail message composition window. It told the user, roughly, that there were unsaved changes, and asked whether the message should be 1) discarded, 2) saved as a draft, or 3) sent. There were three buttons below it, helpfully labeled a) Cancel, b) No, and c) Yes. Excercise: match 1-3 to a-c. Good luck on your mission.

I thought we had learned. I thought they had learned. But today, as I was quitting Firefox[3], I saw the following:

Here we see a small improvement over 1996: Instead of Cancel, No, and Yes, we have Quit, Cancel, and Save and Quit. The “Doof, I just pressed Command-Q (or Command-W) and my window with twenty tabs just disappeared!” problem is real, but there are better ways to handle it. By, you know, having buttons that clearly communicate what clicking on them will do…

Here’s my thirty-seconds-of-thinking-about-it-recommendation: “Forget currently loaded tabs” vs. “Restore tabs next time you open Firefox” vs. “Don’t Quit.” They can probably do better, but the current one is way worse.

1: Remember Netscape Communicator? The bloated monument to the delusional arrogance and sweeping ambition of nscp? A business’s products, like its office space, recapitulate the management of the business. Tufte made a similar point when he showed the disturbing tendency of corporations to equate organization headcount with importance. I forget which book he talked about this in—he talked about a corporate video of some sort—I think it was the one with the infographic about Napoleon’s Russia campaign. Wait, all of his books have that infographic! Sorry I couldn’t be more helpful… He may show you the video if you spend $400+ to have him read excepts of his books to you in a seminar setting.

2: Alert boxes: remember them? Remember when we used to design desktop applications? I’ve tried to use this terminology with people while designing web applications, and people generally reply with a “wha?!” The discipline of software design needs, oh, I don’t know, a standard vocabulary, a standard set of terminology that refers to elements, practices, actions, behaviors, etc.

3: I using Safari to register some domain names at GoDaddy to no avail. I tried Firefox, thinking Safari was caching some bad DNS data preventing it from loading the site. It wasn’t Safari; GoDaddy’s site is abysmally slow. They may want to consider using fewer pictures of Dana Patrick. They just lost about a hundred dollars (my guess of the net present value of future renewals for two domain names) in revenue from me today thanks to their site’s inability to load. Some advice: Hire a performance engineer and throw her in the same room with whoever has responsibility for revenue along with the head of marketing.

As Gresham was handing me the to-him-worthless sections of the Sunday New York Times, the article from the top of the pile, Data, Not Design, Is King in the Age of Google, screamed out at me.

—You done with these? I asked.

—Most assuredly.

—You’re sure?

—Take them!

—Okay! Thanks!

I had no time for witty repartee: I had to go meet up with my sister.[1] I tried to inhale the article just as I had legendarily downed hot dogs in my childhood: with two or three chomps. The headline mentioned Google, but the picture showed a dude with a big smile in front of an iMac with the Twitter logo open in Photoshop. What’s up with that?[2] The article opened with a simple-minded question: “Can a company blunt its innovative edge if it listens to its customers too closely?”

“Of course!” is obviously the answer. I had to go, and I put the article on hold.[3] That was yesterday. This is today, and it’s time to deal seriously with this article. To read it slowly. And think about it. So I will do that now.

For those who haven’t read it, a distillation:

—Data becomes a crutch… says Bowman.

—We let the math and the data govern… says Mayer.

—Getting real-time feedback is incredibly powerful, but the feedback is not very rich, Dunn says.

—Web analytics makes it very difficult to take bold leaps, says Dunn.

—Customers sometimes do not know what they want, Brown says.

—It can be dangerous to listen to just what users say they need, says Brown.

—Designers must find a multitude of ways to understand users’ needs at a deeper level, the New York Times says that Dunn, Brown, and others say.

—It is more from engaging with users, watching what they do, understanding their pain points, that you get big leaps in design, Dunn says.

—Google’s approach works really well for Google, says Bowman.

—He has…found a new way to listen to customers: reading their tweets in reaction to new design features, the New York Times says of Bowman.

—Using data is fundamental to what we do, but we take all that with a grain of salt, says Bowman.

—Anytime you make design changes, the most vocal people are the ones who dislike what you’ve done, Bowman says.

—We don’t just throw the numbers in a spreadsheet, says Bowman.

The problem with this article is that it contains a lot of statements that are talking past each other. At the heart of the problem is Brown’s statement that “it can be dangerous to listen just what they say they need.” Of course this is true, but it is a non sequitur. Google is not running a focus group, asking it’s customers to tell them what they need—or want. They are looking at what they do. No person worth talking to in the field of product design—or UX, as people seem determined to call this sort of thing these days—would recommend product innovation by asking users, “What do you want us to build?”

When Dunn says that is by engaging with users that you get “big leaps” in design, she is simplifying (in a consciously self-serving way, possibly), because we know that’s not the only way you get big leaps. And reading customers’ tweets is a new way of listening to customers in only the most superficial way, and maybe not even that: good designers have been (selectively) listening to feedback from their audience for…ever.

There are tools and there are jobs. The role of a professional is to choose the right tool for the job. Products have life life-cycles. The proper tool for evolving an existing feature of a mature product may very well not be a good tool for creating a product that exists only on a whiteboard—and in the minds of the people designing it.

To get rigorous for a moment, there is the existing product in the existing category, the existing product in a new category, the new product in an existing category, and the existing product in the existing category. This MBA-friendly, four-quadrant chart may be useful:

Design methods in situations inside box A are going to interact very differently than methods in box D situations. You need to design the process of design based on the situation, a situation that is much more complicated than the two axes of product and category new-ness. The design process space has additional dimensions related to team members, customers, the business environment, the setting—client-agency vs. in-house, for example—and others that you, an experienced product designer, must seek to identify, on the ground, in the shit.

I don’t know Douglas Bowman, and I’ve never worked at Google, but I take him at face value when he says, “Google’s approach works really well for Google.” Maybe Bowman just doesn’t want to work the way that works for Google. The article says as much: “…Mr. Bowman has found a place that better suits his sensibilities.” There are environments I know I don’t want to work in. I’m pretty up front when I tell people that I like to be around products from the time of conception to adolescence. I very definitely don’t want to be around when the MBAs take over, and start instituting processes and rationality. It may be the right thing to do, but I’m not the right person to do it.

Being able to see, being aware, is one of the most important traits of a good designer. Try to be aware of your motivations for wanting to apply a particular technique. If it’s not because it makes sense but is instead what you want to do, you should either choose another approach or choose another project.

1: Kim was handing out pretzels and drinks to Susan G. Komen Race for the Cure participants, most of whom, I would later discover, thought that walking three miles entitled them to complimentary beverages and snacks without any obligation to say “please” or “thank you.”

2: I’ve been in the office when the press gets paraded around. No one at Google would just happen to have a huge Twitter logo open in Photoshop as a New York Times photographer is snapping pictures. Every desk would just happen to have giant Google logos open in Photoshop.

2: My sister, along with my niece, and I proceeded to have a fun day: I showed her around some more of Philadelphia. She went to the Betsy Ross house and learned that most of what she was taught about the famous seamstress as a child was bunk. She rode my awesome new bike. And we went to see Star Trek, which possessed awesomeness far beyond my expectations. Kim, I’m sorry for telling you to shut up during the movie. I was really into it, but that’s no excuse for being an asshole. And I’m also sorry Monique: I was an asshole to you too yesterday. And to Brad. I should have introduced you to Kim, but I just knew it would burn you up if I didn’t, and I was seeing if you’d react. And you did. I shouldn’t play games with people. I should have learned that as I watched from my window as the drunk guy in the pick-up punch the woman’s car until his hand was bloody at 3:15am Friday night. It’s probably for the best that by the time I got down to the street with my crowbar, the guy had left.

Thinking small and elegant…

I signed up for Buzzword and noticed a few things:

• Buzzword.com steals command-tilde, making it impossible to switch to the other windows in Safari.
• The text fields are not standard Mac text fields, and they don’t respond to option-arrow, control-A, and many of the things that experienced Mac users come to expect. It drives me.
• The font rendering in text fields looks like crap. My last name, “Watkeys”, renders especially bad: there’s a huge space between the “W” and “a” glyphs. Adobe once asked the Mac design community whether it trusted Apple or Adobe to do type right. The audience roared Adobe. That was in 1992 or something. Does anyone want to change their answer? Before answering, take a look at this:

  

• Contextual menus don’t work, because Flash hogs the contextual menu, so I can check spelling or look something up in Google or any of the other things I can do in any real Mac application.

I notice some of these problems in Yahoo Maps—and other web-based apps—too. Using a Flash or AIR app is a significantly less enjoyable experience than using an equivalent desktop or HTML-based web application.

Grr! As I wrote this entry, I tried to type control-D in WordPress, and it did nothing, instead of deleting forward, as it should. There doesn’t seem to be a way to turn off WordPress’s control keys for shortcuts, which makes it nearly as irritating to use a Flash-based application. The only site with keyboard shortcuts that doesn’t irritate me is Gmail, which makes you de-focus any text area to use a shortcut, but again, sometimes the document isn’t focused, so you need to click in it so you can type for example g-i to go to your inbox. So I guess Gmail irritates me too. And Gmail’s approach wouldn’t work with WordPress’s “problem”, which is inserting timestamps and images and so forth inline while typing: In Gmail you need to de-focus a text field or text area (using the mouse or the Escape key) before using a keyboard command. P.S. Try typing a question mark in Gmail if you have keyboard shortcuts activated. Nice touch!

When you design a web application, CONSIDER THAT FACT THAT PEOPLE WILL BE USING IT—IF YOU ARE LUCKY—AND YOU SHOULD CONSIDER THEM and THEIR LIVES AND THE CONTEXT IN WHICH THEY’LL BE USING YOUR APPLICATION BEFORE YOU NARCISSISTICALLY DECIDE TO GO YOUR OWN WAY UI-DESIGN-WISE.