BlOG
Neat. Crisp. Kickass. That's our Blog.
#
Categories
More

UI v/s UX: Pretty or Functional?

by Arpit Toshniwal
ui-ux-1
April 26, 2017Web Design

If looks are that important, then 30% of the women of our generation must have been a supermodel, and at least 2% of them must have gone on to win the medals for their respective country on an international level.

That is an awful lot of girls waiting in line for work which means there would be no source to fill their stomach even when every shop in the country has its personal endorser.

So how come many girls don’t make it there, what are they lacking?

To put it in simpler terms, talent!

That is what happens exactly with sites which couldn’t land themselves at the top. They have good design, but all they lack is functionality.

Now,for what these acronyms stand?

Well, one stands for user interface (UI) while the other stands for user experience (UX).

1. To make it simpler let’s assume UI as your looks and body color whereas UX as your life organs.

2. We can narrow it down to UI as working hand in hand with graphics design and UX working as the functionality of the graphical things scattered here and there.

3. Both of them cannot survive without each other when you have almost 30 milliseconds to impress a visitor!

See for one thing if you have fleshy unrelated images or GIFs on your website to make it look cool, but once the visitor spends some time unsuccessfully trying to locate some useful information, he/she will navigate away thinking poorly about your professionalism with a much larger boost to bounce rate.

On the other hand, if you have useful and sorted information but like to brag about thy roots and stick to the traditional version of the website only, this would motivate them to go someplace else and to feed their eyes and minds with interesting thoughts.

Now we know that balance is the key.

So how do we achieve balance?

We’ll have to try and get a better understanding of both the terms separately.

What is user experience design and how do I use it to garner more attention for my website?

ui-ux-2

As our beloved Wikipedia puts it:

User experience design (UXD or UED) is the process of enhancing customer satisfaction and loyalty by improving the usability, ease of use, and pleasure provided in the interaction between the client and the product.

Well, it’s no problem to understand the words, but their meaning is the tricky part!

To understand the significance of this whole heartedly, we need to go back and emphasis on who created these acronyms and why?

Don Norman, co-founder of Neilson Norman Group Design Consultancy coined them in the late 1990s stating that “User experienceencompasses all aspects of the end user’s interaction with the company, its services, and its products.”

Now we know who created this term and it clears the ambiguity of why he created it, no?

User experience sums up to every kind of interaction between a company and its potential client well on his way to become an active customer.

All of it, seriously!

That’s what the reviews are all about on google play store mouthing the personal experience of a user and what are the features and updates that are needed!

We can hear it daily on the streets about how badly an app hangs/lags while working although it seems to have a nice smooth lining interface and heavenly crafted body.

You wouldn’t want that to happen with your app as well, right?

ui-ux-3

I cannot point out exactly how important a good user experience is for your company or product because for exact calculations I shall be asking the confidentialannual fiscal year report, working and target audience of your business which I believe is something you won’t happily provide and oh boy, that hurts!

After all the pleasurable company we have had, and the quality time we spent with each other, it is rude to deny me for such small details!

So coming back at it, I’m sure you have understood it is important for your business to succeed!

Now again how do we do it?

Bear with me as I have created you a problem, I’m solely responsible for solving it for you as well;

We are following the skyscraper technique of problem-solving. First, we analyze why it is needed to be addressed, and then only we get down to it?

Have you heard it, the skyscraper technique?

The fancy term actually, make sure to use it in a meeting if you are a developer!

It helps just like a good user interface would do, the first impression maybe!

ui-ux-4

So anyway imagining you’re still with me, we were onto discussing something called responsibilities of a UX designer;

The first set of responsibilities of a UX designer consists of forming an appropriate strategy and churning out some data to build quality content, this process includes:

  • Competition Analysis
  • Target Audience Analysis
  • Product Description& Analysis
  • Content is King

The second set of responsibilities of a UX designer consists of forming a blueprint and introducing a preliminary sample, this step includes:

  • Making a Blueprint
  • Creating a Sample
  • Iteration/Testing
  • Planning for a Sustainable Development

The last set of responsibilities of a UX designer consists of execution and analytics, this step includes:

  • Coordinate With UI Designer(s).
  • Coordinate With Developer(s) as Well.
  • Tracking Target and what is left undone.
  • Chaining (integrating) all of the results together.
  • analysis and Iteration.

ui-ux-5

So, in conclusion,a UX designer has to make the products up to the mark of customer satisfaction and ensure that customer has got the results he/she desired.

They may have to record views of the customers and listen to their problems from time to time to thrive on improving the product for better.

What is user interface design (UID) and how do I use it to make my website look cool?

ui-ux-6

If UX helps the user to accomplish certain targets, then UI adds for more personal connection with the user.

According to designer Nick Babich:

“The best products do two things well: features and details. Features are what draw people to your product. Details are what keep them there.”

And without a good UI design how do you expect the features to get highlighted?

ui-ux-7

Exactly we need UI as badly as you need the seamless functionality of a website; think it this way if people would have cared for bad UI then they wouldn’t have been bashing Bollywood films all day, every day!

Though some of them have good stories, they do not fit particularly well in “Sci-Fi” genre just because of bad graphics experience.

As it might appear so from the above example that UI designer has got to know how to handle graphical objects and make them look better, but no! It is a common misconception even with companies who are hiring UI designer(s) for years.

UI designer has to work with graphics, but that is as close to being valid as UX design for being equivalent to UI design.

Just by decoding the term user interface, we can understand that this is something about theinteraction between a user and a machine.

Just like Android and iOS have an interface;why we usually prefer iOS?

I’ll let it pass into your good judgment.

That’s the advantage of a good user interface (UI) over a commoner.

UI designer is responsible for carrying the product with grace without hindering its essential features just like any model would do on a fashion event which results in an overall beautiful and breathtaking performance.

