The Design Epiphany

Every time I design something, there’s a defining moment; a moment where the design finally comes together, where it switches from being something bad to something good. I think of this moment as the “design epiphany.”

It usually happens very late in the design process, much later than you’d expect. And it’s always preceded by a period of agonizing uncertainty, where I know something’s wrong but lack a clear path to fixing it.

A lot has been written about design, but I’ve never seen anyone describe this particular moment. So I’m going to do that now, by telling the story of designing my own app, Review for iPad.

The Prototype

Review is an app without precedent, so I first built a prototype to make sure it was something I’d use. For the most common Review use cases: adding new reminders and addressing the reminders scheduled for today, the prototype was functionally complete. It just looked bad. This illuminates the nature of the design epiphany; it’s rarely a revelation in functionality. Functionality is refined in a separate, but parallel, part of the process.

The Draft

After using the prototype for a while, I set to work on the real design. In a few days I had this, the last draft before the design epiphany. All the user-interface elements from the prototype are still there, and the functionality is unchanged.

Even now, when I look at it, it’s hard to say exactly what’s wrong with this draft. The design epiphany usually solves something that is ephemeral, difficult to describe. It has to do with feel, form rather than function.

The design epiphany is usually preceded by a lot of design work that’s seemingly unproductive. Often I know deep-down the design isn’t working, yet I continue to improve each user-interface element, like I did here. I keep improving it until there is nothing obvious left to improve. Doing this helps draw out what’s really wrong with the design. After ruling out the obvious, there’s nothing left to re-evaluate but the fundamentals, the inherent structure of the design. I am ready for the design epiphany.

Soon after this draft, the design epiphany for Review happened.

The Design Epiphany

Arranging the reminders into a stack was the design epiphany for Review. The apps purpose is clearer, in sharper focus. This is a stack of reminders to work-through and address, not a “gallery” of reminders like the previous draft looks like in comparison.

The change in functionality is minimal. The only real difference is the disappearance of the navigator at the bottom. And even that had less to do with the design epiphany—the navigator could have remained at the bottom in the new design—and more to do with running the prototype. When I was using the prototype, I found I never used the navigator.

The Final Design

Now, when I describe Review to people, I say, “You open the app and see a stack of index cards to review with a message to yourself on each one. You address each reminder by pressing a button saying when you want to see it again: ‘tomorrow,’ ‘next week,’ or ‘next month.’”

A “stack of index cards to review,” the defining design element came very late in the process; that’s the design epiphany.

NetNewsWire	Reeder
Keyboard Shortcuts	Gestures
Standard UI	Custom UI
White	Texture
Instant	Animated
AppleScript	Huh?
Pro	Amateur
Following Apple’s Lead	Leading Apple
Past	Future

For the record, I’m firmly in the NetNewsWire camp—you can pry my NetNewsWire from my cold, dead hands—but the people have spoken. Hopefully Black Pixel can turn this around.

Sound Software

How engineers create artificial sounds to fool us:

“What manufacturers realised is when you go to see a car in a showroom you don’t hear the engine first,” says Prof Cox. “What you hear is the sound of the door opening and the sound of the door closing.

“It’s a really important first impression sound.”

But when manufacturers had to put extra bars in their side doors to comply with new safety standards the sounds of their doors started to change.

“They thought ‘How can we go about re-engineering the sound so it sounds more expensive and more high quality?’,” explained Prof Cox. To compensate for the added weight they had to make other parts of the car lighter and took weight from the catches and door mechanisms.

As a result, doors no longer made a satisfying clunk but had a tinny sound. Manufacturers then started experimenting with different sound effects.

Dampeners were introduced into the door cavity to muffle the tinny effect and engineers altered the locking mechanism to make just the right sort of click.

Sound is a relatively unexplored area of software design that I predict will get more attention in the future. It goes particularly well with the type of skeuomorphic design found in iOS.

Software Sounds I’ve Found Memorable

1. The Hit List has a rewarding sound when you check off a completed task.

2. Every time I use Dribbblr for iPad, I find myself absentmindedly tapping “shots” to hear the click sound they make.

3. I believe a large part of Tweetbot’s appeal is that it’s filled with nice custom sounds.

I’m particularly fond of what The Hit List has done; it provides a sensual reward for completing a desirable action. More manipulative software¹ could use this to encourage actions desirable to the software designer (as opposed to The Hit List which encourages actions desirable to the user). Want a user to click a button? Have it play a pleasing sound when they do so.

The rise of animations (with touch interfaces) is similar. Skeuomorphism, sound, and animation all increase software’s sensualism. All of this makes me think of my favorite software design quote:

