Skip to main content

The principles of user interface design

“The public is more familiar with bad design than good design. It is, in effect, conditioned to prefer bad design, because that is what it lives with. The new becomes threatening, the old reassuring.”Paul Rand

Paul Rand, who was an American art director and a graphic designer best known for his corporate logo designs, including the logos for IBM, UPSand NeXT, nicely summed up one of the biggest barriers user interface (UI) designers come across when creating new concepts. So how does one keep oneself in check and innovate in a way that makes sense? Fear not, this is where core principles come in. These principles help you in taking decisions and keeping in line when design stops being innovative and begins to look like a big mess. Whenever in doubt, remember them and let them be your guiding light.

Clarity

Lack of information makes a user shy away from browsing a website. For a positive browsing experience, the user should be well-aware and confident of the information being displayed. Clarity serves both and this is best achieved through simplicity. The user interface shouldn’t be simply because it’s in vogue, but because it serves a higher purpose. Once your design is done always ask yourself: “If I’ve just landed on this page for the first time, is what I need from the site obvious and easy to access?”

At any particular time, in any part of the site, the user should be aware of:

  • What just happened
  • Where they are
  • What they can do
  • What will happen if they do it

Familiarity

Humans are creatures of habit and routine, and our eyes love seeing simple and familiar things. But what does this mean for designers? When I was studying design, I was taught to push the boundaries, keep building on what I have and never settle for conventional designs. This is also true when considering the client perspective. They usually expect designer to reinvent the wheel every time they come up with a marketing idea.

Of course, this is what every designer wants, to create something new and memorable. It feeds a designer’s pride. But let’s be brutally honest: A site is created for the end user and not to boost the ego of the designer and definitely not for the browsing experience of the site owner. This means that designers should spend less time reinventing and use common yet successfully proven solutions, without feeling guilty. It means that conventional layouts will seem less complex simply because they are familiar. Some tips that one might find useful while designing are:

  • Use simple, popular verbs when it comes to naming CTAs (call to actions), links, buttons, etc.
  • Use common colour codes such as red for warnings, green for successful, etc.
  • Use text when you think the icons won’t get your point across

Appearance follows behaviour

When someone or something behaves consistently within our expectations, we feel like we are on the same wavelength - web elements should look and behave in the same manner. The interface should be designed in a way that directs the attention of the user to what is most important. The size, colour, and placement of each element should work together, creating a clear path to help users find what they want. A clear hierarchy will go through great lengths to reducing the appearance of complexity.

The interface should interact with the user at all times, whether their actions are correct, wrong or misunderstood. Always inform your users of actions, changes in state and errors, or exceptions that occur. Visual cues or simple messaging can show the user whether their activities have led to the expected result.

Efficiency

Make it as easy and as straight forward as you can to help users complete the main task in the most efficient way; whether it requires filling in a form, or just clicking on a call to action. Measure the effort that is required to complete the task; such as number of clicks, input boxes and screens. Then clean it up as best you can, before proceeding to start work on the interface to help those tasks.

In conclusion, UI design is successful when people are using what you've designed. Like an impressive looking chair that is uncomfortable to sit on, design has failed when people choose not to use it. Therefore, interface design can be as much about creating an environment for use as it is about creating an artefact worth using. It is not enough for an interface to satisfy the ego of its designer, or a dream visualised by a marketing team: an interface must be used!

References

Joshua Porter. 2016. Principles of User Interface Design. [ONLINE] Available at: http://bokardo.com/principles-of-user-interface-design/. [Accessed 18 July 2016].

InVision Blog. 2016. The core principles of UI design - InVision Blog. [ONLINE] Available at: http://blog.invisionapp.com/core-principles-of-ui-design/. [Accessed 20 July 2016].

Psych Central. 2016. Changing Our Routines and Habits | Psych Central. [ONLINE] Available at: http://psychcentral.com/lib/changing-our-routines-and-habits/. [Accessed 20 July 2016].

Treehouse Blog. 2016. 10 User Interface Design Fundamentals - Treehouse Blog. [ONLINE] Available at: http://blog.teamtreehouse.com/10-user-interface-design-fundamentals. [Accessed 29 July 2016].

Creative Blog. 2016. User interface design principles: 12 pro tips | Creative Blog. [ONLINE] Available at: http://www.creativebloq.com/web-design-tips/tips-ui-design-123474. [Accessed 30 July 2016].


#DesignPrinciples #UserInterface(UI) #DesignProcess #UX-UI-Design #UserExperience(UX)