Fundamental Principles of Design Part-3

In the first two parts of this series we have discussed about Affordances and Signifiers in part-1 and about Mapping and Feedback in part-2. In this last part of the Fundamental Principles of Design series, we will be discussing about the remaining three fundamental principles which are Constraints, Discoverability and the Conceptual Model.

Constraints

Constraints are clues that limits the number of possible actions for a user thus simplifying its use and interaction for them. It helps them take appropriate action on the basis of the constraints present.

Lock and key. It’s appropriate to insert specific key into the lock because the constraints present in the lock won’t allow it to be operated by any other key.

Greyed out component indicating that they can’t be used or accessed.

Maximum size of the file that can be attached to an email on Gmail is 25MB. Here attachment file size is the constraint (Source)

Tweet size should not be more than 230 characters. (Source)

There are four classes of constraints which seems to be universal and are being applied to numerous different scenarios.

Physical Constraints

Physical constraints is about providing limitations using the physical properties for executing the possible set of actions.

Reassembling of a remote. The physical constraints provided gives the user information about which part will go where in the order required so as to properly assemble it. (Source)

Inserting pendrive into the USB port. It can only be inserted in one way. (Source)

In order for the physical constraints to be more effective and useful, it’s necessary that the constraints provided are easily visible and interpretable hence preventing any incorrect action beforehand. It happens many times that the physical constraints provided prevent wrong action from succeeding but only after it’s tried by the user.

Inserting batteries into the electric compartment, where there are two possible ways to insert it. One of them is correct and the other one is incorrect. The physical constraint provided is not clear enough to give user the idea to insert in the correct orientation form. Usually the user realizes it’s incorrect only after the batteries are inserted. (Source)

Cultural Constraints

Cultural constraints are the allowable actions for social situations which can be universal or particular to any specific culture. These are restrictions which have resulted in what is considered to be appropriate and correct within that culture. Some cultural constraints are uniform everywhere while many are specific to particular cultures.They likely change with time.

Turning the screws clockwise to tighten it and anti-clockwise for loosening it.

Red triangle is considered as a sign of warning.

Conventions are also a kind of cultural constraints.

Universally accepted interface convention is the concept of windowing for displaying information. A window with a basic set of possible actions is universal convention for displaying any kind of information. The position of the icons inside the window might change like icons on the top left in linux based operating systems whereas it being on top right side in windows operating system but the basic structure remains same.

Google chrome browser on the MacBook

Another universally accepted convention is the use of icons and it’s label beneath for the apps on the phone. This convention remains same disregard of the different operating systems be it android or ios.

Use of icons and labels to represent apps on all operating systems

Semantic Constraints

Semantic constraints are described as those that rely on the meaning of the situation to control the possible set of actions. It depends on the user’s knowledge of the situation and of the world for the usage of the product/service.

Semantic constraints can change with time.

The gloves are designed in such a way that the user has an idea which is for left hand and which one is for right hand (Source)

Different types of slots gives idea to the user about which port if for what purpose. (Source)

Help/support section on any website. The user knows that it can be used for finding information related to that particular website only. (Source)

Logical Constraints

Logical constraints are the one which makes use of reasoning and logical relationship to determine the possible actions.

For example after reassembling any device, if there is a part left, it gives clue to the user that the device is not assembled properly and there has to be a place where this remaining part will fit.

The last of the puzzle left will go in the only empty space in the structure (Source)

Form with required fields won’t let the user submit the form until all details are filled in the form (Source)

Conceptual Model

A conceptual model is basically an explanation of how something works. Conceptual Models need not be complete or accurate but they should provide clear and easy way for the users to understand and remember the functioning of the device.

Conceptual model for this Juicer Blender. The structure of the product gives idea about it’s working to the user. (Source)

Conceptual model helps enhance the discoverability and helps evaluate the results of the action taken. It helps the user predict the possible outcome for the action taken by them.

Quite often there are multiple conceptual model of the same product/service. We will be discussing about the conceptual model that a user has in mind about the product they are using. These conceptual models are known as mental models because they reside in a user’s mind about their understanding of how something works. There are multiple mental models of the same product/service. Each of this model is based on the operations they do with the product/service.

The conceptual model of a person using this for cooking might be different from the one using it exclusively for baking purpose (Source)

Someone using Macbook for programming purpose will have different mental model than the one using it for design purpose which again will be different from a person using it for photography and video editing. All the way from using different softwares to knowing and using different key shortcuts which would help them in getting their work done faster can be different.

(Source)

A social media influencer might have different conceptual model of the social media platforms in comparison to someone using for personal purpose.

(Source)

Usually the conceptual model is inferred from the product itself, while there are some which are communicated from one person to the other. Some are learned from the manuals provided. When the device provides insufficient information for a conceptual model, it is built on the basis of the experience of the user of using that and similar products. Such models are mostly error prone and leads the user into difficulty while using the product.

Working of scientific calculator is usually understood by reading the manual

It is important to have good conceptual model because when things go wrong or unplanned without the presence of a good conceptual model user doesn’t know how to rectify the error and handle the situation.

The user’s conceptual model can be different from that of the designer’s. The designer expects both of them to be the same. For that to happen it’s necessary to have a good system image as the user’s conceptual model is based on the system image and interaction with the concerned product/service. System image is the information perceived on the basis of combined information like the structure of the device, affordances and signifiers present, documentation and information available.

(Source)

Discoverability

Discoverability is referred to figuring out what a product does, how it works and what all actions are possible with it. Discoverability and understanding results from the appropriate application of the other six fundamental principles of design.

Discoverability of scissors is pretty starightforward (Source)

Figuring out what a printer does is clear and easily understood (Source)

The sites that the users interact with, all of them have some common features that help the user figure out how to use them. What makes one site better from the other is it’s discoverability on the basis of how the other principles are applied. It should be easy for a user to understand the operating of any product/service by interacting with it.

Discoverability of the IRCTC website is not that easy which makes it difficult for the users to use it and leads to frustrations and annoyance (Source)

Facebook has received criticism over the years because of it’s privacy controls that keeps on changing and it’s not that straightforward to find and apply privacy setting on it.

(Source)

This was our three part series about Fundamental Principles of Design. Have examples to share with us? Comment them in the comment section below. Also keep checking this space for more articles related to Human Centered Design!