19 Usability principles for user interface design


Interface Design


Clarity is work

  • Clarity is the first and most important job of an interface.
  • To be effective with an interface Design that you have designed, people must be able to recognize what it is, care about the reason why they use it, understand what the interface is helping them to interact with, predict what will happen when they use it. , and then interact successfully with him.
  • Clarity inspires confidence and leads to later use. One hundred clear screens are preferable to a single mess.

    Interfaces exist to allow interaction

  • Interfaces exist to allow interaction between human beings and our world.
  • They can help clarify, enlighten, enable, show relationships, meet, separate, manage our expectations and give us access to services.
  • The act of designing interfaces is not art.
  • Interfaces are not creative pieces in themselves.
  • The interfaces do a job and their effectiveness can be measured.
  • The best interfaces can inspire, evoke, mitigate and intensify our relationship with the world.

    Conserve attention at all costs

  • We live in a world of interruptions.
  • It is difficult to read calmly and peacefully without distracting ourselves and direct our attention to a single point. Attention is a priority.
  • As in the case of advertising that should not dirty the side spaces of the applications with distracting material we must remember the reason for the existence of this screen in the first place.
  • If someone is reading, you have to let them finish reading before showing an ad In this way the attention will fulfill its mission and not only your readers will be happier, but the results will be optimal.
  • Usability or use must be the main objective, attention becomes the prerequisite. So you have to keep it at all costs.

  Keep users under control

  • Human beings are more comfortable with themselves and their surroundings when they feel under control.
  • Software with a design that is not well defined reduces that comfort by forcing users to unplanned interactions, confusing routes and surprising results.
  • You have to keep users under control by periodically showing the state of the system, describing the causality (if you do this that is going to happen) and giving an idea of what to expect in each round.
  • Do not worry about saying the obvious almost never is for a majority.

Direct manipulation is the best

  • There is no better interface at all when each of us is able to directly manipulate physical objects in our environment.
  • As this is not always possible, and the objects are increasingly complex, we create interfaces to help us interact with them.
  • It is easy to fall into the error of adding more layers of what is necessary to an interface,
  • creating excessively forged buttons, chrome, graphics, options, preferences, windows, attachments, and other elements
  • so that we end up manipulating user interface elements instead of what is important Instead, strive to design an interface with the least possible footprint, from the original goal of manipulation, recognizing human gestures as much as possible.
  • Ideally, the design of the interface should be so slight that the user should have the feeling of direct manipulation with the object, without intermediaries.

    One primary action per screen

  • Each screen that we design must support a single action of real value for the person who uses it.
  • Screens that support two or more primary actions quickly become confusing.
  • Just as a written article must have a unique and strong thesis, each screen we design must support a single and strong action that will be its reason for being.

    Maintain secondary actions

  • Screens with a single primary action can have multiple secondary actions but must be kept secondary.
  • The reason for the existence of an article is not so that people can share it on Twitter
  • it was made for people to read it and understand it, and then if you want, share it.
  • Maintain secondary actions by making them lighter visually or displayed after the primary action has been achieved.

    Provide a natural next step

  • Very few interactions are intended to be the last, so you have to carefully design the next step for each interaction that a person has to perform with their interface.
  • Anticipate and design to support it, what the next interaction should be and/or happen.
  • As we do in the conversation between two people, provide an opening for more interaction.
  • And do not leave a person hanging when they have done what we wanted them to do … we must take the next step in a natural way that helps them reach and go further in their goals.

    The appearance follows the behavior

  • Users are more comfortable with things that behave the way we expect.
  • Other people, animals, objects, software. When someone or something behaves in a manner consistent with our expectations, we feel we have a good relationship with them.
  • For this, the designed elements should resemble how they behave.
  • The form follows the function.
  • In practice, this means that someone should be able to predict how an interface element will behave by simply looking at it.
  • Do not innovate with the basic concepts of interaction … keep creativity for higher order concerns.

    Matters of consistency

  • Following the previous principle, the screen elements should not appear coherent with each other unless they behave consistently with each other.
  • The elements that behave in it must be the same.
  • But it is so important that different elements appear than those that are not coherent since they are similar.
  • In an effort to be consistent, beginning designers often confuse these important differences using the same visual treatment (often to reuse the code) when only a different visual treatment is necessary.

    Strong visual hierarchies work better

  • A strong visual hierarchy is achieved when there is a clear order of visualization to the visual elements on a screen.
  • That is when users view the same elements in the same order each time.
  • Weak visual hierarchies give little clue as to where the gaze rests and end up perceived as disorder and confusion.
  • In environments where there are big changes it is difficult to maintain a strong visual hierarchy because the visual weight is relative: when everything is bold, nothing is audacious.
  • If a single, visually heavy element is added to a screen, it is possible that the designer needs to restore the visual weight of each and every element to achieve a strong hierarchy again.
  • Most people do not realize the visual hierarchy, but it is one of the easiest ways to strengthen (or weaken) a design.

    Smart organization reduces the cognitive load

  • As John Maeda says in his book “The Laws of Simplicity” an intelligent organization of the screen elements can make the many appear as the few.
  • This will help the users to understand our interface more easily and more quickly since has illustrated the inherent relationships of content in its design.
  • The group as elements show natural relationships by placement and orientation.
  • Through an intelligent organization of its content that will have the less cognitive load on the user … you do not have to think about how the elements are related because you have done it conscientiously for them.
  • Do not force the user to find out things … you have to show them designing those relationships on their screens.

    The highlight, not determine, with color

  • The color of physical things changes as the light changes.
  • In broad daylight, we see a tree very different from the one that is sketched against a sunset.
  • As in the physical world, where color is very subjective, the color should not determine much in an interface.
  • It can help, be used to stand out, be used to guide attention, but it should not be the only differentiator of things.
  • For long hours of reading or extended screen, you should use clear or neutral background colors, saving brighter tones.
  • Of course, there is a time for vibrant background colors as well, you just have to make sure that it is appropriate for your audience.

    Progressive disclosure

  • Show only what is necessary on each screen.
  • If users are making a choice, enough information should be displayed to allow them to choose, then details will be entered on a subsequent screen.
  • We must avoid the tendency to over-explain or show everything at once.

    Help people online.

  • The step below this, in reality, is to provide the help is online and contextual, available only when and where it is needed, hidden from view at all other times.
  • Apply for. The users who go to the help to find an answer to their question puts the responsibility in them to know what they need.
  • Instead of placing help where it is needed … if this is your case, at least, we must make sure that it is out of the way of people who already know how to use our interface.

    A crucial moment: the zero state

  • In order to help improve our users to catch up with our designs, it is best to design for the zero states, the state in which nothing has happened yet.
  • This state should not be a blank canvas … it should provide direction and guidance to stay up to date.
  • Much of the friction of the interaction is in that initial context … once users understand the rules they have a much greater chance of success.

    The great design is invisible

  •  One reason for this is that if the design is successful the user can focus on their own objectives and not on the interface. As a designer, this can be difficult.
  • since we receive less adulation when our designs are good.

    Build in other design disciplines

  • Visual and graphic design, typography, copywriting, information architecture and visualization … all these disciplines are part of the design of interfaces.
  • It is necessary to take from them the aspects that help us to do our work.
  • Take advantage of ideas from disciplines that are apparently unrelated … what can we learn from publishing, code writing, binding, skateboarding, firefighting, karate?

    Interfaces available for use

  • The design of the interface is the same for the creation of an environment and for its use as well as the creation of an artifact that is worth using.
  • It is not enough that an interface satisfies the ego of the designer.

Call Now Button
WhatsApp WhatsApp us