Human Experience Design

Human Experience Design

Pixels and the Human Condition

Neck deep in the design of a black-ops project — the type of project where you don’t talk about it until it’s done, and even then you keep the details to yourself— up to my chin wrestling a problem the way Jacob wrestled the Angel — suffering in the fight, getting my hip crushed, but refusing to back down — fighting until I’d earned the chance to name what I was up against — deep in what athletes and artists know as flow and starting to get the familiar buzzing of an idea scumbling through the substrate to the surface of articulation—in that moment, I dropped my stylus onto my desk and snuck out the back door. My cintiq sat there blinking at me, hardly able to imagine that I had gotten up to leave.

I jumped across Market Street and slipped into the nearby classical music conservatory to commit my favorite crime — a type of reverse truancy — where I sneak into classes I’m not actually signed up to take. No one expects outsiders to break into classical music lectures; it’s as easy as strolling by with a score in your hand.

Today’s master class centered on the Bach cello suites. Three master cello professors had flown in to critique a student’s playing.

What happened next requires a bit of an explanation.

As the student started to play, my normal vision took a backseat to my imagination and superimposed on top of what was actually there, I projected my own reductive/essential take on the events at hand.

My vision turned into a type of “pencil vision” where the whole world was a series of sketches. I saw the music appear as cresting waves of graphite that twisted from one musical thought to the next. The line turned en pointe across imaginary paper. My mind drew charcoal shadows of the players gripping their instruments and the professors leaning in with concern, scorn and occasional delight. The music then became inky-washed strokes with its thickness mapped to a type of importance velocity. The whole world turned into a monochromatic, pencil-and-charcoal-shaded inky-brushed animation of Bach’s brilliance.

One professor was not happy with the performance. He cut off the cellist mid-phrase and remanded the cellist to go back and identify the key he was in, not just the note he was playing. The player was flustered, he had to calculate for a second about the key. Was he in the fourth or the 5th of the 5th? One sec… This pause lit a fire under the professor, who saw a chance to teach a crucial lesson in interpreting Bach’s music.

My favorite, oldest idea about Bach’s best works came rushing back: that there is a second, slow-motion melody hidden in the harmonic progression. This secret melody makes the purported melody inconsequential to the poignancy of true story hidden in the walk back home to the tonic. It’s like the difference between the bones of a majestic piece of architecture and the tiny details carved in the filigree along its surface. Sure the details are lovely, but the story comes from bigger ideas.

The cellist, however, was caught up in the details — the surface dazzle — the fancy fingerwork he’d trained his whole life to be able to do — the show-off stuff that had kept him home at night in high school practicing etudes while his buddies who had not been cursed with the blessing of a calling were out getting drunk or causing trouble. The surface-snazziness had been hard-won, and it was nearly impossible for the cellist to imagine that it somehow wasn’t the important part of the piece.

The professor, unable to explain what was bothering him, ran over to the organ and started playing the second “hidden” melody, emphasizing the harmonic progression and the true story of the piece, urging the cellist to find the hidden core.

Typically, you play one note at a time on a cello. To play chords, you can play a few notes simultaneously if you really press your bow into the strings. But for certain multi-noted chords, you kind of smear or roll the chord as a series notes so that they create thicker texture and give the illusion of many voices in unison. Hidden inside of these rolls were fractal-like mini-versions of Bach’s the harmonic progression — the same secret melody hidden in plain daylight. The professor teased these out of the player, demanding different roll-ups to the chords, even if the cellist wasn’t really sure why one roll-up was better than another. He still wasn’t hearing the hidden secret.

Here’s an animation of the piece by musanim where you can start to see the hidden melody in the harmony (look for the big dots where cellist Vito Paternoster places extra emphasis)

The professor and the student pushed on, struggling, but trusting, and then with a jolt, the epiphany snapped into place in the brain and heart of the cellist and he finally started to hear the slow motion melody. And he started to gush… for the first time he heard Bach’s essay on the human condition as it marched from the tonic towards adventure and struggle and poignancy and then back home again. When the cellist finally found his way, all of us could feel it in the classroom and each nearly burst into tears with the truth of the human experience laid bare. Everyone, at some level, knows the poignancy of that return home.

Still deep in pencil-vision, still seeing the world as a combination of gesture lines of people, places, music and abstract emotion, my own puzzle started creeping back into my mind. That music was helping me solve the particular riddle that had driven me out of the office in the first place. In that moment, I thought:

What can Bach teach us about slow-time and fast-time in the same experience? About the details vs. the journey in design? About the pleasure and poignancy of the return home. About the importance of knowing the bones of the story regardless of the filigree.

I was experiencing pencil-vision for a reason. My mind started sketching what I needed to do next for the product experience I was working through.

