Overshare

I’m happy to announce the first release of Overshare, an open-source, soup-to-nuts sharing library for iOS. I’ve been working on this with Justin Williams for the last month or two.

What is Overshare? It’s the answer to the pit I felt in my stomach when I contemplated writing sharing code all over again for Unread. Sharing is so common, and so important, yet there’s no library out there that covers both the easy and complex cases gracefully.

Overshare makes it trivial to add rich sharing options to your iOS apps. In a word, Overshare has everything:

Head on over to the Overshare GitHub account and check it out!

Overshare will be shipping in the 1.0 of Unread, and will likely find its way into Riposte and Whisper, too. If you’re so inclined, we’d love for you to test Overshare in your development apps and let us know how it goes.

|  31 Oct 2013




Untouchable

I dislike iOS 7 so strongly that I feel inclined to begin this post with a disclaimer about how much I admire Apple. Apple is my hero. They’ve always inspired me to be better at what I do, even when I was an ICU nurse. But they are not perfect. I can and should criticize their worst work when I find it — out of my admiration for their best work.

To understand the biggest design mistake Apple made in iOS 7, you have to acknowledge a fact so obvious that it can be easily overlooked: touch. The essential characteristic of iOS is touch. Skin against glass. A round, squishy, inaccurate little fat pad at the end of your finger. Unlike the PCs that iOS devices replaced, everything you do on iOS is driven by your thumb pressed directly against the screen. There is no intermediary device. Simply put, the importance of touch on iOS cannot be overstated.

Good iOS app design is obsessed with touch. Bad iOS app design takes touch for granted. We’ve all seen apps that look like they were designed by talented print designers, apps with beautiful screenshots and tasteful typography that nevertheless fall apart disgracefully as soon as you actually try to use them. These apps don’t fail for lack of talent. They fail because their designers have the wrong process. They’re beginning with aesthetics and squeezing in the interactions wherever they have room to fit. The right process moves in the opposite direction. A good iOS app designer begins with touch, and only afterwards chooses aesthetics that complement and enhance the underlying touchable structure. iOS 7 has been designed with the wrong process.

What makes something touchable?

For things that scroll or zoom, touchability means that the content under your finger moves with your touch, without any lag or jitters. iOS 7 does as good a job with this as with previous iOS versions. In some cases it does it even better, as in the new swipe-to-go-back gesture in apps like Safari and Mail, or the bouncy physics that you can see when swiping up the Control Center.

For buttons, touchability requires something different. Touchable buttons need borders. By “borders” I don’t mean outlines, (although outlines are included in my usage of the word). I mean borders in a broader sense. A button is a tappable area, clearly delineated from the un-tappable content around it by an obvious border.

Borders around buttons can be real or implied. A real border is like the roundrect shape around a “Buy” button on the App Store. An implied border is like those around the toolbar icons at the bottom of the Safari screen.

Implied borders are easy to get wrong. Care must be taken to make sure that aesthetic choices don’t obscure where one button ends and another begins. This is why iOS app designers make all toolbar icons fit into a roughly square shape. When set together in a row, adequately spaced, the eye can perceive the 44-by-44 point implied border around each button.

iOS 7’s designers have abandoned bordered buttons in favor of borderless colored text. I think this choice is unjustifiable. It is the root cause of my deep dislike for how it feels to use iOS 7. It introduces unnecessary tension and makes everything less usable than it ought to be.

Color alone simply cannot be the way to identify a button. You don’t touch a color. You touch an area. To activate a button, you must touch a spot inside of its boundary. Text floating in the middle of vast whitespace doesn’t define a boundary. Only borders define boundaries.

Compare the navigation bar buttons from the native Twitter share sheet with those from Tweetbot’s navigation bar:

In the iOS 7 share sheet, there are three text labels: Cancel, Twitter, and Post. Which of these three are buttons and which ones are not? Those of us who are lucky enough to have good vision might correctly guess that the blue ones are buttons, but what if we were color blind? Furthermore, how do we know whether or not the title doubles as a tappable button, like the title button in Tweetbot that can be used to toggle the source list?

