Mindful Design: How and Why to Make Design Decisions for the Good of Those Using Your Product

by Scott Riley

Learn to create seamless designs backed by a responsible understanding of the human mind. This book examines how human behavior can be used to integrate your product design into lifestyle, rather than interrupt it, and make decisions for the good of those that are using your product.

Mindful Design introduces the areas of brain science that matter to designers, and passionately explains how those areas affect each human’s day-to-day experiences with products and interfaces. You will learn about the neurological aspects and limitations of human vision and perception; about our attachment to harmony and dissonance, such as visual harmony, musical harmony; and about our brain’s propensity towards pattern recognition and how we perceive the world cognitively.

In the second half of the book you will focus on the practical application of what you have learned, specific to interaction and interface design. Real-world examples are used throughout so that you can really see how design is impacting our everyday digital experience.

Design is a responsibility, but not enough designers understand the human mind or the process of thought. This book explores the key factors involved and shows you how to make the right design choices.

Genres: Design, Nonfiction

338 pages, Paperback

Published January 14, 2019

Reviews

[Sundarraj Kaushik · Rating 5 out of 5]

A wonderful book touching many aspects of design. One should not expect any technical suggestions or any process suggestions.

The key message that the author is giving in this is that instead of following a linear design where the user is guided through a path to achieve a goal one should design systems which allow the users to explore and learn the system and let them use the system in ways not anticipated by the designer. The second message that the author gives is that we need to move way from the penchant to make applications addictive and instead make applications which are assistive. I.e. applications that help the users solve a real problem in their life. One needs to be more empathetic and ethical in one's design. To be more empathetic one needs to consider a diverse set of persona and not just "white males" who can afford a $1000+ mobile phone and keep upgrading.

Here are some excerpts (some extracts and some summaries) from the book.

Linearity and Non Linearity
===========================
Furthermore, we can and should embrace the avoidance of attempted forced motivation. Great design can lie simply in the acceptance that many times our products plainly do not need any explicit plan for reward-motivated behavior—whether that’s because they’re autotelic and provide their own intrinsic fun or value, or simply because the value they do provide is in their invisibility and essentialism.
To make a product attractive rather than just talk about the features
1. Let the user experience the features by running them through a sample.
2. Solve a user's problem rather than give a technical mechanism. E.g. Adobe photoshop allows the users to "remove red eyes", "darken the photograph", "lighten the photograph" etc.
Gauging intent is globally important, but especially when ushering someone into a linear flow from a more open, explorative environment. This comes purely down to the parallel between increased linearity and reduced control. By limiting options and directing someone through a constrained path, you’re essentially taking control away from them. Do this for long enough, and you run the risk of people becoming disinterested and losing motivation. Once you’re sure that a linear process is necessary and you’ve determined the essential elements and features for this linear flow, keep the following optimizations in mind:
1. Limit Options. The first step to linearity is to limit the available options and actions to the bare minimum required. When entering into a linear flow, we can reasonably assume that we must cater for a period of focused attention. That means being ruthless with the options we present and removing any distractions, clearly grouping and spacing related elements, and ensuring that copy is terse and clear.
2. Understand the Path to Completion. By their nature, linear paths have an ideal endpoint. Keep this endpoint in mind and constantly question how any decision you make allows for progression toward this.
3. Display Progression. Similarly, find ways to communicate someone’s progression through this process. “Linear” doesn’t always mean short and doesn’t ever have to mean compressed. In many cases, our linear flows might be broken down into multiple smaller steps. Whether our linear flows are explicitly stepped through or progress is a little more ambiguous, we should look to communicate how far toward this aforementioned end goal someone is at any point. This can be done through explicit progress indicators, such as numbered steps or progress bars, or through implicit indicators, such as Almost there! prompts.
4. Be Explicit and Timely. Linear moments in interfaces suffer immensely if ambiguity is introduced into the equation. Furthermore, delayed responses—such as waiting until the end state of a checkout flow to show an error in the first section of the address form—can be equally as catastrophic. Shallow processing and linear flows go hand-in-hand, so ensure that any signifiers and mental models used in communicating concepts are as universally recognizable as possible. A truly linear interface, although rarely encountered in real life, would rely exclusively on recognition and not require any learning or memorizing at all.
5. Design the End State. One of the most important aspects of any flow, but specifically a linear one, is how we present the success or completion state. If the flow involves some form of deletion, then take the learnings of empty states and apply them here. If it involves the creation of data, such as a new Tweet, then present an All done!’ message of some kind and, wherever possible, show their creation in context. If someone has given up control to follow a constrained and linear path to creating, removing, or editing something, the least we can do is let them see clearly that their changes were successful.

