Explaining User Interface and User Experience Design

Design

title: Explaining User Interface and User Experience Design created_at: 2017-12-17T14:52:16.823Z updated_at: 2017-12-17T14:52:16.823Z tldr: Norman doors is_published: 1 star: false category: Design share_type: share

In a simple language, an User Interface (UI) is just an interface to access something, like a door to a room, and User Experience (UX) is the experience the door creates to the user while opening. UI is a newly coined term, earlier it was known as Human-Computer Interaction (HCI). Usually, most get confused between UI and UX, both of them are completely different but are dependent.

There is an analogy I like to use describing UI and UX.

If you imagine a product as a human body, the bones represent the code which gives it structure. The organs represent the UX design: measuring and optimizing against input for supporting life functions. And UI Design represents the cosmetics of the body — its presentation, senses, and reaction.

Now the Definition’s (as on Wikipedia)

User Interface design (UID) is the design of Interfaces for devices like computers, appliances etc., with the focus on maximizing usability

And

User Experience Design (UXD) is the process of enhancing customer satisfaction and loyalty by improvising the usability, ease of use and the pleasure provided in the interaction between the customer and the product.

Both UID and UXD are a multi-faced and challenging role. It is responsible for the transference of a product’s development, research and layout into an attractive, guided and responsive user experience for the end users.

Explaining with a case study: Door

A door

Yes! Door, they too provide UI and UX, we don’t realize but, UI UX is everywhere, we just need to look closer.

How can such a simple thing be so confusing? A door seems to be about as simple of a device as possible. There is not much you can do to a door: one can open it or shut it. But, strangely have seen people struggling to open a door, like at ATM’s (sometimes me too…). These types of doors are called swinging door. A swinging door has two sides one contains the supporting pillar and the other is unsupported. To open the door, you must push or pull on the unsupported edge. But strangely most ATM’s has only implemented only push mechanism. Even though clearly stated on the door a push label, if any (to you SBI), and many times fail to open. After realizing they change the action and the door open’s. This is called the Discoverability in UI.

So, Is there a better way? Yes, let the door be swingable from both the sides and provide a large handlebar on the free edge. In this case, the user discovers the pattern easily (UI) and the user is not restricted to a pattern and the usual pattern he follows with the door works (UX).

So, next time if you end up in a situation like one of this, worry not it’s the designer fault, not yours.

A better UI UX is where the user doesn’t notice. Bit Weird of a definition, but yes. User’s natural actions should work interacting with the device. The user doesn’t need to think to interact with the device. He doesn’t notice. It should work.

References and Further reading