When I talk about us having just seen the tip of the iceberg—that software is on a rise to a new place in the popular consciousness—it’s through the exploration of these new territories that the change will take place.

iA Writer and Branding

Information Architects’ iA Writer for Mac release kicked up a lot of dust. Most of it’s well-tread territory, about text editors and writing, whether they can help, and whether having less features is a feature. I’m not going to talk about any of those things, and I don’t think any of those things are what make iA Writer an interesting app.

No, there’s something more going on here, and I’ve got a hunch about what it is. About what’s that extra special thing that makes it so interesting. What I think it is, is branding. In particular, how iA Writer encapsulates its maker’s brand in a way that’s never been done before.

Years ago, when I worked for KidRobot, Paul said something that stuck with me. We’d just opened the first brick-and-mortar store, and it had these beautiful, custom-made display cases that presented the large, ~$70 figures in their best possible light. When you entered the store, these expensive, full-size figures were clearly the stars of the show. But we sold far more of the ~$5 mini-figures, and those sales made up a much larger percentage of revenue. Paul described this phenomena: “People come in here, and they love the experience of seeing the large figures, and they want to buy something so that they can walkout with a little piece of that experience.”

Here’s some copy from Information Architects’ about page:

We focus on basic principles of interface design and digital typography. The beauty of our designs is in how they work.

Here’s the same message reflected on iA Writers’ website:

We asked the best type, screen and graphic designers in the industry to work with us on the design—so you don’t need to worry about it.

The design of iA Writer reflects the design of Information Architects’ website, that reflects the design philosophy that they write about on their blog. Information Architects’ aren’t just selling an app, they selling a way to participate with their brand. A way to “walkout with a little piece of” their company¹.

This is different from the way most companies promote their apps. Most mimic Apple’s branding, posing an answer to the question: “how would Apple present this app?” Information Architects’ brand is unique and compelling in and of itself—and luckily doesn’t clash with Apple’s branding—and it’s iA’s brand that gives iA Writer its unique feel. It’s this strong representation of their brand, reinforced by their online presence, that makes such a compelling package.

None of this has anything to do with whether iA Writer is a great product. Of course it’s a great product. It’s a thoughtful and painstaking recreation of iA’s design philosophy in app form. I don’t think anyone would argue with that. That doesn’t mean criticizing it is meritless. But it does mean those criticisms have more to do with whether the reviewer considers the same things important as iA. And it means the question for the potential buyer, is whether they consider same things important. If they do, then it’s a great product for them.

The reason this is important to me is it’s a close approximation to what I’m trying to do with my app, my “company,” and this blog. The subtitle of this blog, “Diary of an App Junkie,” is a reflection of my affinity for writers like Burroughs, Hunter S. Thompson, and Bukowski. The boxes-as-horizontal-rule I use above are a riff on the section breaks from Gravity’s Rainbow. And it’s no coincidence that one my core design goals for Review was a way to collect and re-experience prose. What I am trying to do, with my presentation outside of the app, with the design of the app itself, is signal that this stuff is important to me. If these things are important to you too, then maybe you’ll like my app.

Statement of Intent

Five years ago I briefly wrote a productivity blog at 1Percenter¹. It enjoyed some initial success, and I promptly stopped writing. I hope this time will be different. But I know talk is cheap, and I promise nothing. But lets go back; the reason I’m starting this blog now is because of the reason I stopped writing then.

“Why am I doing this?” The question that unraveled my motivation the first time. I wasn’t interested in a blog-as-my-main-identity, like a Gruber or an (old) Merlin. I wish I could write for the sheer thrill of sharing, but I don’t have that kind of financial security. No, for me writing is slow and draining; it must result in income, somehow.

So I stopped writing. I dabbled. I experimented in other paths I needed to try. Then, triumphantly [sic], I returned to software².

I started developing for Apple devices seriously about a year ago. I dropped my first project, but I finished my second. I now have an iPad app I’m selling: Review for iPad.

That’s why I’m trying again now. The app is the first step of my plan to make money blogging. I’m looking for a symbiotic relationship between three things I love doing: UI design, programming, and blogging. This piece by Brent Simmons was a big influence:

My theory is that everybody has, or should have, one main thing where they can submerge themselves: everything else needs to be simpler.

I’m hoping, somehow, to make these three things into one thing: making and selling an app. Now, if I write a blog post people like, maybe they’ll buy my app.

This is just a bookend. One goes on each side to hold up the stuff in between. It doesn’t look like a book, it’s a stand type of thing, not like the books in between. Maybe it’s shaped like a gargoyle or something. It’s just a bookend. The important stuff is in between. I promise nothing…