I was asked again this week, what’s the difference between UX and UI.
On it’s surface, it’s pretty simple: UI, User Interface, is what you look at. The visual design of the app. The colors, look and feel, style. That’s all UI. UX, User Experience is the sum total experience with the product or app. If it was a house, UX is the floorplan, and UI is the paint job.
What a lot of people- marketers, founders, and biz dev – may not understand is what that actually means in the real world. In the inimitable words of “The Bobs”:
So what does a UI designer do? a user interface designer would be “good with photoshop” (or whatever design program they prefer to use. There are great alternatives to Photoshop now.). He or She would draw the layout, decide the color, and create the visual style. Instead of pencils, markers and rulers, they use software. (They might actually start with “analog” media.)
What does a UX designer do? A UX designer is a bigger picture thinker. A user experience designer will help figure out who the product is being used by. They’ll do research to make sure that their needs are actually being met. They’ll perform task analysis to see how they are tackling problems. The goal at this stage is to understand the user(s) and lay the groundwork for building the product to service their needs. They’ll try to understand the users’ context and emotional state. Sometimes, those portions of the UX role are done by specialized UX researchers. They never draw anything or open photoshop.
After Research, a UX designer will start mapping out the structure of the app. They’ll work on Information Architecture which helps organize a website or app so information is easily found. They’ll work through the individual flows, creating black and white drawings which loosely represent a finished website or app, called wireframes. Wireframes serve 2 purposes: to indicate the content and structure of individual screens, and to walk people through the actual flow of performing a task (which requires a series of wireframes). Generally, wireframes can be put into a prototype for a more realistic feel of the app. That way, people can actually click/tap through the app themselves and really feel like they’re using it. The people that perform those tasks are Information Architects, and Interaction Designers.
After all that, finally, the UI designers come into play. After the research, the wireframes, the prototypes, the UI designers can work on the visual style. They’re a component of the UX process.
But we’re not done yet. This is a process, but it’s not a linear one! UX isn’t a single top down, now we’re done, type of thing. Now we have Usability Analysts. These guys and gals take whatever’s been created – at any step of the above process! – and test and validate. Sometimes they uncover mistakes, or wrong assumptions, or a better way to handle a problem. Then things get sent back around to the UX researchers, information architects, interaction designers and user interface designers to modify and adjust.
If you’re really lucky, you can find a designer who’s skilled in all those areas. But now you realize, you’re asking for someone who does 4 or 5 jobs. And it’s not just a paint job.