The Magic of Affordance: A Design Principle Less Ordinary than it Affords

This Week:

Affordance: A Historical Perspective 

Ah, affordance—a word that sounds like a slang use for whether you can purchase something or not. “Mate, I got to check whether this pint is in the realms of my affordance.” I suppose when you look at it, this really isn’t far from the proper meaning.

Coined by psychologist James J. Gibson in the late 1970s, the term “affordance” refers to the actionable possibilities available in an environment, perceived directly by an individual without needing cognitive analysis. So let’s try that again in English…Affordance is when something shows you what it can do, like a door handle that makes you want to pull the door open or a button that looks like it should be pressed.

Gibson was not merely interested in what objects are, but what they do and how they function. The classic example? A chair isn’t just a chair; it’s something to sit on. Simple, right? Yet, this idea subtly reshaped how we think about interaction—paving the way for design principles that make our lives, well, liveable. 

Gibson once remarked, “Affordances are what they offer, what they furnish, whether good or ill.” Notice the nuance? It’s not about what an object is designed to do, but what it offers to the user. This shift in perspective moved us away from rigid design philosophies to a more fluid understanding of how objects and environments invite—or repel—certain actions. This notion affects how we go about designing things, whether they be useful tools or guiding principles. This quote reveals a lot about how deeply affordance affects everything from the spoon you eat your cereal with to the smartphone you’re reading this on. 

Affordance in Design: Making Interaction Intuitive 

Affordance in design is like a well-crafted joke—if you have to explain it, it’s probably not very good. Good design, therefore, should be self-explanatory. The handle on your door, the icons on your desktop, the “like” button on your favourite social media app—they all work because their functions are immediately apparent. You don't need a manual to figure out what to do.

Consider the humble door. Norman Doors, a term coined from Don Norman’s book The Design of Everyday Things, are those pesky doors that look like they should be pushed but actually need to be pulled, or vice versa. They defy their affordance. If you’ve ever awkwardly tugged on a door that required a push, you’ve experienced the failure of affordance in design. It’s not you: it’s the door. Affordance here should scream out the action—like a hand ready to shake yours or a pen begging to be clicked (again and again, until your co-workers shoot you dirty looks).

Now, let’s talk digital. The ubiquitous ‘hamburger menu’ (you know, those three little lines you tap to reveal more options on an app) works precisely because its affordance is universal—three lines mean “more” or “menu” regardless of language or context. It’s a visual shorthand that has embedded itself into our collective digital consciousness. How many design elements can claim to be so globally understood? 

Affordance in Culture: When Creativity Plays with Perception

Here’s where I like to get a bit arty. Let’s pivot to a couple of unexpected realms where affordance has been ingeniously leveraged—one in the world of dance, the other in sculpture.

First, consider the extraordinary work of Pina Bausch, the avant-garde choreographer who shattered conventions in modern dance. Her approach to affordance was revolutionary. In her piece Café Müller, dancers interact with a cluttered stage full of chairs and tables, not just as obstacles but as elements that shape the choreography itself. The affordance of these objects extends beyond their conventional use: they become partners in the dance, directing the flow of movement and emotion. What are chairs for? Sitting, right? Wrong. In Bausch’s world, they’re for leaping over, balancing on, and smashing into. It’s a beautiful subversion of expected affordance, which forces the audience to rethink the relationship between body, space, and object. So here we see how an artist challenges our notions of in-built affordance to communicate a different message.

Now, jump to the realm of sculpture with the work of Anish Kapoor. I lived and worked briefly in Chicago in my younger days. It’s a city I am supremely fond of. Down in Millennium Park, near to the Museum of Art, sits a large chrome bean-shaped sculpture by Anish Kapoor.

Titled Cloud Gate, it challenges our understanding of surface and reflection. What does a mirror afford? A simple reflection, perhaps. But Kapoor twists this affordance into something else entirely—an experience that bends perception, distorts reality, and invites you to interact in ways that make you question what you see and feel. It’s a really popular piece. On a sunny day it’s fun to watch all the visitors interacting with the mirrored surface, bending their reality. The affordance in this reflection becomes a tool for exploring the very nature of reality. You don’t just look at Kapoor’s work; you are enveloped by it, interacting with it on an emotional level that transcends the original purpose of a reflective surface. It’s really quite lovely.

What do Bausch and Kapoor have in common? Both challenge our assumptions of affordance, forcing us to see the world, and our interaction with it, in new and unexpected ways. They demonstrate that affordance in creativity is not just about utility but about expanding the possibilities of perception.

Affordance in Our Work at We Are Cognitive

At We Are Cognitive, affordance isn’t just a design principle; it’s embedded in our DNA. Whether we’re crafting a whiteboard animation, creating an explainer video, or developing rich illustrations, we think deeply about how our visual elements invite interaction, understanding, and engagement.

Take our whiteboard animations. The affordance here is clear: simplicity and clarity. We design each element so that it naturally guides the viewer’s eye, leading them through complex information in a way that feels intuitive and easy. The markers used to draw on the whiteboard, for example, afford a sense of ongoing creation—each stroke of the pen invites the viewer to anticipate the next, keeping them engaged from start to finish.

In our explainer videos, we use visual metaphors that tap into common affordances. Imagine explaining a complex process like blockchain (yes, the thing everyone pretends to understand) by likening it to a ledger in a book. The book’s pages afford turning; the ledger affords recording transactions. This visual analogy takes something abstract and grounds it in a familiar action, making it instantly understandable. That’s the power of affordance in design—turning the complex into the comprehensible. 

Affordance and Our Four Pillars

How does affordance tie into the four pillars of our ethos—Inform, Develop, Enable, Animate? Quite neatly, actually.

Inform: Affordance is about making information clear and intuitive. We strip away the unnecessary to let the message shine. Our visual storytelling ensures that the data is not just presented but experienced, guiding the audience effortlessly through the narrative.

Develop: When we teach, whether it’s through step-by-step instructions or explanatory graphics, we consider the affordance of every element. Is it easy to follow? Does the visual layout guide the user naturally? We ensure that every part of our design facilitates learning, turning complexity into clarity.

Enable: Affordance plays a crucial role in enabling decision-making. We use visual cues to signpost choices, making the path forward obvious and compelling. This is critical in everything from instructional videos to interactive graphics where the next steps need to be clear and actionable.

Animate: Finally, we inspire by using affordance to evoke emotion and imagination. Our illustrations and animations are not just about conveying information; they’re about creating an emotional journey. We invite our audience to see beyond the obvious, to explore the hidden affordances in our work that spark creativity and insight. 

Further Reading: The Design of Everyday Things by Don Norman

If you’re intrigued by how design can subtly shape behaviour and perception, I recommend Don Norman’s The Design of Everyday Things. This book is the bible of affordance in design. Norman takes you through a journey of everyday objects, revealing the hidden complexities behind simple interactions. Why do some doors frustrate us? Why do some products fail? It all boils down to affordance, or rather, the lack of it.

What makes this book a must-read is its practical wisdom. Norman doesn’t just pontificate; he provides real-world examples and actionable advice on how to design with affordance in mind. It’s the kind of book that changes the way you see the world—after reading it you’ll start noticing the hidden affordances (and missteps) in everything around you. For us at We Are Cognitive, where we strive to make the complex simple, the principles in this book are indispensable.

---

So, there you have it—affordance. Not just a fancy term, but a lens through which we can rethink design, creativity and the way we communicate. Whether you’re designing a chair, choreographing a dance, or creating a whiteboard animation, understanding affordance can transform your approach, making your work more intuitive, engaging, and ultimately, more human.