The process of designing a new website is a complicated one, having to take into account a whole host of different factors and considerations. This includes things like the overall layout of a website and the technical aspects in the backend, to the design and branding of the website. Something that should always be informing the decisions you make in the process of web design, however, is the idea of User Experience, or UX, and the User Interface, or UI. In this article, we will explore what these terms mean in the context of website design, and what you need to consider when building a website to bring your users the best experience possible.
What is UX Design?
First of all, we’ll cover what is meant by the term UX design. The phrase user experience refers to a person’s emotions and attitudes when using a system, service or product. This is referring to things like the practicality of the experience, how valuable the experience is and how effective the product or service is. When we apply this to users visiting websites, UX oriented design should always be focused towards delivering a website that is easy to navigate, clearly laid-out, valuable and efficient for all site visitors.
What is UI Design?
Unlike UX, which is a term that can be used in many different industries to define the overall experience a user has when using their product or service- user interface is a strictly digital term. UI design concerns itself with the practicalities of how a user interacts with your website; how your website looks and feels to use, how intuitive the website is to explore for a user, among other things. A UI designer will be thinking about things like buttons and icons, the typography of content, the branding and colour schemes of pages, all graphics and imagery, as well as how responsive the design of the website is.
UX vs UI: What is the Difference between UI & UX Design?
So, what is the difference between UI & UX Design? This is a hard question to answer since both of these terms are essentially working towards the same thing: bringing the user a website that is easy to use and provides a valuable experience.
A good way to think about the two ideas is that UX-oriented design is concerned with an aerial view of your website; looking at how all of the pages and moving parts of the website work together to create the best experience possible for the user. If we were to speak broadly about the term, the User Experience is a huge part of the planning process when designing a new website. It is something that needs to be considered from the very beginning of the build, right from when you are putting website wireframes together. UX design is, in essence, providing you with the skeleton of a website and the user’s journey; where things will go, how pages will link together, how everything will run together as smoothly as possible.
UI design, on the other hand, can be defined as everything that goes into the practical elements of the website- everything around the skeleton. With UI design elements, you are bringing the plans, the ideas and the user journey to life. This is why the previously mentioned visual design aspects come into play for UI design; you have the framework from the UX planning, now you need to consider how a user navigates your website in practice. What buttons does a user need to click to get to what section? Where should these links be placed on the page? What tone should the imagery and branding of a page set when a user lands on it?
While both of these terms refer to ideas that work in tandem to bring out the same ultimate, goal, they are two very different ideas;
- UX design is primarily focused on identifying and solving user problems, whereas UI design is all about creating the visual interfaces and designs that solve these problems.
- For this reason, you will always see UX design come first in the website design process, followed by UI.
- The UX designer maps out the skeleton of the ideal user journey; the UI designer then builds on this with visual design elements.
- UX can apply to any product, service, or experience; whereas UI is only relevant when talking about digital experiences.
Why is User Experience important?
When designing a website from scratch, what you need to be considering is that, for many people in your audience, this will be their first interaction with your brand and the service you are providing. If a user walks away from your website having had a negative experience (for example, using a slow, unresponsive website), then your brand’s reputation will have been harmed- and you will be much less likely to gain a goal conversion from this site visitor. Your website will be many people’s first impressions of your company, and first impressions are crucial in the world of business!
Want to learn more about our Web Design services? Visit our Web Design service page here
Aspects of Good UI & UX Design
With both UI and UX design, there are several best practices and factors that need to be considered when looking to create the best website possible. These aspects range from the initial planning process right the way up into the physical implementation of design elements and consider the likes of:
Clear site hierarchy
Before you start creating the actual interface of your website, with all of the design elements and aesthetics, you need to have a clear understanding of the flow of your website. Considerations like where all the different pages will be located, how they will all link together, what kinds of menus and subcategories you will be looking to implement on the website and more. These ideas are usually represented in the form of a website wireframe, which is a type of visual plan for a website that lays out the skeleton and basic framework of your site.
Examples of clear hierarchies that need to be laid out within your website’s wireframe include things like the menu navigation. You will have noticed that most websites have the main navigation bar towards the top of the page, that will then link off to different subcategories and pages on the website. Having this hierarchy in mind when you’re planning your website build is very important, as you need to make sure that the user’s journey is one that makes sense and is intuitive/easy to follow.
Page layout
While the structure of your website overall is vitally important, you should also be applying the same ideas to each of your pages on an individual basis. Depending on what the goal of the page is (for example, is it a page listing products/services, or one that provides information), you need to know precisely how the content on this page is going to be presented. Will you be utilising imagery and graphics alongside text-based content? Will there be essential links and buttons that lead onto other parts of the website or specific products?
The layout of these pages should reflect what the user’s journey should be, as well as the desired action that you want your visitors to take. If the point of a page is to direct visitors to goal conversions, then the buttons/link should be clearly signposted and placed in an appropriate area of the page. Any written content on the page should also be laid out in a clear header structure and should flow well when read.
Site speed
Another aspect of your website design process that will affect the user's experience is the speed of your website. The speed of your website and how quickly your pages load can be seen as one of the most immediate factors in providing a good user experience. If a user opens one of your pages and finds it taking an age to load, then this will immediately leave a bad taste in the user’s mouth. Poor load speeds are often linked to the bounce rate of the page; the percentage of people that left the page without committing to further actions, such as reading on or clicking through to another section of the site.
To make your website run as efficiently as possible and avoid these slow load times, you will need to have a look at some of the technical aspects of the page. The following factors can affect the speed of your site:
- Heavy use of JavaScript and CSS files
- Bad server hosting and slow server response times
- Poor, inefficiently written code
- Too many Widgets and Plug-Ins
Consistent design & branding
To create the best user experience possible for every site visitor, you will also need to consider the design and branding of the website. It would help if you made sure that the tone of each page is appropriately conveyed by the design, that the colours and branding of your business are consistent across the website and that it is designed in an aesthetically pleasing way, while not detracting from the content and goal of the page. For example, you wouldn’t any of your CTAs to be overshadowed by loud design and branding choices, nor would you want the designs you go with to clash tonally with the type of page they are situated on. As with the page layout, you need to be considering what the point of your pages are, and making sure that your design choices are in keeping with a page’s goals.
The concepts of User Interface and User Experience-led design, while affecting different aspects of the web design process, are both concerned with the same end-goal- providing a high-quality experience to every user that visits your site. When starting a new website build, you will always need to consider both of these ideas, both in the planning and implementation stages, if you want to create the best website possible.
At Digital Mast, we are experts in website design, with web design being one of our most prominent services. If you wanted to learn more about how we design websites using Webflow, you could visit our web design service page here, or you can get in touch with the team here.
