Etna Interactive
709 Fiero Lane, Suite 43
/ San Luis Obispo, CA 93401
Tel (866) 374-3762
Fax (805) 543-2014

UI & UX

User interface (UI) and user experience (UX) are terms thrown around involving the “look and feel” of websites, but understanding their difference and their interaction is vital to the creation of a successful website. Both apply broadly to human-machine interaction and both can decide how users not only find information, but also how they perceive it.

The Basics

As computers and Web interfaces are a more complicated subset of UI/UX, we’ll start with an “old school” metaphor. Picture an oven in the kitchen. Not just any oven, but one with brushed-metal and glass, hard edges, equipped with large, easy-to-read knobs and buttons galore. The UI of this machine are those buttons, handles, displays, and knobs. The UX on the other hand is how you feel about cooking and baking with it. Does it work well? Does it feel high-quality? And would you use it again?

EII-oct13-matsushita-v1_Image

In Web Design

For on-screen and mobile interfaces, these terms work a little differently, but the same concept holds true. What types of buttons and links does a site have? How do they react to your mouse hovers and clicks? Is the page well organized? Are there relevant animations or eye-catching images? These are all the UI of the site.

Joined closely with that, the UX is how you feel using the site. Is it friendly? Professional? Maybe quirky? Do you like how the information is presented? Does it compel you to navigate to a new page? Or is stale, boring, confusing, and hard to figure out?

Why It’s Important

Along with the content on your website, its success is dependent on your customers’ experience. Your website is an extension of your company, and its UI provides access and points of interaction. Would you rather cook with a shiny, easy-to-use oven that bakes a perfect pie, or an old, rusty one that you can’t figure out how to turn on?


Sign up for our newsletter to have these articles emailed to you.

Leave a Comment

Fields marked with * are required.