As a front-end engineer, or specifically, an Android UI Engineer, I have a lot of time to work with designers. But there are a lot of concepts in design I am not familiar with. So I asked them how I can learn design, but not being a designer. Then they recommended this book to me.
I read it, and feel it’s really helpful and useful. It’s not only about UI design, many principles can apply to other designs as well: software design, landscape design, product design, option design. After read this book, I learned the explanation on how certain design decisions are made.
I would definitely forgot most principles, so I wrote this post to transcribe all principles and short description from the book, later I can just come here to recall them.
A high percentage of effects in any large system are caused by a low percentage of variables.
Objects and environments should be designed to be usable, without modification, by as many people as possible.
An instructional technique that helps people understand new information in terms of what they already know.
Aesthetic designs are perceived as easier to use than less-aesthetic designs.
A property in which the physical characteristics of an object or environment influence its function.
The placement of elements such that edges line up along common rows or columns, or their bodies along a common center.
A tendency to find forms that appear humanoid or exhibit human-like characteristics appealing.
Universal patterns of theme and form resulting from innate biases or dispositions.
Alignment based on the area of elements versus the edges of elements.
A tendency to see attractive people as more intelligent, competent, moral, and sociable than unattractive people.
A tendency to see people and things with baby-faced features as more naive, helpless, and honest than those with mature features.
Environments rich in nature views and imagery reduce stress and enhance focus and concentration.
A relationship between the perceived height of a ceiling and cognition. High ceilings promote abstract thinking and creativity. Low ceilings promote concrete and detail-oriented thinking.
A technique of combining many units of information into a limited number of units or chunks, so that the information is easier to process and remember.
A technique used to associate a stimulus with an unconscious physical or emotional response.
A tendency to perceive a set of individual elements as a single, recognizable pattern, rather than multiple, individual elements.
A tendency to seek consistence among attitudes, thoughts, and beliefs.
Color in used in design to attract attention, group elements, indicate meaning, and enhance aesthetics.
Elements that move in the same direction are perceived to be more related than elements that move in different directions or are stationary.
A method of illustrating relationships and patterns in system behaviors by representing two or more system variables in a controlled way.
A technique for preventing unintended actions by requiring verification of the actions before they are performed.
The usability of a system is improved when similar parts are expressed in similar ways.
The tendency to perceive objects as unchanging, despite changes in sensory input.
A method of limiting the actions that can be performed on a system.
A tendency to favor objects with contours over objects with sharp angles or points.
The level of control provided by a system should be related to the proficiency and experience levels of the people using the system.
A process in which similar characteristics evolve independently in multiple systems.
An activity will be pursued only if its benefits are equal to or greater than the costs.
A space that has territorial markers, opportunities for surveillance, and clear indications of activity and ownership.
A phenomenon of memory in which information that is analyzed deeply is better recalled than information that is analyzed superficially.
A design process based on consensus building, group decision making, and extensive iteration.
Traces of use or wear that indicate preferred methods of interaction with an object or environment.
Successful products typically follow four stages of creation: requirements, design, development, and testing.
A point of physical or attentional entry into a design.
An action or omission of action yielding an unintended results. [There are two basic types of error: slips and mistakes.]
A phenomenon in which perception and behavior changes as a result of personal expectations or the expectations of others.
Repeated exposure to stimuli for which people have neutral feelings will increase the likability of the stimuli.
The ratio of face to body in an image that influences the way the person in the image is perceived.
The use of more elements than is thought to be necessary to offset the effects of unknown variables and prevent system failure.
A relationship between variables in a system where the consequences of an event feed back into the system as input, modifying the event in the future.
A sequence of numbers in which each number is the sum of the preceding two.
Elements are perceived as either figures (objects of focus) or ground (the rest of the perceptual field).
The time required to move to a target is a function of the target size and distance to the target.
There are five ways to organize information: category, time, location, alphabet, and continuum.
As the flexibility of a system increases, the usability of the system decrease.
Designs should help people avoid errors and minimize the negative consequences of errors when they do occur.
Beauty in design results from purity of function.
A technique that influences decision making and judgment by manipulating the way information is presented.
The ordered sequence of responses to acute stress in humans.
The quality of system output is dependent on the quality of system input.
A ratio within the element of a form, such as height to width, approximating 0.618.
Elements arranged in a straight line or a smooth curve are perceived as a group, and are interpreted as being more related than elements not on the line or curve.
A diagram that describes the general pattern followed by the eyes when looking at evenly distributed, homogeneous information.
The time it takes to make a decision increase as the number of alternative increases.
Hierarchical organization is the simplest structure for visualizing and understanding complexity. [There are three basic ways to visually represent hierarchy: trees, nests, and stairs.]
In order for a design to be successful, it must meet people’s basic needs before it can attempt to satisfy higher-level needs. [Five key levels of needs: functionality, reliability, usability, proficiency, creativity.]
A technique for bringing attention to an area of text or image.
A tendency to favor filling blank spaces with objects and elements over leaving spaces blank or empty.
A tendency for male children to be interested in hunting-related objects and activities, and female children to be interested in nurturing-related objects and activities.
The use of pictorial images to improve the recognition and recall of signs and controls. [There are four types of iconic representation: similar, example, symbolic, and arbitrary.]
A state of mental focus so intense that awareness of the “real” world is lost, generally resulting in a feeling of joy and satisfaction.
The failure to cognitively process a stimulus that is presented in clear view, leaving the observer without any awareness or memory of the stimulus.
A phenomenon in which mental processing is made slower and less accurate by competing mental processes.
A method of information presentation in which information is presented in descending order of importance.
A process of repeating a set of operations until a specific result in achieved.
A tendency to interpret ambiguous images as simple and complete, versus complex and incomplete.
The process of organizing information into related groupings in order to manage complexity and reinforce relationships in the information.
The visual clarity of text generally based on the size, typeface, contrast, text block, and spacing of the characters used.
All products progress sequentially through four stages of existence: introduction, growth, maturity, and decline.
A relationship between controls and their movements or effects. Good mapping between controls and their effects results in greater ease of use.
People understand and interact with systems and environments based on mental representations developed from experience.
The act of copying properties of familiar objects, organisms, or environments in order to realize specific benefits afforded by those properties. [There are three basic kinds of mimicry in design: surface, behavioral, and functional.]
A method of reorganizing information to make the information easier to remember.
A method of managing system complexity that involves dividing large systems into multiple, smaller self-contained systems.
A method for determining the most commercially viable aesthetic for a design.
A tendency to prefer faces in which the eyes, nose, lips, and other features are close to the average of a population.
A term used to describe a set of data, that when plotted, forms the shape of a symmetrical, bell-shaped curve.
A bias against ideas and innovations that originate elsewhere.
A method for predictably altering behavior without restricting options or significantly charging incentives.
Given a choice between functionally equivalent designs, the simplest design should be selected.
A technique used to modify behavior by reinforcing desired behaviors, and ignoring or punishing undesired behaviors.
A phenomenon of visual processing in which certain line orientations are more quickly and easily processed and discriminated than other line orientations.
The greater the effort to accomplish a task, the less likely the task will be accomplished successfully. [Performance load consists of two types of loads: cognitive load and kinematic load.]
The designs that help people perform optimally are often not the same as the designs that people find most desirable.
A technique that employs fictitious users to guide decision making regarding feature, interactions, aesthetics.
Pictures are remembered better than words.
The activation of specific concepts in memory for the purposes of influencing subsequent behaviors.
A strategy for managing information complexity in which only necessary or requested information is displayed at any given time.
The relationship between the elements of a design and the meaning they convey. Designs with high propositional density are more interesting and memorable than designs with low propositional density.
A tendency to prefer environments with unobstructed views(prospects) and areas of concealment and retreat(refuges).
The use of simplified and incomplete models of a design to explore ideas, elaborate requirements, refine specifications, and test functionality. [There are three basic kinds of prototyping: concept, throwaway, and evolutionary.]
Elements that are close together are perceived to be more related than elements that are father apart.
The degree to which prose can be understood, based on the complexity of words and sentences.
Memory for recognizing things is better than memory for recalling things.
A tendency to perceive women wearing red as more attractive and men wearing red as more dominant.
The use of more elements than necessary to maintain the performance of a system in the event of failure of one or more of the elements. [There are four kinds of redundancy: divers, homogeneous, active, and passive.]
A technique for communicating novel information using elements of common understanding.
A technique of composition in which a medium is divided into thirds, creating aesthetic positions for the primary elements of a design.
It is often preferable to settle for a satisfactory solution, rather than pursue an optimal solution.
a tendency to prefer savanna-like environments to other types of environments.
A tendency to assume that a system that works at one scale will also work at a smaller or larger scale. [There are two basic kinds of scaling assumptions to avoid when growing or shrinking design: load assumptions, and interaction assumptions.]
Items and opportunities are become more desirable when they are perceived to be in short supply or occur infrequently. [Five tactics are commonly employed to apply the principle: exclusive information, limited access, limited time, limited number, suddenness.]
A property in which a form is made up of parts similar to the whole or to one another.
A phenomenon of memory in which items presented at the beginning and end of a list are made likely to be recalled than items in the middle of a list.
A technique used to teach a desired behavior by reinforcing increasingly approximations of the behavior.
The ratio of relevant to irrelevant information in a display. The highest possible signal-to-noise ratio is desirable in design.
Elements that are similar are perceived to be more related than elements that are dissimilar.
A method for dramatically increasing the recognition, recall, and unsolicited sharing of an idea or expression. [Six variables appear to be key in the creation of sticky ideas: simplicity, surprise, concreteness, emotion, story.]
A method of creating imagery, emotions, and understanding of events through an interaction between a storyteller and an audience. [The fundamental elements are: setting, character, plot, invisibility, mood, movement.]
There are three ways to organize materials to support a load or to contain and protect something: mass structures, frame structures, and shell structures.
A property of visual equivalence among elements in a form. [There are three basic types of symmetry: reflection, rotation, and translation.]
An ability to detect threatening stimuli more efficiently than nonthreatening stimuli.
A tendency to see objects and patterns as three-dimensional when certain visual cues are present.
A tendency to interpret shaded or dark areas of an object as shadows resulting from a light source above the object.
Anthropomorphic forms are appealing when they are dissimilar or identical to humans, but unappealing when they are very similar to humans.
The act of measuring certain sensitive variable in a system can either alter them, and confound the accuracy of the measurement.
Elements that are connected by uniform visual properties, such as color, are perceived to be more related than elements that are not connected.
A tendency to find a product desirable because it has a high price.
The usability of a system is improved when its status and methods of use are clearly visible.
A phenomenon in which an image achieves optimal clarity due to resonance between the spatial frequency of the image and the observer’s distance from the image.
A phenomenon of memory in which noticeably different things are more likely to be recalled than common things. [The von Restorff effect occurs when there is a difference in context or a difference in experience.]
Objects and environments that embody naturalness, simplicity, and subtle imperfection achieve a deeper, more meaningful aesthetic.
A preference for a particular ratio of waist size to hip size in men and women. [Men prefer women with a waist-to-hip ratio between .67 and .80. Women prefer men with a waist-to-hip ratio between .85 and .95.]
The process of using spatial and environmental information to navigate to a destination. [The basic process of wayfinding involves the same four stages: orientation, route decision, route monitoring, and destination recognition.]
The use of a weak element that will fail in order to protect other elements in the system from damage.