7 Matching Annotations
- Apr 2021
Note: The standard variant of the TextField is no longer documented in the Material Design guidelines (here's why), but Material-UI will continue to support it.
Enclosed text fields with a rectangular (box) shape performed better than those with a line affordance
An example of this would be a button that looks clickable but isn’t, underlined text that doesn’t contain a link, or a TV remote that turns on your lights but not the TV. False affordances are often present by mistake or occur due to lack of effective design techniques.
“when affordances are taken advantage of, the user knows what to do just by looking: no picture, label, or instruction needed.”
For instance, when you see a door handle, you assume its function is to open a door. When you see a light switch, you assume it can be flicked to turn on a light. When looking at a chair, you know it can be sat in. All of these are affordances. Don Norman refers to affordances as relationships in his book The Design of Everyday Things. He goes on to say that, “when affordances are taken advantage of, the user knows what to do just by looking: no picture, label, or instruction needed.”
What is an affordance? An affordance is a compelling indicator as to how an item operates and includes both its perceived and actual functions.
Many designers strive to create products that are so easy to navigate, their users can flow through them at first glance. To design something with this level of intuitiveness, it’s imperative designers understand affordances—what they are and how to use them.
- affordance (design)
- no label/instruction needed (intuitive)
- false affordance
- good user experience
- good example
- approachable/easy for newcomers
- UI design
- getting out of your way / don't even notice it because it just works
- design (general)