View All Posts  
Meredith Dunn
By Alex Herbert

Alex is a content marketing enthusiast with a passion for international travel, the Spanish language, and Starbucks coffee.

In a world of seemingly complex tech and web jargon, it’s easy to feel lost. Good news: many of these strange words and acronyms are easy to understand.

User interface (UI) and user experience (UX) are two web design terms you’ll likely hear when talking with designers or development agencies. To help you grasp these design basics, let’s break down these ideas.

UI focuses on how the website looks.

The user interface is the visual design of a website, software or app. UI design is concerned with how things are displayed and designed for digital users; it focuses on aesthetics and user need.

Effective interface design centers around user goals, skill-level, preferences, and desires. It consists of carefully placed visual elements, like buttons, menu items, search bars, icons, links, images, text fields, special features and more, to appeal to users, simplify use and increase engagement.

Good interface designs are uncomplicated, easy on the eyes, and help users get things done more quickly. They strategically incorporate color, patterns, contrast, and typography to highlight important information, direct users, and create clarity.

According to Career Foundry, you can think of UI design like this:

User Interface Design = Visual Design + Interaction Design

UX focuses on how easy a website is to use.

The user experience refers to the end user’s interaction and overall experience with a site, software or app. Ease of use, navigation and user satisfaction are all important variables in strong user experience.

UX designers make sure users have a positive experience with the digital product. Good UX makes interaction with a product or site as easy as possible. These designers consider how easily a user can find pages, navigate and perform specific functions. The simpler, the better.

At its core, UX is about the entire sequence of actions users take, the thoughts and feelings that arise while trying to accomplish a task, and the impressions they get from the overall experience.

UI and UX work together to create one cohesive product.

UI and UX specialists generally have skills similar to that of a graphic designer, but may also include front end development, interactive design, and branding. The roles aren’t exactly interchangeable, but closely related. Both carefully assess customer behavior, competitors and the marketplace to determine the best design and user flow for a site. And they tend to work hand-in-hand on wireframes, sitemaps, user guides and usability testing.

The flow between UI and UX.

Let’s say your company wants to create a mobile app for personal financial management. The UX designer will begin by researching user behavior, the market and competitor’s products to determine what the user wants and needs in a finance app. He’ll use this information to determine the core features of the app, and create a sitemap (a hierarchical view of app content and pages) and user guide.

Next, he’ll design wireframes – or rough design prototypes to outline basic user flow and navigation – which will be converted into polished, full-color designs.

From there, the UI designer will take this work and create polished designs that incorporate content, images, buttons, forms, links, icons and more. UI designers turn rough wireframes into high-fidelity designs – or detailed, fully refined and tested designs. These generally resemble the final product and are handed off to software and web developers to kickstart the development phase.

Key Takeaway

UI is focused on how the site looks, instructs and appeals to users; UX is focused on the user’s journey and creating optimal functionality. Not as complicated as they seem, right?

Next time you’re meeting with a design agency, be sure to consider how they approach UI and UX work. These are essential phases of any digital design project.

Need help with UI or UX? We’ve got you covered.

What's Up Next?