DEV Community

Cover image for UX !== UI
davidrpolk
davidrpolk

Posted on

UX !== UI

Understanding UI and UX can drastically change the way you view front-end design. In this article, let's explore what both mean and go over some general guidelines!


UI

User Interface

The user interface is simply what a user sees and can interact with in order to accomplish tasks via an application. The buttons, input fields, clickable text/images, menus, etc., are all pieces of the user interface. If you're using a bash terminal, the interface would be text commands. Or, on Windows(or another similarly laid out OS), the interface would contain some things like menus and windows and images that represent files and folders. The interface is absolutely vital to any application because the greatest application ever designed would be useless without a way to interact with it! Consequently, the UI is worth devoting serious consideration and development time when writing an application. At some point, you've more than likely used an app with a poorly designed UI, and probably ended up feeling frustrated or disappointed, which leads us to...


UX

User Experience

The frustration that comes from using an ineffective UI is part of UX. All of the time users spend using an app ends up leaving each user with their own experience, or general take-away. In every day life, we all have our own unique experiences, even when doing things that millions(or billions) of other people do. Using an app is no different. Focusing on UX is focusing on what it feels like to use an app. Is it rewarding? Does the UI make you feel overwhelmed? Are the colors off-putting? Does that fade effect evoke an aesthetic response? Would a user enjoy using the app again? These kinds of questions are the center-piece of UX. Again, the greatest app ever created won't have many users if it is troublesome to use. The end goal here is to create apps that are valuable to users and give users a pleasant experience.


Some Guidelines

  • You are not the user!

Just because you enjoy a feature/layout/design element doesn't mean that everyone else will feel the same way. It's extremely difficult to know how people will interact with an app, so don't make assumptions based on your experience. This mistake is called false-consensus and it's easy to make. The only way to overcome this is by testing with a number of a different people.

  • Keep it simple

According to a 2015 Microsoft study the average attention span of a modern human is around 8 seconds. Overly complicated designs that have a learning curve, will negatively impact UX.

  • Keep the user informed

Being aware of what an app is currently doing or of interface functionality is extremely important for UX. If a page is loading, but no information is presented to convey that the page is loading, users will be left unsure of what is happening. Imagine never seeing a loading screen, or download progress bar. It would be very unsettling! Similarly, make sure that UI elements are intuitive(icons in a navigation bar for example) or labelled(like with text popups on hover). Don't leave users hanging.


That's all for now. Happy coding!

while (life.left.length > 0) {
life.do = coding();
}

Top comments (3)

Collapse
 
adam_cyclones profile image
Adam Crockett 🌀

Is it impossible to bring good UX, in the absence of UI?

Collapse
 
davidrpolk profile image
davidrpolk

They aren't really worth considering separately. UX extends far beyond the UI and is the over-arching guide for building an app. But to answer your question directly: there is no UX without something to interact with

Collapse
 
anwar_nairi profile image
Anwar • Edited

I think there is always an UI, even your command line is an UI in itself. You can provide a great experience in a command line nowadays.

The UX can carry the UI, but there cannot be UX without UI.