Fundamental Principles of Interaction

Welcome to my blog!

I want to preface my first entry here with just a few words before I get into the the 4 principles of interaction. First off, I am really excited to be re-reading a section Don Norman’s “Design of Everyday Things”. I started my design journey reading this book without any experience in the world of UX and visual design. After that, I fell in love with how many great interfaces and products there were in the world, that I now look at them incredibly differently after reading this book. I highly recommend it to all designers whether they are students, junior designers or anyone for that matter!

I had the pleasure of meeting Don Norman at the San Diego Global Service Jam where he gave a talk on Human Centered Design. One valuable quote from that talk was ” The hardest thing to ask are the right questions.” This gave me some good food for thought for many design processes no matter the type of design you do. Getting to the root of big design problems by asking “why” often makes sure you are solving the right problem.

Me and fellow jammers with Don Norman!

For this post, I am going to go over the first few pages in his book that talk about the 4 principles of interaction:

Affordance

Signifiers

Mapping

Feedback

The real world object that can apply to all of these principles is a video game controller. I will break down these various principles into digestible parts and also show how they translate to a web based interface as well as some additional examples in video game UI.

What is really great about a video game controller is it would be considered an affordance as these controllers are created to fit naturally in a persons hands. Regardless of what the controller is connected to there is a call to action that thumbsticks can move around and buttons can be pressed. Don Norman explains in his book that an affordance “is a relationship between the properties of an object and the capabilities of the agent that determine just how the object could possibly be used.” (The Design of Everyday Things, 2013) “Could possibly” is a key phrase here as every object doesn’t always have this level of discoverability. Controllers are light and fit easily in the grasp of a persons hands and affords controlling a device.

Signifiers are found all over the device with small icon and letter that tells user what the button is called. As described in the first chapter signifiers are meant to communicate to a person what actions are possible. This can be a sign, an icon or a light indicating a status. Colors are also placed  on each button to be able to quickly differentiate the available options. Additionally, depending on what their console is running it will show a corresponding action on screen using that same icon. Without the interface the controller still shows a signifier when the device is on with blinking lights on the Home button in the center!


Mapping is a way people can visually identify what is being controlled, moved or being changed. Since controllers have thumb-sticks and a directional pad, the device provides a sense of direction for the user to navigate menus and move throughout a game. These settings can always be customized but their purpose is to map and orient the player in-game.

Feedback is primarily shown on screen or depending on the controller type you have lights may flash or stay solid based on what you pressed. One particularly common form of feedback is through vibration. In-game vibration is triggered to the controller when something happens, like a death, movement, a rock falling etc… this vibration is meant to add that level of “You are encountering an event or occurrence” through haptic feedback. Vibration is a telling sign of movement in-game to hopefully add another level of immersion for players. Additionally some controllers (Specifically Playstation) have audio and lights on their controller when certain actions are taking place!

Within web/mobile and gaming world, these same principles can be applied. Here are some examples I created across different interfaces. Additionally, signifiers can be found in all examples below since there is corresponding text next to each section, button or progress bar to help users understand the information they are looking at.

Blizzard Entertainments landing page website.
User Interface for the video game: Overwatch Here you can see the various details in the scope of snipe that indicated where the player is focused in on.
Interface for the Battle.net launcher.

All in all, good design begins with fundamental of being to discover and understand an interface before making it visually interesting. It is important as designer to practice these principles often to ensure users can have an enjoyable experience. Experience should help not hurt, an it’s important to know who we design for… our users! Giving meaning and purpose behind all design decision is instrumental to not only functionality, but delight!

 

 

2 thoughts on “Fundamental Principles of Interaction

  1. That is awesome that y0u were able to meet Don! I also enjoyed how you were able to relate everything to a common item most people have in their homes. My son was sitting with me while I was reading your post, I made him go get our controller and showed him everything that you were talking about! Very easy to read and understand.

    1. Thats awesome Nick, thank you for reading! We never really think about “everyday things” but when we notice, it’s quite incredible to see the work put into their design.

Leave a Reply

Your email address will not be published. Required fields are marked *