The term UX stands for User Experience, the term UI is used for User Interface. Both the UI and the UX are crucial factors in how a website or an app is perceived by the user and whether the product works as a result.
UI design
User interface design deals with the design of the surface (the interface) of an app or a website. Issues that a UI designer has to deal with include the type of navigation bars, sidebars, icons, and input fields. It is not about the “beauty” of the interface, but that the layout supports usability. Nevertheless, an aesthetically pleasing design of the user interface is important, because the visuals are what, along with the technology, become permanently anchored in the minds of the users. So if you want to build an emotional connection with your users, you can’t avoid a good UI design.
UI design often overlaps with another field called interaction design (IxD). Interaction design specializes in the ways in which a user interacts with the system. These include, for example, user interface, pop-ups, chat and error messages. Interaction design focuses on user behavior, so it lies between UI and UX design.
UX design (UXD, UED or XD)
User experience design focuses primarily on the user experience, so it is web design from the user’s perspective. Thereby, one tries to achieve an “intuitive” operation, as an operation that works without further searching in the manual. The visitor’s journey through a website/app is often referred to as the “user journey.” The core question of UX design is: How can an application be designed in such a way that the user can achieve his goals easily and without much effort? There is a direct correlation between UX design and business goals such as sales or conversions. For example, a website should be optimized to encourage certain behaviors.
UI and UX designers work together as a team. Their areas of activity separate where the UI designer takes care of functionality, while the UX designer works with test users and feedback analysis to find weaknesses in usage.
The start is always made by the UX design. The UX design is often elaborated in wireframes. In these rough plans the structure of the navigation is defined and shown. Later in the UI design phase, these wireframes are transformed into detailed pages, adding, for example, fonts, colors, branding, etc.