By thinking beyond the obvious visuals and offering multiple paths to the same solution, encouraging exploration and learning, and consistently providing timely feedback, we’re able to create environments that are open enough for self-expression and perceived mastery, but not so opaque or idiosyncratic that they’re too dense to be usable.
VIM and Trello are two examples which follow the non-linearity path. Trello balances between the two.
Research is what takes the amorphous, fuzzy blob that is the idea we have of the people who we’re designing for and turns it into a sharpened, well-documented set of findings, examples, hypotheses, and problem definitions. Most importantly though, everything we do at this stage is bubbling with potential sources of empathy and compassion. This is our chance to truly learn about the humans for whom we’re creating our products. To observe our audience, in all their fallibility and idiosyncrasy, while our project is still comparatively free of bias and guesswork is the best chance we get to truly understand why the thing we’re creating needs to exist.

On Storyboarding
================
While storyboarding an important aspect is to capture the emotions associated with the different actions in addition to the friction that the user may encounter in using the interface.
Storyboarding allows us to present a condensed version of the moment story we’re trying to tell while still communicating the fundamental goals, motivations, points of friction, climax, and ending that constitute our moments.
A simple approach to storyboarding is to stick to nine panels, have your beginning panel set the scene—preferably with goals and motivations—spend the next six panels incorporating your potential app steps, and finally have panel seven as the moment of climax, panel eight as your ending, and panel nine as a moment of reflection. You can (and should) produce multiple storyboards per moment if you need to communicate more points of friction, different scenarios, and contrasting or conflicting goals and motivations. My advice for a storyboard is to follow a simple framework, starting with a template and following some set steps
Like any group brainstorming session, you’ll want to go away after the meeting and prune the ideas and suggestions that arose. While nobody wants to see their ideas discarded (and this is why we do it after the meeting, as opposed to looking a developer straight in the eye and tearing their Post-it up in front of them), an integral part of our jobs is ensuring that our work is representative and grounded. If the CEO thinks that someone will feel “delighted and in complete awe” at the “seeing-pricing-for-the-first-time” panel in a story, we’ll need to find a way to ease that out in favor of the more realistic “concerned-about-financial-impact” and “wondering-if-this-product-is-actually-worth-it” suggestions we might have. (In this case, feel free to do the whole staring-while-tearing-a-Post-it-up power play—it’s only the CEO.)
An obvious red flag is the kind of unbridled optimism that anyone who might describe a company as “my baby” (founders, CEOs, investors who like to overstep boundaries, etc.) might display. Being overly attached to a product’s success to the point where one believes it to be a flawless solution, devoid of any potential malaise, represents a special kind of myopia. In fact, one of the most important skills you can learn as a designer (that, unfortunately, tends to only come with experience) is the ability to quell this kind of optimism-ad-nauseum without appearing as if you’re a prodigal spoilsport who only exists to ruin dreams and scare children.
Other red flags include opinions from people who have lived a life of sheltered, abundant privilege, who have yet to prove capable of genuine empathy (apologies, but unless you’re working on an app to dodge mansion tax or a croquet-court finder, then coddling the opinions of ever-comfortable people can be one of the fastest ways to sink a product), suggestions that revolve completely around revenue, ideas that rely on manipulation, and proposals that appear completely rooted in “competitor X does this.” (Tread lightly with that last one, though, as competitor research is a hugely valuable insight into convention and mental model consistency.)