Hidden in Bach’s slow motion fractal science, I had found a way forward. I took out a pad and started drawing the solution.

I know this working method isn’t typical. You expect designers to be drawing boxes inside boxes inside boxes inside boxes along a tidy grid with little tasteful round-rect corners and the rare circle or two and then notating the whole thing with a bunch of important looking arrows to direct the UX. You typically think of a designer making design-y decisions like “book or thin?”

Book or thin — that’s filigree — what matters are people and experiences.

Hold on. Experiences?

Apps aren’t just a collection of taps (that’s a piano sonata). Apps aren’t just swipe-states and text-entry (that’s an ATM). Apps portend the sum of human experience — if you do it right.

Ultimately there will be choices declared and a vocabulary expressed that adds up to a total design system — the epidermis of design — but before any of that can be put to use, the first step is to have some sense of what human experience is all about in the first place.

And understanding human experience starts with admitting what you’re actually designing — it isn’t just considering the pixels of your app, or the chrome of the phone or the download/sign-up flow. It’s the whole experience happening at that moment.

You’re never just designing pixels.
You are designing complements to the human condition.

You’re designing the kids on the bus, the honking horns, the crying baby, the crazy guy with the bag of bottle caps and smell of bar-b-q sauce, the overheard phone calls, the guy singing country classics, the herky-jerk rage of the bus driver screaming at pedestrians as the bus lurches forward — you’re designing the sticky feeling on the seats and satisfaction of a super-cute outfit and the empty pang of an earnest, flawed, hopeful bus rider who has recently lost her favorite aunt who pulls out her phone and then right in that moment, she sees something new.

You’re designing the stone wall filled with bullets and the streets turned to hell and the good people who ought to be home laughing with their families and sharing a meal who are now deaf from the shells blowing up the town square — you are designing that moment when a witness sends a single message to the rest of the world that calls out — I am here/this just happened/help us.

You are designing the bedside table lamp, the mattress, the blanket, the pajamas, the propped up pillows and the cup of hot chocolate and mug that contains it and the happy couple holding a tablet and watching the same movie they saw together on their first date.

You are designing the long roll of paper across the green vinyl bench in the examination room and the TV with the bad audio and the sneakers on the nurse and the pen on the clipboard and the paperwork on the desk and the photocopy of common questions about rare diseases as someone’s best friend taps for answers and tries to book next steps and stay calm and to not get too scared as the TV plays a game show where and the contestants silently jump and clap in obscene close-up.

You’re never just designing pixels.
You are designing complements to the human condition.

We are not omnipotent or omniscient, but we can strive to be omni-empathetic. We can be humble enough to know everything happens within the context of the life-story of others.

I left the conservatory and walked past the harshest section of Market street towards Union Square. There was a terrible traffic jam. I started sketching the bent lump of cars kinked and angry and unable to creep past a single choke-point in the road. I started thinking about the illusion of “user-choice” where we blame the user for getting stuck in the wrong lane at the wrong time. How can empathy help us untangle the knot? Retrace the steps. Why was every car here? Why don’t they turn? Mapping the series of one-way streets and freeway onramps paints a picture of a traffic trap that started four turns back.

I kept walking. What can we learn from watching tourists take selfies at the art museum about the importance of marking a specific time and place? What can we learn from their choices? How do the physical, social, temporal and cultural influences of the moment encourage different decisions?

How can we assure our work as artists, designers, writers, composers, choreographers, curators, and editors encourages the right decisions?

When do we give people what they think they want and when do we strike out and lead the crowd to somewhere new? Empathy, courage, and artistic conviction will wrestle inside our brains as we work through this particular puzzle. My hope for each of us trying to create is that our decisions will be born from an urgent insight into what makes us human.

Back to designing apps.

When you are designing an app or remixing high-culture, what aspects of the human condition are you hoping to encourage? For Twitter, the founders hoped to further the open exchange of information. They even went as far as to describe Twitter’s potential success as a “triumph of humanity, not a triumph of technology.”

Equally important — what aspects of the human condition would you like to reduce? If you hate clickbait, strive to create pathways that celebrate meaningful content. If you despise prejudice, can you design a system of engagement that engenders comity? Hate trolls? Invent a new mechanic (like the ingenious “karma score” on lookbook.nu).

Don’t start your design with a grid or a mock,
start with human experience.

You’ll know what product and design decisions to make once you know what you want to encourage, reveal or augment about being human. If you’re an artist — who gives a damn about trends or styles — show us what you know about being alive.

Message in a bottle—sign up for occasional (every other fortnight) emails on design, art, story and the human condition here.

###
Want more?
Read this about Story Maps