What are the differences between UX and UI design, and which should I focus on for a commercial website?
Hi, I'm trying to figure out how to make the experience for people who visit a commercial website more streamlined, interactive, and enjoyable. I'd also like to make sure that people are staying on the site for longer amounts of time, and visit certain pages. What are the differences between UX and UI design, and which should I focus on?
Expert Answers
Sort by Date
Sort by Votes
Aug 8, 2014
UX and UI are terms that overlap, and you should focus on both. The overall experience of the user (UX) is better with a user interface design (UI) that has an intuitive, enjoyable and efficient workflow. You should use Google Analytics to understand how your visitors interact with the website and understand the goals or a series of goals you would like the user to complete. Increasing conversions involves getting feedback from visitors, tracking metrics like bounce rate and time on page, and A/B testing different pages to increase conversions. Start by finding the best designs in your industry and learn from them and make improvements based on data. Good luck!
Aug 8, 2014
Great User Interface (UI) and user experience (UX) are developed together which is why you see UI/UX together.
UI is the bicycle- the shape and color and size of tires and handlebars- the streamers and horns and reflectors on the pedals. It's the physical thing you see and hear and feel.
The UX is how you feel and react when you get on the bike. Does it pedal smooth, are things where you expect them to be, does it shift when you think it should. Are the streamers too long or does the horn annoy you? All those things make riding that bike a good or bad user experience.
So to answer your question- always focus on UX... because the goal of any user interface (UI) is a "delightful" (buzzword alert) UX.
Aug 8, 2014
To build on what Andrew said (very good answer), you may want to consider eye tracking patterns as well to account for how people actually look at site... just Google "website eye tracking" to see what I mean... make it simple and easy...
Aug 8, 2014
Rob,
UX and UI terms are used in a very similar context. I am not too concerned on what should be used. however, what is important is that you need to look at many factors when designing a commercial website.
First and foremost, you should decide what personas the website is designed for? and then look at what the needs are of those personas. This subject is very involved and I can write on many facets of this, because interface plays a critical role in conversion rate on the website.
Other things you need to look at are Navigation / Menu Design, Calls to actions what those are going to be and where do you place them on the website? The color scheme and over all look and feel, this goes back to the persona.
These days you have plenty of tools available to you that can test your theory and help you decide what layout works best. There are many websites that can help you with A/B testing and many tools such as crazyegg can also help you see how traffic is behaving on your site. These heat maps can be very valuable resource.
UI design is a complete science these days, do give us a call if you need to discuss further on the website design.
Aug 8, 2014
Hi, Rob-
Think of the relationship between User Experience (UX) and User Interfacing/Interaction (UI) as a bucket full of water. The UX is the bucket; it's the containing element, the backbone, and the basis on which the water (UI) elements are added.
UX will tell you a story; it explains the places from which your customers arrive, where they go, and how they're affected by each stop along the way. Analyzing UX is how a smart company goes about determining how their UI should look and act.
Conversely, UI is the visual medium of your UX studies. UI will be very different from industry to industry and company to company. It's the pieces of interaction your customers are exposed to which positively or negatively affect their experiences with your brand or product.
UI should be tailored to your specific audience and should blend with your messaging to give your users the most precise, informative, logical steps of progression from discovery to conversion.
The bottom line is this: you need to focus on both aspects. Both are incomplete without the other. You can perform A/B tests all day, but you'll save a ton of time and money if you first identify, understand, and cater to your users specifically.
Aug 8, 2014
Hi,
If you are exploring in commercial website then you have to stick on UI design. Its all about user interface. UX design we are using most of them in the case of Web application interface design or any kind of application theme design etc. In fact in the beginning there was only UI design, over and over time there evolved UX design from the UI design. But as a designer you have to be experience in both of this and it would make you very busy.
Dec 10, 2015
I want to say like 'add your X factor in the UI design, so it will become an UX design...'
Aug 8, 2014
Simple words the ENTIRE package is what makes it good UX, whereas good UI is always a very important inner-element of that.
Aug 8, 2014
I can't really add much to the existing responses which are all great. What I will say however is that typical "best practices" for UI/X are, IMHO, missing elements that are more relevant as time goes on and as the experience of many people, formats and contexts expands. As tech rapidly "progresses" (progress is relative and subjective but this is not the place for a rant…) so too should UI/X. In our work for making the web more accessible and a better experience for the disabled, aging and everyone else, we have observed that creating UI/X for people with various impairments creates a better experience for everyone else. Kind of like the curb ramp for the wheelchair user also makes it easier for a stroller, bicycle or just someone walking to more easily cross the street. So does UI/X for the visually impaired include audio? If there is audio what is the UI/X for the hearing impaired? If someone cannot use a mouse or is physically impaired what is the UI/X for them? What is the UI/X for the cognitively/developmentally impaired? If you are involved in the medical field these issues come into play in a profound and concerted way. Hope this helps.
Aug 8, 2014
UX is the whole, UI is the portion. The first is the entire experience of a user on the Website. UI is how the website looks. In addition to having a good UI (the infamous "look and feel"), you need to make sure that the users experience of the site is easy, pleasant and expected. That the user can figure out how to do what s/he wants, feels confident of the pathway and results and knows what's going on. That means that all the symbols, processes, text, ease of use, etc. are designed for your target market. Also it reflects the needs of the user and how that user thinks about the process.
You have actual users, don't lose them in a "persona". I've been doing UX for 20 years and on every engagement that has used personas, I've had to beat down the impulse to design for that fictional being rather than incorporating feedback from actual users. I.E. when a test shows that no user does what the persona would do, the tendency is to ignore the result, rather than give the actual user what they need or want.
Which is more important? They are both important. You can't do UX without UI; and UI is only useful in a full UX context.
Aug 8, 2014
Katie brought up a very interesting and important point about UX and persona. Now a days, most of the presentation (with empty slides, little words), promotional video etc. all try to talk about Mr. X waking up in the morning, thinking about his coffee and the coffee maker starts working, Ms. Y gets to her closet and based on her mood (maybe from her wrist band), the right clothes are selected etc. These are all fine and great way to explain how a product/feature works. Sometime, people do get carried away with these fictitious characters and focus too much on what that "persona" would do, and starts ignoring the real end user feedback. I have worked with companies that were very big on this "persona" thing, and there are companies that don't. I find the personas to be great to create your target segment (if that is useful) and think about your products/features that way, but ALWAYS listen to the REAL users if you have. Nothing better than actual end user feedback.
Aug 8, 2014
Check out UsabilityHub as a utility that asks random visitors questions about design, user experience and interactivity. I'm sure there are others, but it's a place to start with usability testing.
Aug 8, 2014
one U has an X and the other has an I after it, you need a programer for this one. I aint half bad at building graphics for my web sites, but this is a new one on me. Sorry but this is a techie problem.
Aug 8, 2014
Alas- websites should have very very few graphic elements and a lot of media rich content.
Aug 8, 2014
UI is the arrangement of various controls and other anchors such as images, text etc on the webpage or your application window. UX is the outcome of these arrangement - how convenient the user find to navigate, use and explore the screen. If you focus in the UX, you will get a good UI out.
Aug 8, 2014
Hope everyone knew the expressions of "UI" (User Interface) and "UX" (User Experience) are continuously utilized like never before in today's innovative and technical world.
Generally, these expressions are alluding to fortes and thoughts that have been around for quite some time preceding the presentation of the condensed phrasing.
Be that as it may the issue with these new acronyms is more than simply terminology. Inappropriately, the terms are rapidly getting to be risky trendy expressions: utilizing these terms loosely and within regularly totally wrong circumstances is a consistent issue for a developing number of experts, including: designers, job hunters, and development specialists of product. Understanding the correct division, relationship and use of the terms is vital to both chastisements.
Aug 8, 2014
I think the focus should be on making your pages understandable to the visitors within a few seconds of their landing. I also think it is relatively more important to make the visitors take affirmative actions vis-à-vis having them stay longer.
Some ideas that have been tested to work are:
1. Headline that evokes curiosity, and relates clearly to the content
2. A good image
3. Unmistakable call-to-action
4. Narrative that makes clear what to expect and how to proceed, if so
Making viewers visit certain pages is a different aspect. Apart from strategically linking those pages from other pages in the website, I think you'll need some extra attention grabbing efforts on other pages.
These could be like top action bar (example, HelloBar used by Buffer blog), top-of-post or end-of-post messages, scroll-triggered message from bottom, etc.
If you're using WordPress, consider the free Icegram plugin that does many of these things.
Aug 9, 2014
UI and UX, two terms that I’m sure just about everyone in the tech community has recently heard used fairly loosely. It seems that every company small and large is looking for a UI/UX designer to join their teams. Clearly these two acronyms have become the tech industry's latest buzzwords. But what do they actually mean? To start off, let’s define the two. First we have UI which refers to “User Interface” and second we have UX which refers to “User Experience”. It terms of design, UI and UX cannot be used irreplaceably.
User Interface (UI) Design generally refers to the user facing side of any type of physical interface, whether that is your latest smartphone, a desktop computer, or the navigation system in your new car. A UI designer is responsible for everything that a user will see on the interface. This includes everything from (but not limited to) input controls such as buttons, navigational components such as sliders, and informational components such as message boxes. Furthermore, it is the UI designer's responsibility to understand what the users’ needs are. They must be able to arrange the interface in a simple way that allows for the best user experience. Now that we have established that the UI designer is responsible for everything that the user can see and use, what does the UX designer do?
The UX designer is responsible for the emotion of the user. They are responsible for how they feel when interacting with the interface or product. UX is a much broader term that encompasses the entire process from concept to completion. UX designers generally start by conducting user research and interviews. The goal with this is to understand exactly what the users’ needs are. In most cases, the next step is to create a set of personas of each possible user and their needs. Once these first two steps have been completed, the UX designer will have the information needed to create the backbone of the product or “wireframes”. The wireframes are essentially the blueprints of what the UI designer will use to create the interface that the user interacts with.
Clearly UI and UX design are interrelated and you need both to create simple user centered products. At the same time, one should understand the differences between them. As stated, UI design focuses on what the user can see and touch and UX design focuses on how the user feels when they interact with the product. Hopefully my brief description about the differences in UI and UX design has given you a better understanding of two!
Aug 10, 2014
both are most important for the commercial website .
UX & UI both are dependent to each other UX is a user experience part but without UI does looks better.
So Both are the essential part of commercial website.
Aug 11, 2014
To break it down in simple basic explanation.
UI is the navigation of the website.
UX is the feeling you get by interacting with the site.
It really depends on the industry and the purpose of your website. Is the site meant for user interaction ro is the site meant to be a checkout counter. Once you figure out which is important then u can decide if you need to focus on UI or UX.
First know the main purpose of your website.
Stay focus on that purpose.
Provide the best value to the users to fit the main purpose of the website.
Aug 13, 2014
UX is short for user experience and it's how the user feels interacting with your site. Is is easy to navigate, is information easily accessible and is it relevant to their search, etc etc… So it has to do mostly with your content and architecture of the site.
UI is the interface and is more to do with graphic design and art direction of your site.
Hope this helps. Cheers
Aug 19, 2014
Hello Rob,
UX and UI both is most important for the the Successful website, you should study Google guideline for the better navigation and user friendly sites. it will be help to index more faster as well as easy to navigate.
Sep 9, 2014
For genuine and Serious inquiry of any form of banking instrument (BG/SBLC/MTN/DLC/LC) Which can be engage in PPP Trading, Discounting, signature project(s) such as Aviation, Agriculture, Petroleum, Telecommunication,automobile, construction of Dams, Bridges, Real Estate and all kind of projects, we can deliver at affordable price to our customers in other to derive maximum utility.for lease and/or sale from a genuine and reliable source without broker chain / joker broker story or chauffer driven offer while having your required time frame in mind.
We will be glad to share our working procedures with you upon request to help us proceed towards closing deals effectively.
Thank You
Contact : Mr. Mahendra Jain
Email :Draj dot bgbroker(at)gmail dot com
Skype ID: Jaindra dot bglease
Good Say..Easy to understand Berry for People