Conclusions
===========
I feel that, in calling ourselves designers (of any kind), we accept a certain implicit responsibility to leave the world a little better off than we found it. Furthermore, I believe that the privileged among us should caveat that responsibility—to leave the world a little better than we found it—for people more vulnerable than us.
The ability of technology to augment human existence is an undoubtedly exciting concept and, with the amount of money and innovation in the technology industry right now, the impact of digital products on the world stands to be monumental. Yet, we still operate in an industry that’s rife with naivety, bias, and systemic oppression. As designers, this means that we’re often presented with ideas and problem definitions that are rarely harmonious with humans outside of the affluent world of tech entrepreneurship.
To achieve these goals, especially in an industry that seems to operate by its own rules, eschewing ethics in the name of profit under the cover of the mystique of programming and technological innovation, we must ensure that our process serves to elevate those who are far too often underrepresented in our work.
When an industry decides that plucky upstart founders who solve problems and get it done belong on a pedestal, when the distribution of venture capital is based on an almost instinctive appraisal of the usefulness of a product, when a gross misinterpretation of the satire that is meritocracy becomes the prevalent religion to its core demographic of white 20-something Californians, then the problems that get deemed worthy of solving tend to have a very noticeable, very white, very upper-middle-class feel to them.
While tech’s diversity struggles aren’t the only reason we seem so content to disregard self-expression and creativity in the name of control and dominance, I don’t believe it’s a coincidence that a predominantly white, predominantly male, predominantly affluent cohort presents as a hegemony with these apparent values.
Somewhere in the pursuit for unfettered growth and profit, design’s perceived role has shifted from democratization and empowerment through technology to invasive and manipulative vehicles of pop science at the behest of founders and investors. At a point in time when democracy is failing its most vulnerable, where racism and jingoism permeate every crack in the facade of social media, where the voices of those calling for a white ethnostate are amplified exponentially on a platform that is grossly incapable of suppressing hate speech, where online tools are used in months-long hate campaigns, I feel it’s an important time to revisit our ethical responsibilities. While it would be absurd to lay the blame of such sociopolitical malaise squarely at the feet of design and technology, I feel that, somewhere, somehow, our industry has dehumanized people at a time where we need most to see the vulnerabilities we design for. By breaking away from the common trend of self-serving, narrowly defined problem spaces, by seeing people—all types of people—for who they are, we can look to bring humanity and compassion back into our process.
People are messed up. They do weird things to themselves that fly in the face of survival instinct. Some of us harm ourselves because of chemical imbalances in our brains. Some of us have eating disorders. Some of us have drug addictions. Some of us can’t answer the phone or hold a conversation with a stranger due to anxiety and panic. We’re human beings and we grieve and we screw up and we get excited about silly things and we’re sometimes just as likely to sabotage ourselves as we are to celebrate or reflect positively on our life.
Until we factor this into our work by showing compassion, researching properly, educating ourselves on our privileges and biases, and until we earn our ridiculous salaries, day rates, egregious company perks, and the pedestals our industry so adores by actively designing and building for vulnerable, oppressed, and divergent human beings—how can we possibly say we’re making this world a better place? By releasing yet another product that is only usable by those who meet our ridiculous salaries, day rates, egregious company perks, and the pedestals our industry so adores by actively designing and building for vulnerable, oppressed, and divergent human beings—how can we possibly say we’re making this world a better place? By releasing yet another product that is only usable by those who meet our ridiculously narrow defaults, by those who are capable of the cognitive cost of “normal” attentional faculty—whether through not experiencing poverty, anxiety, sociological impact, or neurodivergence—or by those who simply fit nicely into our abstracted assumption of what makes for a normal human being, what are we really contributing?
Homogeneity’s grip on the technology industry is something that needs to be tackled from multiple angles—and design is but one of these. Many of the tech darling products we aggrandize to the point of hero worship boil down, in essence, into a category of “things white dudes’ parents used to do for them until they moved to silicon valley”. These products make it easy and cheap to get rides to work, while capitalizing on systemic oppression and non-unionized labor. They make it simple to get dinner on the table, while heaping more pressure on an already overworked and underpaid industry of service and delivery workers. They make it easier to get your laundry done, easier to find a place for your fourth vacation of the year. Some of them even make that grueling last half mile of your trip to work slightly more bearable by polluting the streets with electric micro-scooters.
There are many trade-offs to this incessant pursuit of lukewarm innovation, though. An astonishing number of products that we hold up as trailblazing innovators (or unicorns if you want to be as insufferable as the tech press) exist because they’ve found technological solutions to exploiting loopholes. Whether that’s “technology” companies that are able to drive down prices due to dodging government regulations, CEOs with the charismatic depth of an STD claiming anti-union rhetoric as the key to success, the tone-deaf social media platform that refuses to do anything about its Nazi infestation lest it damage vanity metrics, or just your average everyday monolithic company paying 1% of the tax it’s supposed to—the apparent need for tech to subvert humanity and democracy to succeed is a vile byproduct of untempered attempts at innovation—using nothing but a framework of rhetoric, blame deflection, and a tone-deaf agreement that certain, arbitrary metrics are somehow directly translatable into fiscal value.
Modern-day tech capitalism relies on an onion-skin model of subversion. Everything from where the money comes from to pay salaries to the Rosetta-Stone-needed levels of legalese in terms and conditions to the general public’s willingness to gloss over the systemic oppression that is as integral to the bedrock of tech innovations as the server stacks and app stores they exist on (“Well, most of my clothes are made in sweatshops, so why should I care that my taxi driver gets paid an unlivable wage?”) feeds into this implicit, societal permission we give 20-something tech dudes to “go off and innovate.”
All of this leads us to a landscape where social media platforms suddenly become arbiters of perceived truth and conduits of political clout—where the companies that make the devices, operating systems, and browsers on which we live incrementally more of our lives are responsible for everything from waking us up in the morning to helping us maintain our mental health. The more this perpetuates, the more of a responsibility design becomes, and the harder we must work to serve the needs of real, fallible people.
Design, then, leaves us with a choice. As the interface between an underlying system and the model of that system in someone’s head, we can either introspect our system through the lens of humanity, or we can attempt to contort and convince and persuade humanity to interact with our system in ways we desire. The former is, simply, our job; but it’s hard, and we’ll face battles and make enemies, and we’ll likely get pushed back from many sides. The latter perpetuates the rather dystopian notion that humanity—including our cognitive faculty and even our very concept of self—is subservient to technology. That being hooked on apps, feeling the dopamine squirt of notifications and generally being the good user is simply the price of admission into a world of possibilities. At least, a world of possibilities if you’re a well-off white person in or around a major city with a decent tech hub and own a £1,000 phone.
Design should exist to serve humanity. Real humanity. Not some essence or abstraction of humanity, not the privileged, amalgamated assumptions of four white people sitting down to solve the next mundane problem in their lives. But real, fallible, vulnerable human beings. Humans whose daily struggles and sacrifices in the face of a world and an industry that shows them nothing but apathy and disdain deserve more than to just being a casual footnote on a persona, or a box-checking exercise in our research.

