What’s the difference between UI and UX design?

This article was first posted on Quora.com. (Wiki Answer)

UX architecture intelligently provides for the user’s interactive experience via features and functionality of a software-based product or service. This is achieved through a UX process which includes user persona definition, user scenarios/task flows, primary and edge use cases, architecting hierarchy of content and user decision points, etc… The UX-er is known as the primary user-advocate on a team, thereby leading the efforts around understanding the user needs/desires along with balancing those of the business stakeholders. UX documentation informs (and is informed by) content and development requirements; UX informs creative. There is significant interplay between these core disciplines throughout the development process at large, but simply put: developers are building what UX is architecting, and creative provides the visual look-and-feel based on UX architecture and brand requirements.
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. You can have a GUI without UX and UX without a GUI. The design of a GUI should be heavily informed and guided by the problems that were solved during UX process. UX design is rarely informed by the creative. (If it is, you’re doing it incorrectly). 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. It is performed well by some (not all) UX-ers. It can also be performed well by some (not all) creative/GUI designers. Interaction, in our vernacular today, refers to the motion between states of controls and states of an interface. Does the user tap or swipe? Does the entire app rotate along with the device rotation or is it locked to a vertical orientation? These are the types of problems that interaction specialists explore and solve. Whether they be UX or GUI, the people most successful here 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. It’s handy (imperative) to have prototyping skills in time-based and/or dev tools to explore and actually simulate/test experiments to arrive at a final interaction design that, again, makes sense for the user and the product as a whole.

Dan Saffer, Designer and Author states:

Simply put: UX is the overall experience one has with a product or service, which can include a UI. A UI is typically a combination of visual design (the look and feel) and the interaction design (how it works). UX, however, can encompass a wide range of disciplines, from industrial design to architecture to content.

A diagram I did a few years ago: