Design: The difference between UI & UX design

UI

User interface is focused on the actual elements that your see that the user will interact with. It refers to the aggregation of approaches and elements that allow users to interact with a website, mobile app or software application. Interaction design refers to the motion between the states of controls and states of an interface. Does the user tap or swipe? What happens to orientation when you turn the device? Interaction design means you need and understanding of both UI and UX as well as the capabilities of the current development tools so that the final design makes sense for both the user and the product as a whole.

UX

User experience relies on the smallest of details to drive it to provide a positive memorable experience to the user. We are designing to deliver an emotion as that is what the user will remember, what they feel, not always what they have seen. We work to weave together the text, graphics, layout and interactive elements to ensure users have an experience, not just an informational view.

We believe that the fundamentals behind UX design include:

• Contextualisation (making sure users know where they are in their journey)

• Being human (using human interactions, such as tap and swipe)

• Findable content (using wayfinding techniques)

• Making it easy on the eye (consistency, clarity and a strong visual hierarchy)

• Be simple and effective(avoiding distractions, jargon and long loading times)

Measuring successful design

Five factors that help define whether a website or app meets the users’ needs are:

• Discoverability—does a user know what to do to achieve their goal when they first look at the interface?

• Learnability— can a user learn what the interactions are and then predict how to move through the website/app. When they return, can they remember?

• Efficiency—how quickly can they repeat tasks once they have learnt how it works?

• Performance—does the interface respond quickly when the user interacts? if it’s slow, what does the user see to distract them?

• Delight—Does the UI delight and engage the user?

Key deliverables in UI and UX design include:

User Profiles and Personas

Knowing your audience is the first step in UX design and enables you to develop experiences that reflect the voice and emotions of your users. Personas can be developed using website data.

User surveys

We will interview existing and potential users of the interface to gain insight into what would be the most effective design. Because the user’s experience is subjective, the best way to directly obtain information is by studying and interacting with users.

Content inventory

Content inventory is an organised list of the content and it’s detailed data. Doing a content inventory is a step towards proposing changes in information architecture to enhance the user experience (e.g. user flow, findability and efficiency).

User flows

We design how users should move through the interface and what interactions they might expect.

Wireframes and prototypes

Based on our findings, our UI and UX specialists will develop wireframes of different layouts and prototypes to play with.