Most of us don’t make any difference between User Experience (UX) and User Interface (UI). However there are differences and it is fundamental to understand it, not to be completly out of the game.
What is UI?
User Interface is the way, the physical way, an average user will interact with a product. It means that UI is mainly technological and can be considered as a technical solution to display information and interact with the users. Often UI is seen as software design, visual design but it also encompases all physical designs such as buttons, colors, shapes…
What is UX?
User Experience is more about how do feel when using the product. Usually it means that the users have been deeply identified, studied, the UI sevral times tested in real conditions. UX aims to understand users needs and desires, even untold, and take into account the way the product will actually, in reality, be used. The final objective is of course to provide users the best experience ever. UX will feed the UI with insights and orientations.
Why it is important to distinguish UX and UI?
As you have already understood, mixing the feeling and the technical solution is not wise. However there is a grey zone between UX and UI. This zone is where the Experience meets the Interface, where the controls meets the feeling. That is important because the solution and the way you implement it can really affect the experience and vise versa.
To avoid main mistake when dealing with UX/UI interaction (what is called Interaction Design), it is fundamental to proceed by pretotype, prototype, testing, hypothesis validation etc… to arrive at the end at a product and interface that make sense to the users but still in cohenrece with the product DNA.