[Jassim · Rating 4 out of 5]

This is one of those book that every designer should read. The author dive deep into the science of design and explain the essence in detail.
The book is written for beginners but I felt the ideas are not really comprehendible for beginners, especially because of the way of articulations. I wish the editing could have done better and the size could be shorter.

[Hanan A.S. · Rating 4 out of 5]

Was it any good?
Yes. I picked up this book as my responsible read for my month off. It was recommended to me by a friend and fellow UX enthusiast so I was prepared for a treat. I was very satisfied.

While it wasn’t exactly a beach read, it was most definitely a very enjoyable and extremely educational one. It is written by someone who truly understands what the true purpose of design is and takes steps to spread that understanding.

The only part I didn’t like was going into all that detail in the design-music analogy. It is hard to follow for someone who has never read music or played an instrument.
Nevertheless; I recommend it to all UX, UI and digital product designers. Yes, not just UI designers. Design was never about pushing pixels. It was always about helping someone perform a task.

⭐️ Four Shiny-Glittery-Stars.
----

Design, when it’s done right, makes you fall in love with it as job every single day.
And God, I love design. What other job in the world has you researching people’s needs and diving into human nature one day; analyzing data the next day, solving problems based on that data another day then becoming a full-blown artist and animator to give that solution a usable interface. Test, repeat.