The Tweetbot title button is obvious because it’s enclosed by obvious borders. If Tweetbot were redesigned to strictly adhere to the iOS 7 paradigm, it would be impossible to know whether or not the title was tappable. What if this fictional Tweetbot made the title blue also. Wouldn’t that actually make it harder to distinguish buttons from inert labels?

There are many other examples in iOS 7 of how the lack of borders creates a dizzying confusion. The Contacts app is a particularly strong example:

How do we know that “John” and “Appleseed” are editable? They’re not blue. They’re black, borderless, and floating some inscrutable distance from one another and from the other elements above and below them. How do we know that they are separate text fields, and not one big multiline text view? Is “Company” editable? If so, where does it’s tappable region end and the “add phone” area begin? Likewise, what about the empty region between “add phone” and “add email”? Are the cell separator lines defining a tappable boundary around the “add email” row? You’d be forgiven for assuming so, since those lines create the impression of a tall tappable row, but you’d be wrong.

I imagine that folks might argue that web page links are examples of buttons made solely from colored text. Aren’t people already familiar enough with links on the web that using the same paradigm on iOS is a simple change?

My counterargument is that web links are subject to the same visual risks as native buttons on iOS. Links can be just as confusing if not treated carefully. Links that use not only a different color but also some other means of differentiation, like a heavier font weight or an underline, are easier to use than links based on color alone. This is why Mobile Safari paints a dark grey roundrect over a link’s tap boundary when it’s pressed. It makes it explicit exactly which link you’ve tapped:

Apple’s goal of refining iOS down to its essential elements is a noble one. The video that they played again at the October Event yesterday is full of inspiring ideas. Unfortunately, much of iOS 7 suffers from an overzealous fixation on the reduction of visual flourish, ignoring the deeper functional roles that the previous visual effects performed. Buttons don’t have to be made from green felt or stitched leather, but they still need to look like buttons.

|  23 Oct 2013




Creative Work and Christian Perfection: The Humility Required to do Your Best Work

Horace Dediu once said, of the idea of a business disrupting itself, “You have to be completely psychotic about it.”

The same is true of creative work. Hate the past. Scrutinize the present. Obsess over the future.

I spent a few years of my life pursuing a theology degree. It didn’t stick, but if there’s one thing I’ve kept from my churchy upbringing, it’s the concept of Christian Perfection. For John Wesley, the founder of the Methodist church, being good enough isn’t good enough. Perfection is the only good worth seeking. Wesley was batshit crazy, but he was profoundly influential on the people his life touched.

Perfection, for Wesley, isn’t possible. Yet it is the constant goal towards which good people strive just the same. Good works are done, one gets closer to perfection, but never close enough. There are victories along the way. With each victory, the temptation is to become enraptured by one’s own successes. The dangerous irony here is that being a better person is itself the source of the temptation that can ruin it all. Pride cometh…

As creative workers, we have to learn how to do our best every day as if for the first time, forgetting what we did before as if it was someone else’s success and not our own.

If you are a revolutionary technology company, or a film production company with a perfect track record, or a preeminent blogger, then goddammit you had better be goddamn perfect, and that means perpetually acknowledging how far you have left to go.

Remember how quick Steve Jobs was to dismiss his past successes?

I’ll close this with the best words Wesley ever wrote (and he filled many volumes before he died; emphasis added):

Fire is the symbol of love; and the love of God is the principle and the end of all our good works. But truth surpasses figure; and the fire of divine love has this advantage over material fire, that it can re-ascend to its source, and raise thither with it all the good works which it produces. And by this means it prevents their being corrupted by pride, vanity, or any evil mixture. But this cannot be done otherwise than by making these good works in a spiritual manner die in God, by a deep gratitude, which plunges the soul in him as in an abyss, with all that it is, and all the grace and works for which it is indebted to him; a gratitude, whereby the soul seems to empty itself of them, that they may return to their source, as rivers seem willing to empty themselves, when they pour themselves with all their waters into the sea.

|  27 Sep 2013