Confusing it with UX design is imperative for a layman so you need to be comfortable working at either one because at the end of the day you’ll just end up integrating both of them together.

So let’s have a quick look at what he got to do!

Appearance and Feel:

  • Customer Assessment
  • Designing
  • Branding and Logo Making
  • Site Navigation

Responsive design:

  • UI Modeling
  • Animation and Interaction
  • Compatible across all screen sizes and platform(s)

So to conclude this, we can say that user interface design (UID) is the process of visually navigating a user to various results that might interest him/her by using interactive elements and cool graphics design.

I’m tired of learning anything and everything; just tell me already which one is better?

ui-ux-8

If we consider the words of Helga Moreno who is a designer and expert as well, then her exact words were something just like this;

“Something that looks great but is difficult to use is exemplary of great UI and poor UX. While something very usable that looks terrible is exemplary of great UX and poor UI.”

If that isn’t simple to understand, I don’t know what is!

Now that we have a general idea of both of them let’s get on with the differences which I believe are none because both of them are somewhat inseparable and fulfill different purposes.

Without one, other loses its purpose; still, there are several misconceptions which need our attention immediately.

We can start from here:

Five most significant differences between UI and UX

Don Norman and Jacob Nielsen explained it further in their article the definition of user experience:

“It’s important to distinguish the total user experience from the user interface (UI), even though the UI is obviously a critical part of the design.

As an example, consider a website with movie reviews. Even if the UI for finding a film is perfect, the UX will be inadequate for a user who wants information about a small independent release if the underlying database only contains movies from the major studios.”

Confused? Trust me, I feel you.

Let’s try and get a deeper understanding of the topic by some experts.

ui-ux-9

1. UX and UI have an ocean of difference between them.

Isn’t it obvious?

Well, that’s what we are trying to prove from line 1.

So anyway at least we know that UI and UX are not necessarily same though both of these terms get along with each other well.

All UX design talks about is the need for the user and how well the product is satisfying it.

And UI? Well UI just wait around the block for an elegant piece of artifact waiting to grab the eyeballs, other than that it has practically no use.

These days UI has ceased to pretend to be smart, it has got way more interactive and responsive than the older days.

One is as detailed as the paintings of Vinci while the other is simpler just like “Bani-Thani”!

Exactly you got it right; one has the purpose just to quench the thirst of eyes while the other does all the hard work.

First, we understand the needs then we draw a prototype, and later we validate it by testing.

Now, what does interactive/responsive design means?

ui-ux-10

Let’s try to understand this with a simple example.

You click on a website link in Google search results and see if it changes color!

I bet it does, that’s what responsive/interactive design is all about.

Gone were the days when you couldn’t have figured out which one you clicked, now by the change of color you can figure that one out quickly.

Let’s try and make it clearer, shall we?

A UX designer will design how to sign up on a portal and what are the steps included whereas an UI designer will accept the rough prototype from him and add a little more colors and interactive design to make it go down well with the users.

2. UX is journey whereas UI is the pathway.

ui-ux-11

“Destination is unimportant, but the journey is.”

Similarly, many websites will give the user the same results, which one will he choose?

The one that looks more beautiful and breathtaking; just like we take the road which has more natural sculptures to explore.

UX designer does all the competition and requirements analysis while trying to make the product more viable and less usable for the rivals whereas UI designer accepts the results, after wireframing, prototyping and every other process on this planet that includes testing; UI designer just tries to make it look pleasant.

While the color choices vary according to the product needs, it’s UX designer who gets the final say.

It means that you should not put vibrant and charismatic colors where all you need to do is paint it with simple blue and white;

The color scheme and typography is a tricky part which should only get decided after an articulated study of reasons not just like what you feel.

So what you need to do is create a plan which depicts the steps clearly and follow them to reach your goals.

Leaving all concepts and tricky part on the UX designer’s hand, you can let your creativity run free with a gentle reminder of needs of the product by the UX designer.

3. UX is preliminary whereas UI is secondary

ui-ux-12

Well, that holds true almost all the times except maybe when the same person handles both the departments and that’s usually the case.

Still, it depends on the person and his/her take on this.

UX designer is the one who does all the prototyping, wireframing and testing whereas UI designer just serves the dishes on a beautiful plate and with a little mix of icing.

4. UX is complicated business whereas UI is confined to interface layers only

ui-ux-13

A UX designer does all the hefty jobs ranging from product services, reviews, loopholes; a complete experience if we put it this way including interface as well.

A UX designer just sips coffee while trying to mess around with the colors and some awfully simple typography that too under the shadow of a UX designer.

Pretty easy, isn’t it? Who am I to comment anyway!

5. UX designer does the trick to make the UI designer look good.

ui-ux-14

Even if it breaks some lovely and aesthetic hearts, it is true!

It’s the UX designer who makes something worthy to enhance your knowledge whereas UI designer just helps with the flow of thoughts to flood your channel of a mind.

Think of an example of a calculator;

If we would have to wait patiently for an answer to popup with 7 painted red and 9 painted blue and so on.

It would still be just a bunch of numbers to us anyway; there would practically be no need and significance for the colors.

In the same way, UX designer is the one who gives away that bunch of numbers and works on trying to form a method to churn them out whereas UI designer just focuses on the screen and where they need to get placed.

The Conclusion

(UI! = UX)

To the people who are not so much for the saying “food for code,” this particular expression means UI is not equal to UX.

Both coexist with each other, but that doesn’t imply that they should be same.

The UI designer is responsible for a product’s look and feels whereas UX designer encompasses all aspects related to the task at hand and its services either good or bad.

Do let us know how did you like this one and make sure to check out our blog ArtAttackk daily coz we have some more awesome stuff lined up just for you.