And this is why I enjoyed this book so much. It respects the key role of design in everyone’s life and helps readers appreciate it as well. It reminds me of Ruined by Design, which is a tough but crucial read for anyone who calls themselves a designer.

Major lessons and outtakes from the book
The entire book is packed full of learnings. These are only the major ones that stuck with me after finishing the book.

1. You had me at vulnerable ❤
user testing is pointless if we don’t consider the vulnerable, exhausted and impaired people.

→People are mentally whiplashed
Life is full of noise & distractions. Everything around us is trying so hard to hijack our attention. It takes energy to regain focus after single distraction.
Therefore when designing any product or interface we should design for the tired, distracted and vulnerable user if we really aim to build a successful product.

→Real Testing happens where real action happens
Will people mostly use the product in crowded cafes? test in cafes. In the street in a usually sunny city? then test it in a busy street under sunlight.

What’s the point of a user test in a nice, quiet, air-conditioned room on a device with no notifications or distractions? it does not remotely represent actual use cases or users’ real state of mind.

2. Help people Focus
because of all these distractions, we should help users find signal within all the noise. When designing UI, make the current task the most prominent part of the interface. Think of Medium’s and Calmly Writer’s writing and/or reading experiences.

→ Use contrast to drive people’s attention to a learning experience or an important part in the screen.
→ Contrast is more about the difference between an element and its surroundings than its actual color.
→ Animated elements are the most contrasting part of any interface. Use animation wisely and only to drive focus to things the user cares about.
→ Don’t cut user’s focus while loading. Let them use the interface while blocking only the loading element.
→ Communicate changes in state to help people understand their action’s effect on the interface.
→ Communicate errors clearly and make sure it’s understandable by any user. Provide next-step assistance and help people overcome this obstacle in their user-journey.

3. Help people learn
Some professional products are built with complex functions, that is ok. We just need to take a mindful approach to easing people into the product.

→Offer to teach people key features on app launch, give them a template to fast forward their work, then provide tool specific help within the main UI.

Some product apply this beautifully. The book mentions Photoshop which is truly an amazing example of helping people use a ginormous product. From my experience this also applies to Airtable, Coda and Sketchbook for iOS and MacOS.

→Use mental models
Help people understand the product using analogies that compare complex concepts to models they know and understand. Like using Folders model to help non-technical users understand the data organization system within computers.

Or the use of eraser, patch, scissors tools naming in visual design softwares.

→ Innovate and test
When you don’t know if something really innovative is valued by people is test and see if they bother to learn it.

4. BE A HUMAN
It is easy to fall into functional mode and forget that the product is meant to be used by humans. Make sure to think of a feature from an emotional perspective as well as functional.
i.e. do you think someone would be happy if you show them a memory from a loved one’s death from a year back?

Our work is an infusion of emotion and craft an idea and giving a damn.
— Scott Riley, Mindful design

[Stevie Buckley · Rating 5 out of 5]

What’s plainly obvious from this book is the sheer amount of time and effort put into ensuring the author’s point of view is communicated to the reader as clearly and as accessibly as possible.

Anyone that works with of builds digital/technical products, platforms, or teams should invest in this book. It really is an investment. It’s not possible to consume Scott’s wisdom and experience and not immediately be better at what you do and how you do it.

Also, the cover art is so good it’ll look amazing on your coffee table because you care about those things don’t you Benjamin?

[marga_gaga · Rating 4 out of 5]

I was looking for something to read and chanced upon this one. It has 2 parts. First is some theory about design and second is the execution of a project. I wasn't interested in doing something, so mostly skipped the later.

In the first part again there are 5 chapters. And the first and fifth chapter are quite good. Especially the first one named "Attention and Distraction". That first chapter can be read by anyone really and they would most likely find it enjoyable.

So I think, if you have some time to spare, read the first chapter of this book. It would be time well spent.

[Cassidy · Rating 4 out of 5]

A refreshing overview of how we can design our experience and subsequently relationship to our online tools and applications in a more productice and constructive manner.