Tag Archives: User Interface

Education, Fun, UX

How to… Explain the difference between UX and UI

Leave a comment

How to UX design by Jennifer Blatz UX designer and researcherThere is so much confusion between UI and UX. People, who don’t know better, use them interchangeably as if they are one in the same. You see the terms misused in job descriptions, in articles and in conversations. For those who do understand the difference between UX and UI, it can be quite frustrating when you come across these terms not being used properly. Let me take a few moments to provide some clarity between these not-so-intergangable terms.

How to…

Describe the difference between UX and UI

UX Defintion

According to the Nielsen/Norman Group, “UX, or User Experience encompasses all aspects of the end-user’s interaction with the company, its services, and its products.”

So what does that mean? Well to me that means it is more than just what that looks like in a company’s website or mobile app. It also means how a person feels when they interact with these elements. And it might not be an electronic experience at all. So keep in mind user experience covers a lot of things: research, visual design, information architecture, micro interactions, content and crafting a person’s journey through all of the touch points.

UI Defintion

Ok so I think you have a better understanding of what UX is. So now what is UI? According to a definition provided by Usertesting.com, a UI, or the user interface is the series of screens, electroinc pages, and visual elements that you use to interact with a device. In other words, the UI is the physical space or location that a person “touches” or interacts with a product or service.

Jennifer Blatz UX design. User Experience Design is not User Interface design.
UX is not UI

Differences and Similarities between UX and UI

So you can see from the above definitions, UI and UX are not the same thing, Yes there are some similarities, but there are also very distinct differences. I view UI as an aspect that falls under the UX umbrella. User interface is just one aspect of the larger concept of User Experience. UX, as you can see in the graphic above, has a lot of pieces and parts. And UI is just one one of the components that build up the larger picture that is User Experience.

In some ways, the user interface is almost toward the end of the UX process. You’ve done research to determine what the interface should look like and how it should perform. You have done usability testing to validate your design and tested it with users. You have done the design and layout to present the information, or create an experience, in the best way you can for your customer. Yes saying it is in the end of the process is a general statement, but hopefully you understand what I mean.

“UX is focused on the user’s journey to solve a problem, UI is focused on how a product’s surfaces look and function.”

– Ken Norton Partner at Google Ventures

Education, UX

Interaction design vs. User Experience design

Leave a comment

Yes, folks, there are still many industries and companies that do not understand the difference between interaction design and User Experience design. You would think that major corporations would have grasped the differences between the concepts by now. Alas, through my recent review of job descriptions, there are many companies, especially in the Dallas area, that say they are hiring a UX designer, but what they actually want is an Interaction designer.

Jennifer Blatz UX design. User Experience Design is not User Interface design.
UX is not UI

Many in the field of User Experience are familiar with the above chart. Perhaps, like me, you had to include this in a presentation to educate your client or co-workers. Despite the fact that there is some level of maturity in the field of UX, there is still a lot of confusion between the two.

As I mentioned before, I was recently perusing job descriptions for a UX designer in the Dallas area. I was noticing a trend:

  • The job title said UX Designer
  • The job description listed skills like research, strategy, wireframes and usability tests
  • It also said they company was looking for deliverables like personas, user flows and wireframes

However, upon further investigation, I discovered that these companies do no really want a UX designer, they actually want someone who is specifically a UI designer.

Jennifer Blatz UX design. User Experience Design is not User Interface design.
Interaction design actually falls under the umbrella of UX design.

It is completely OK to want a UI designer. Nothing wrong with that at all. But I feel like these companies are just copying other job descriptions and applying them to their own organization. (This is the same reason why you don’t just copy someone else’s design without understanding the context and reasoning as to why they came to the solution they did.) To me, just swiping a job description from another company and finessing it slightly so it sounds like your own is just lazy. I think it speaks leaps and bounds to the level of UX Maturity within your organization. Even if you are a large corporation with thousands of employees, or a highly respected agency with many high-end clients, you should know the difference between UX and Interaction design. If you don’t, shame on you!

My advice to companies is this: if you are looking for an Interaction Designer, just say that. Ask for skills like visual design, user interface design and interaction design. It is OK to be that specific. No need to pad up the job description pretending you wants skills like research, personas and task analysis. You, Dear Company, don’t really want those things. So be specific in your requirements and you will get the ideal candidate that much sooner. You will not waste your time or a potential job candidate’s time if you are more accurate in your job descriptions.

UX Deliverables and Assets

The difference between UX and UI

Leave a comment

I find that User Experience and User Interface are often used interchangeably. I was not even sure that I understood what the difference was. So I decided to do a bit of research on the internets and compiled a brief list describing each discipline. I know these are long lists. If you have some comments, please share with the group.

User Experience

  • UX is the overall experience one has with a product or service, which can include a UI.
  • User Experience is how they feel when they look at the site, aka the broad scope.
  • The interaction itself
  • Includes interfaces
  • Addresses all aspects of a thing as perceived by a person
  • UX architecture intelligently provides for the user’s interactive experience via features and functionality of a software-based product or service.
  • UX-er is known as the primary user-advocate on a team
  • UX informs creative
  • Developers are building what UX is architecting, and creative provides the visual look-and-feel based on UX architecture and brand requirements
  • UX design is all the methodological steps that lead you to the conclusion on how to design the UI. They are responsible for how they feel when interacting with the interface or product.
  • Generally start by conducting user research and interviews. The goal with this is to understand exactly what the users’ needs are.
  • The wireframes are essentially the blueprints of what the UI designer will use to create the interface that the user interacts with.
  • One who designs the user experience for applications after doing user and workflow analysis, producing user-centered design artifacts such as personas, site maps, taxonomies, and wireframes. A UX Designer may also conduct usability testing on prototypes or finished products to assess the quality of a user experience.

User Interface

  • UI is typically a combination of visual design (the look and feel) and the interaction design (how it works).
  • User Interface design is the part of the product that faces the user when he looks at the site.
  • A tool
  • A point of interaction
  • A means of communicating between a person and a system
  • UI (aka ‘GUI’) visual design is the graphical user interface of a software product/service
  • The GUI is the visual layer informed by the UX architecture, but based on branding/style guide and visual design principles.
  • The design of a GUI should be heavily informed and guided by the problems that were solved during UX process.
  • GUI deliverables include mood boards, sketches, mockups, visual toolkits, final art assets and even CSS specs.
  • Interaction Design is the grey area between UX and GUI design.
  • Interaction, in our vernacular today, refers to the motion between states of controls and states of an interface.
  • Innately understand and prioritize what is best for the user and also understand the mechanics of physics and motion design; they also understand the capabilities of current dev tools such as CSS3 and HTML5
  • User Interface (UI) Design generally refers to the user facing side of any type of physical interface
  • A UI designer is responsible for everything that a user will see on the interface.
  • 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.
  • One who builds user interfaces that support the exchange of information between an application’s users and its back-end processes and databases.
  • UI Developer’s output is functional, testable, shippable code that lets users accomplish their goals when using an application. The UI Developer is also responsible for documentation that allows others to maintain their code.
  • A UI designer may have the ability to create interactive designs, icons, colors, text, and affect a number of other elements that solve problems dealing with direct interactions to the user. Those elements are fantastic tools to affect user experience but they are only part of the equation.
  • The very minimum:
  • Learn HTML & CSS. Learn Photoshop. Learn basic typography.  Learn basic color theory.  Learn about layout.  Get a feeling for producing UX deliverables.  Learn about usability evaluation methods.  Learn the best practices for web design. Understand the difference between designing web sites, web applications, mobile applications, desktop applications and experiences.