Instagram’s iOS 7 Update: They Blew It

Instagram released their iOS 7 update today. I’m sorry to report that it is not good.

The previous Instagram interface embodied the ideal iOS app design. It had oodles of personality while still retaining a mass-market appeal. There was a consistent set of styles applied to every screen, in a palette that was restrained, yet identifiably Instagram.

Today’s update is a mess. It’s awash with stylistic contradictions, as if their designers were caught between a desire to kowtow to Apple’s new guidelines and their own internally-cultivated sense of taste.

The app icon is still the realistically-detailed little camera we’ve all grown accustomed to, suggesting that the rest of the app hasn’t changed, when in fact the opposite is true.

The navigation bar has been reduced to a flat Instagram blue, dropping all of the tiny details from the previous version. Strangely, the navigation bar is only blue on the main timeline. All the other screens use a system-default, blurred-white navigation bar. Swiping back from a detail screen into the main timeline creates some extreme disharmony as the status bar disappears on one half of the display.

Square avatars have been replaced with circular ones, which have long since lapsed from cool to trendy to tacky. John Gruber makes a great observation about them:

And for Instagram in particular, it breaks a certain elegance — your avatar was the same thing as a post, a square image.

Making matters worse, the status bar animates in a harsh manner from white-on-blue to black-on-white when you scroll down into your timeline. To be fair, this is as much Apple’s fault as Instagram’s for creating the problem in the first place. Instagram’s poor solution is a great example of why apps shouldn’t have to accomodate an overlapping status bar. The iOS 6 plain black status bar is still the best solution for most cases.

The camera interface is almost unchanged from the iOS 6 version, except for the removal of the subtle noise that provided texture for the large grey toolbar areas. Buttons have borders, shadows, and soft bevels (and they look great). The contrast between the stylized camera screens and the flat default look of the rest of the app is the most troublesome contradiction. As my friend Preshit Deorukhakar said on App.net:

Did Instagram designers forget there’s a Camera View in the app when designing the iOS 7 update?

Tim Van Damme, the primary designer of the iOS 6 interface, left Instagram this summer for Dropbox. I have no idea how much he was involved in the iOS 7 redesign. As an outside observer, the portions of Van Damme’s work still visible in the app look like splotches of blue-grey on a half-finished whitewashed wall. The spirit and unity of his work is gone. Those picking up where he left off need to either fully commit to the new flat style, or else strike out on a bolder tack. Half-assing a push into two contradictory directions at once is a sure way of getting lost in the weeds.

|  25 Sep 2013




The Death and Afterlife of Thalidomide

The New York Times posted a fascinating and heartbreaking mini-documentary on thalidomide. Once a popular and useful medication, thalidomide became infamous for the severe physical birth defects it causes when taken by pregnant women. You may have heard of this drug. What you might not know is that it is still manufactured for limited use in the treatment of several conditions, including leprosy.

Before making apps and before working as an ICU nurse, I worked as a pharmacy technician at a small town pharmacy. We carried thalidomide, if I recall correctly. Drugs like thalidomide (or Accutane, a commonly-prescribed acne medication with similar risks of devastating birth defects) are dispensed with extreme caution, even in a small town pharmacy. There’s a mind-boggling amount of paperwork and patient education every time someone is prescribed one of these drugs.

Not all drugs are this dangerous, but it’s still a good idea to understand any drugs you take regularly. Don’t hesitate to visit your pharmacist and ask her questions.

Pro tip: ask your pharmacist for one of the manufacturer’s drug information pamphlets — not the consumer pamphlets, but the richly-detailed ones that are printed on thin white paper, folded into stout squares, and glued to the backs of medical-grade drug packaging. The pharmacy probably throws most of these in the trash anyway. They have great summaries of the side effects seen during clinical trials, including comments on which ones were most frequently reported. Much of it is readable to a layperson, if you’re determined to learn something. You can see one in this photo, taped to the top of the small amoxicillin bottle.

Another pro tip: only capitalize brand names for drugs. Generic names should be set in lowercase.

|  23 Sep 2013