Sara and I wrote an article for UX Booth, “Compassionate UX”, and it was published last week. Two quotes (out of a ~1,750-word article):
When we get laser-focused on positive outcomes, we often fail to notice how things might go terribly wrong. But whether you’re working on something as complex as artificial intelligence or as simple as a line of microcopy, you’ll create the best products when you intentionally set aside your goals of “delight” or “engagement,” and make time to think critically about where your product might break.
It’s easy to see this as an uncomfortable restriction on the creative process, and that’s actually a pretty accurate description. Of course thinking about users’ varied identities and emotional states creates limiting factors. But that’s what design is: it is a creative solution to a set of constraints.
Anil Dash was kind enough to write a wonderful foreword for the book, in which he perfectly describes the background we were working against:
Two billion people now have some kind of access to internet technologies, and almost all of them are spending more and more time with their thumbs flicking across their phones. And the technology they’re using has a real impact on their lives. They don’t use an app to “share photos”; they use it to maintain a relationship with distant family. They don’t need to do “online banking”; they need to lend a friend money to help them out of a jam. Nobody wants to learn a complicated set of privacy controls; they just want to be able to express themselves without antagonizing bosses or in-laws.
Our thesis, against that, was to say, “As personal and digital lives become closer and effectively merge, the things we design will have to work harder and harder to deal with real people in all their messy complexity. How can we start people thinking about this, and what tools can we give them?” That’s what we strove to create, and now you can judge for yourself whether we succeeded.
I’ll be honest: we were pretty scared as we wrote it. This is not a topic area that’s gotten a ton of attention, and in a lot of ways we were breaking new ground—but, at the same time, we were very aware that there was existing research and knowledge in related areas, so we wanted to be sure we were inclusive or, and respectful of, that work. We talked to a lot of people in a variety of disciplines, trying to make sure we brought in information that would help the reader and not flying in the face of things that were already known.
So you can imagine our relief and gratitude as we’ve heard glowing reactions from people who read preview drafts—among them Kim Goodwin, Indi Young, Sara Soueidan, Caren Litherland, and Karen McGrane. Paul Ford said, “Anyone who aspires to build global products that people love should read this book now,” and Kate Kiefer Lee said, “It will be required reading on my team.”
You might think cover blurbs like those are pure marketing fluff, and maybe in some genres they are. For us, they serve double duty: to let you know that people who know what they’re talking about believe we know what we’re talking about, and also to let us know that. There were days we weren’t entirely certain.
To be clear, this isn’t a book about forever treating people with kid gloves. We say “compassion isn’t coddling”, and that’s absolutely the case. An error message still needs to convey the error; an account lockout still needs to keep the account locked. But how we convey errors or lockouts, and how we make people aware of the possible ramifications of their actions, is critical. Just as there are good ways and bad ways to commiserate with a grieving friend or handle a difficult work situation, there are good ways and bad ways to approach people in our designs.
As I said before, we need to deal with real people, in all their messy complexity. We hope Design for Real Life is the start of a whole new conversation within our field, one that will teach Sara and me just as much as anyone else about how we can be more thoughtful and humane in what we create.
It’s been a busy couple of weeks for Facebook, in terms of compassionate design decisions.
First they announced that they aren’t adding a Dislike button, but they are adding a set of six emoji reactions to the “Like” button, so you can indicate a wider range of emotion. Some people immediately linked this to Slack, as if emoji reactions hadn’t been a thing on social media for the last couple of years. I happened to see Sally Herships asking “what are your thoughts?” about it on Twitter (heh), and oh, I had thoughts. I ended up sharing some of those thoughts by phone, and one of them was part of a segment on American Public Media’s Marketplace.
It’s funny, in a way, that my thought on marketing and advertisers was what made it into the piece, because I think that was literally my whole thought about that side of things. Most of the rest of my conversation with Sally was about how Facebook could use these reactions as a way to avoid insensitive design choices. As an example, a status update that gets lots of interaction in the frowny-face or sad-face realm could be avoided when it comes to things like Year in Review. I said something to the effect of:
People are sharing everything about their lives, positive and negative, billions of us every day. That isn’t going to stop, so it’s great to see Facebook making changes to meet us where we are, or at least meet us partway.
These reaction emoji almost certainly aren’t the last word on this, but they’re a credible initial attempt. In more than one sense, they’re a first step into a larger world.
Next, Facebook introduced filtering for its On This Day (OTD) feature. This is another step in the evolution of On This Day, one that’s very welcome. Facebook had already been revising its language to be more humane, shifting from simple “Relive this memory” to nuanced language expressing care and openness.
With its new OTD preferences, Facebook now lets you define ranges of dates you’d like to be blacklisted, in effect, as well as people you don’t want to see memories about. I’d commented on the lack of this, back when OTD launched:
…what I notice here is what’s missing: I don’t see any reference to an ability to opt out of On This Day, either for certain days or altogether.
So far as I can tell, you still can’t opt out entirely; even if you turn off all notifications, you can still get memories inserted into your timeline. For me, I see about one a month, more or less. But here’s the interesting thing: they’re almost never my memories. In what I still regard as a major gamble by Facebook, On This Day will show you posts, pictures, and videos posted by someone else, but on which you were tagged. I presume (though I have no simple way to test) that adding a person in the OTD filtering preferences will prevent you from seeing memories in which they’re tagged as well as memories they posted.
If so, that’s a really smart step, as I can only imagine how a spiteful ex might abuse OTD. It still leaves open the possibility of old posts that you don’t remember being tagged on suddenly appearing. In many cases, that will be a delightful moment, but in many others, the exact opposite of that. This is why I regard Facebook’s decision to show you posts from other people a gamble. Even if they show unwanted memories to just 1% of their user base—a ridiculously low percentage—that’s literally 10 million people a day.
Still: wrinkles or no, flaws or no, the presence of filtering preferences is a major enhancement to On This Day. I could block out all of June 2014, if I so chose. There might be years where I blocked it, and others where I removed the block. The important thing is that I’m being given that capability, in an environment that’s already designed to show me memories and acknowledge that it’s easy to get that wrong. The user experience for adding filters is still clunky, but much like the reaction emoji, I view this as a credible first try, not the final word.
All this has made for some interesting Slack discussions between me and Sara, as we literally just finished the manuscript for our forthcoming, still-not-quite-titled-but-we’re-really-close-honest book on compassion in design. Which has references to things like On This Day, so we’re already revising a book that hasn’t even been published yet. And when will it be published? We’re pulling for early next year, which sounds like a long way away until you remember that 2015 is getting close to done.
Kudos to Facebook, both for its efforts to be kinder in what they do and for its willingness to try. Not many businesses, let alone social-media titans, have had the courage to think about what can go wrong in this realm, let alone actually acknowledge missteps and work to do better. Well done.
It’s time for a semi-periodic update on CSS: The Definitive Guide, 4th Edition! The basic news is that things are proceeding, albeit slowly. Eight chapters are even now available as ebooks or, in most cases, print-on-demand titles. Behold:
CSS and Documents, which covers the raw basics of how CSS is associated with HTML, including some of the more obscure ways of strapping external styles to the document as well as media query syntax. It’s free to download in any of the various formats O’Reilly offers.
Selectors, Specificity, and the Cascade, which combines two chapters to cover all of the various Level 3 selector patterns as well as the inner details of how specificity, inheritance, and cascade.
Values, Units and Colors, which covers all the various ways you can label numbers as well as use strings. It also takes advantage of the new cheapness of color printing to use a bunch of nice color-value figures that aren’t forced to be all in grayscale.
CSS Fonts, which dives into the gory details of @font-face and how it can deeply affect the use of font-related properties, both those we use widely as well as many that are quickly gaining browser support.
CSS Text, which covers all the text styles that aren’t concerned with setting the font face—stuff like indenting, decoration, drop shadows, white-space handling, and so on.
Basic Visual Formatting in CSS, which covers how block, inline, inline-block, and other boxes are constructed, including the surprisingly-complicated topic of how lines of text are constructed. Very fundamental stuff, but of course fundamentals are called that for a reason.
Transforms in CSS, which is currently FREE in ebook format, covers the transform property and its closely related properties. 2D, 3D, it’s all here.
Colors, Backgrounds, and Gradients, which covers those three topics in FULL GLORIOUS COLOR, fittingly enough. Curious about the new background sizing options? Ever wondered exactly how linear and radial gradients are constructed? This book will tell you all that, and more.
Here’s what I have planned to write next:
Padding, Borders, Outlines, and Margins — including the surprisingly tricky border-image
Positioning – basically an update, with new and unexpected twists that have been revealed over the years (case in point)
Grid Layout – though this is coming faster than many of us realize, I may put this one off for a little bit while we see how browser implementations go, and find out what changes happen as a result
My co-author, Estelle, has these three chapters/short books currently in process:
Beyond those 14 chapters, we have eight more on the roster, covering topics like floating, multicolumn layout, shapes, and more. CSS is big now, y’all.
So that’s where we are right now. Our hope is to have the whole thing written by the middle of 2016, at which point some interesting questions will have to be answered. While most of the book is fine in grayscale, there are some chapters (like Colors, Backgrounds, and Gradients) that really beenfit from being in color. Printing a 22-chapter book in color would make it punishingly expensive, even with today’s drastically lower cost of color printing. So what to do?
Not to mention, printing a 22-chapter book is its own level of difficulty. Even if we assume an average of 40 pages a chapter—an unreasonabnly low figure, but let’s go with it—that’s still a nine hundred page book, once you add front and back matter. The binding requirements alone gets us into the realm of punishingly expensive, even without color.
Of course, ebook readers don’t have to care about any of that, but some people (like me) really do prefer paper. So there will be some interesting discussions. Print in two volumes? Sell the individual chapter books in a giant boxed set, Chronicles of Narnia style? We’ll see!
Originally published at Medium on July 30th, 2015.
Yesterday, I decided to try importing a story to Medium. I’d hunted around for a way to auto-post to Medium from WordPress, which runs the blog portion of meyerweb (the rest is mostly HTML, with a little PHP here and there), and hadn’t found one. Then I found the “Import story” feature on Medium and thought, Sure, why not?
So I tried it out on my most recent post, which also happened to have some code in it, as my posts sometimes do. The process was, as anyone who’s used it can tell you, very simple. Paste in a URL and the content gets sucked in.
Well, except for code blocks.
I’d structured the block with a pre element, as I always do, and yet the line-breaking was stripped away. It looks like my indentation tabs were preserved, but without the linefeeds, they didn’t have nearly the same utility.
The real problem is that the importation of the code block stopped cold at the first <, dropping the rest of the code on the floor. Now, I admit, I didn’t escape or entity-ize the character in my source, and maybe that was the problem. Still, I feel like an import tool should be a little smarter about things like less-than symbols on import. Otherwise, how many less-than-threes will end up as just plain threes?
Fortunately, the fix was simple: I went back to the original post, drag-selected the whole code block, copied, went back to Medium, drag-selected the mangled code, and hit ⌘V. Done. It was properly formatted and no less-than terminations occurred.
Today, I’m experimenting with writing my post on Medium first, after which I’ll repost it at meyerweb. This is likely the only time I’ll do it in that order, given my experience over here. Captions are deucedly hard to edit (at least in my browser of choice, Firefox Nightly), the apparent inability to add simple decorations like border to images, and the apparently intentional, active enforcement of single-space-after-sentence even when editing annoy me deeply. (Yes, that’s how I roll. Let’s not have the spacing argument here, please.)
I can see why Medium appeals to so many. It’s pretty frictionless, a lot more so than almost any other tool of its kind I’ve used. I mean, my WordPress install is pretty frictionless to me, but that’s because I invested a lot of time customizing it to be that way. Much like my browser, mail client, and other essential tools.
So anyway, that’s what I found during import and authoring on Medium. Here’s hoping this posts properly, and without the stray “in” that’s somehow shown up in my post, and which I can’t select, mouse to delete or otherwise remove through non-Inspector means. If only I could prepend an “f”!
I have recently, perhaps inevitably, taken up woodworking as a hobby. It’s just clichéd enough to be credible, isn’t it? Web, wood, maybe it’s in the leading “w”.
A programmer friend and I get together Wednesday evenings to try our hand at what is currently best described as rough carpentry. The usual reason to take up a “physical-world” hobby like woodworking is to “get away from the computer for a while, man!” But of course we pull out our iPhones to use as calculators, look up techniques, or find online tools that can help us. The laptops stay indoors, but computers and the internet still smooth our way.
In web terms, we’re past “hello world” and at about the point where we understand the basics of HTML and have set a few colors and faces with beginner CSS. We could put up a single-column fan site if that were the goal, but not much more than that. We’re still at the stage of making a lot of mistakes and not knowing if our problems spring entirely from not knowing how to use our tools, or also from not knowing enough to realize the tools themselves are deficient. We’re figuring things out as we go, hitting up YouTube for how-to guides on just about everything. Wikipedia may aspire to be the site of record for Things of Import, but YouTube holds the sum total of humanity’s practical knowledge, hidden amongst all the pop-star and cat videos.
A lot of the best practices map back and forth, too. Planning ahead is a core competency, and the more you practice, the better you get at it. Measurement is vital, and cleverness is as useful as it is dangerous. The importance of quality tools can’t be overstated. There are a lot of (very) specialized tools available, but you can get really far with the core set of flexible, time-honored basics. As long as you have a boatload of clamps, that is.
The one major difference is that there is no versioning in woodworking. It’s like building a project with only the “Save” command—no milestones, no repositories, no undo. When you do something, you’re committing to altering the project with no take-backs. If you get it wrong, you have to find a way to patch over the problem. If you get it really wrong, you have to scrap what you just did and replace the botched part. And if you get it really, really wrong, all you can do is scrap the whole thing and start over.
So far we haven’t had to scrap anything. Our first couple of projects were the classic starters: a simple bookshelf, a firewood box, a more complex bookshelf. For each, we’ve intentionally stepped up the complexity, a bit at a time. The first bookshelf was just screwed together, but the pieces were all pretty much the right size and properly aligned. The firewood box was also screwed together, but it involved angled cuts and hinges and sealant. The second bookshelf involved a wood router in a variety of ways, both structural and decorative.
As in networking, we swore a lot at the router, but it got us where we needed to be. Eventually, that is, once we figured out how to properly configure it and deal with its quirks.
I can’t deny that there’s a visceral satisfaction in picking up a hammer and whacking on a thing until it’s properly assembled, or disassembled, as the case may be. There’s definitely a triumph in finding out you did all the measuring and cutting and aligning just right, much like the rush you get when your first major coding project does what you meant it to do, except more so because you’ve wrestled atoms into doing your bidding. That’s literal orders of magnitude beyond wrangling electrons.
Our next steps are what I assume is the usual second phase: building a wood shop in order to learn how to use a wood shop. We’re moving up to building fold-down work surfaces with tool storage, custom-fitted wood storage, and braced shelves. That experience will enable us to move into other, more complicated projects. Some we already have in mind. Others will suggest themselves to us. At every step, we’ll look for new skills to try and practice.
And that, I think, is the real ultimate goal here: to teach ourselves new things, to enrich our skill sets and create useful objects thereby.
“Why are you crying?” I asked my son. He wasn’t actually crying so much as sniffling, but the expression on his face was enough to justify the question. He just shook his head, so I sat down on the steps, pulled him into my lap, and snuggled him close. You can still do that when they’re four years old.
“You’ve seemed sad this morning, buddy,” I said gently. “Can you tell me what’s wrong?”
“I miss Rebecca. She was the best big sister ever.”
I hugged him close, as if he were a life preserver, and at that moment he might well have been. “She was, Joshua. I miss her too, so, so—” I couldn’t speak for a moment. The tears were running ceaselessly down my face, spattering both our shirts. He looked into my eyes and his own tears stopped as he searched my face with a kind of tender curiosity.
“Oh, I’m sorry, Joshua. I’m so, so sorry. It wasn’t anyone’s fault. There was nothing we could do. We did everything we could. We loved her, and made her life as wonderful as possible. That’s what we did. Right?”
He nodded, still looking at me intently.
“Oh, buddy, I’m sorry. I’m sorry. I’m so sorry.”
If Joshua had asked why I was saying sorry, I would have told him I wasn’t apologizing because I felt guilty, but rather because I was sorry in the sense of sorrowful. Sorry he had to experience the death of his older sister, who died on her sixth birthday of aggressive brain cancer. Who had been gone just about 51 weeks on the day we had that conversation. Sorry she had been terminally ill, sorry the world is as harsh and unfair as it is, sorry his best friend in the world is dead.
But not sorry out of responsibility or guilt. At least, that’s what I would have said, but I’d have been violating one of my basic tenets of parenting. Because I would have been lying to him.
As the parent of a dead child, I experience survivor’s guilt. I know the term is generally defined to apply to people like those who survived the 9/11 attacks, tortured by the knowledge that they lived while others died. Those who make it out of plane crashes, or war zones. The friends and family of suicide victims, including the parents of children who take their own lives.
I can assure you it also affects the parents of children who died of what we bitterly label natural causes. My daughter Rebecca had glioblastoma multiforme, something her genetics preordained and no medicine could hope to cure. Her last MRI, taken five days before she died, showed so many emerging tumors that the doctors didn’t bother to count them. There was, as I said to Joshua, nothing anyone could do to save her.
It doesn’t matter. I still ask myself what I should have done differently, as if there were some winning strategy I was too stupid or blind or arrogant to see. I tell myself that we all did everything possible, but I feel a profound sense of failure. This is the guilt surviving parents bear. Why did she die, and we live? How can we live with ourselves, knowing we failed to save her? For that matter, having failed at our most basic duty, what right do we have to call ourselves parents at all?
Parents are supposed to protect their children, even at the cost of their own lives. I remember the nights I lay in bed next to her sleeping form, my forehead lightly pressed against hers, silently begging any god or demon who might hear me to draw the cancer out of her head and into mine, to name its price if my life was not enough, the pressure of my desperation pounding in my temples.
Did I not pray hard enough, or fervently enough, or offer enough of a sacrifice? Did I not pay attention at the right moment, and overlook the treatment that would have saved her?
You may shake your head, assuring me I did all I could and then some, gently insisting I should be proud of what my wife, Kat, and I did, and how we made her short life the best it could be. Many, many people have done all that and more. I’ve listened to them, and told them I hear them and agree with them. There’s even some truth to my words. But only some.
Kat has it even worse. With her advanced medical degrees, she feels like she should have found a cure. She knows intellectually how ludicrous that sounds, the idea that in ten months she should have found a cure for an incurable disease, but in her heart she carries the guilt. I can tell her she did everything she could and then some, that she should be proud of what she did and how hard she searched for treatment and how she made Rebecca’s short life the best it could be. I do tell her that, and I believe every word.
But she does not.
It was one year to the day after Rebecca’s death, the day that would have been her seventh birthday.The prayers were finished, the memories shared, and Kat and I sat in front of the newly-unveiled grave marker looking at all the stones people had set atop it in remembrance.
I had reached out to move one of the stones off the word “loved” when my fingers brushed the sparkling silver-blue granite of marker itself. Suddenly I was sobbing, blind to everything around me except Kat’s hand on my back as I hunched over, my hand pressed against the gravestone of my daughter.
“I’m sorry, Little Spark,” I sobbed to her gravestone. “I’m so sorry.”
“Why are you sorry?” said Kat gently. “You have nothing to apologize for. You did everything you—”
I shook my head, tears sluicing off the inside of my glasses. I whispered it again and again: “I’m sorry.”
Of course Kat’s right, that I have nothing to apologize for. I know that. There was nothing any of us could do except what we did: Fight for her, and make sure her short life was full of wonder and love. I am proud of what we did, but I still carry the guilt of what I could not do: Save my child’s life. I still carry the guilt of what I do now: Continue to survive when my child did not.
I would give almost anything to be able to tell Rebecca how sorry I am, over and over, to beg her forgiveness for my failure to do the impossible. For letting her down, for violating her trust in me to fix everything, the way parents are supposed to.
Just as I begged Joshua his forgiveness, as he huddled in my lap.
If you do something you love for long enough, it gets into your bones. But more than that, the things adjacent to it do as well.
Since I got started on the web, very nearly 22 years ago now, I’ve never really seen myself as a designer. Granted, I did some visual design in the early days, because anyone who set up a web site back then had to be the designer: there was nobody else. No graphic designers would deign to look at the web, and no “web designers” yet existed. We were Web Masters because we had to be, drawing buttons and laying out content along with writing code and doing UX and UI and IA and everything else.
So I did design when I had to, but I always knew I wasn’t a capital-D Designer. I knew this in the same way I knew I was not a boulder nor an odor: it wasn’t a failing or even a lack, but just what was true and even unremarkable. I was a code monkey who knew his way around Photoshop and could mimic what he saw around him decently enough, but I didn’t have the creative vision or training or, really, inclination to generate my own, unique work.
As we passed out of that epoch of the web, I was more than content to stop trying to design and instead be an enabler of design. My efforts to teach HTML and CSS had twinned, helical aims: to help anyone who wanted to create a web site share their thoughts, and to help any designer who wanted to create a visual effect share their vision. I was a technical author, a developer, a sometime observer of design, but never a Designer. I knew Designers by then, and I knew they possessed a skill and focus I did not.
Which was okay. After all, I possessed a skill and focus they did not. Our work was complementary.
What I didn’t realize was that, over all those years, as the knowledge I shared seeped into their bones and became second nature, the same thing was happening in reverse.
For the past few months, I’ve been managing a design project, getting a ton of help from Jason Santa Maria; but I’ve also been the annoying client, making unreasonable demands of everyone involved. I insisted on changes of direction partway through, and coped with changes of understanding at other points in the process. I refused to listen to reason at one point, and yielded to reality at another. For most of it, I compared font faces and sizing, trying to decide which I liked best, telling Jason I wished I could have a little of option A, a little of option B, a dash of option C, struggling to put into words what I could almost see.
Among my friends, I’m vaguely infamous for not being able to tell, at a glance, the difference between Helvetica and Arial. I’ve seen the detailed analyses of the two, and if I had the exact same run of text in each face, sitting side by side, I could probably do a credible job of figuring out which was which, but give me a standalone block of sans-serif text in Ariatica or Helvetial and my odds of knowing which it is are literally no better than a coin flip.
And yet, there I was, staring at the same layout set in various font faces, feeling the sense of each, obsessed with spacing and intervals and kerning, examining which had the best italics while trying to decide if italics should even be used, if their use conveyed the right message. I scrutinized the spacing between blocks of text, the alignment of fragments of information, the rhythm of the entire piece, every bit of content. It wasn’t enough that it be passable, or decent, or even good; it had to be right. I focused on all the details as well as the overall picture with a will and intensity I had never felt before.
It wasn’t easy. I massaged my temples as the stress of needing to make exactly the right choice overwhelmed me; I paced around my office, glaring at the alternatives on the monitor every time I passed by; I felt tears of frustration rise as I ran into yet another setback and knew that the final result would not be everything I had originally wanted it to be. I stood in someone else’s office and rode herd on their archaic software setup, literally telling them where and how many times to click, because that’s what was necessary to get the job done properly. I wrote and rewrote emails to the various parties in the project, masking my battered spirit as best I could while still being clear about where things stood and where I wanted them to go.
Not, as I say, by myself: Jason was invaluable to getting me off to the right start, keeping me on the right track, and helping me through the setbacks. I doubt I could have done a tenth as well without him. But as we progressed, I increasingly felt like I knew what his answers to my questions would be. My inexperience and fear of error and just plain fear meant I kept checking in with him, but with every iteration, I felt more confident that I already knew the right answers. In a lot of cases, I made the changes I was already sure he would make, and Jason’s feedback confirmed that I had done right.
Over two decades, I had slowly, unwittingly absorbed everything I needed for this project. It had seeped into me, creeping out of a thousand Keynote slides and a million words, written and spoken, from my friends and their friends and all the people they looked up to and quoted.
Gradually, I had become a capital-D Designer. I had a very specific intent to render, and with help and focus, I made the end product as reflective of my intent as possible. I knew when the design felt wrong, but more importantly, I knew when the design felt right. And I could see, at first with Jason’s help but increasingly on my own, how to get from one to the other.
This morning, the result was unveiled—literally unveiled, ritually, at the direction of our congregation’s rabbi. A block of sparkling silver-blue granite carved with a few words of English and Hebrew. A compact arrangement of text bearing more emotion and meaning than anything I have ever done, horrifying and beautiful, set flush into the earth of Cleveland Heights, where similar markers will one day be set for me and for my wife.
Everything I absorbed over all those years, everything I learned by choice or by chance, and most of all the help I received from everyone who’d ever shared their knowledge and insights with me, all made that possible. Made me a Designer.