What is UI design?
UI is the design process that considers the overall experience of the brand for the user throughout a digital product or website design. You’ll often hear designers like myself refer to this as the “brand feel”.
UI considers all of the elements of the design that make it look great, build trust and credibility, and brings the brand to life through smaller details such as buttons, icons, and the overall design flow.
We believe that to get to the UI function in the design process and create a knock-out product, you have to start with good UX design. This will ensure that you are working with the user in mind first. It’s then a UI designer’s job to pull this learning together into a cohesive final look and feel to keep your users active and immersed.
A great example is when Slack launched. There were a lot of other IM applications on the market, so in order to stand out Slack really focussed on the UI to ensure it looked great which helped attract the design and tech industry – that’s how they grew their market share quickly.
A UI design example
We’ve got a great example ourselves to help you understand where UI design fits into the creation process. To get started we need to mention what UX design is.
UX design is the design process that considers the user experience throughout your website or SaaS product. By creating your user strategy the UX design process will be able to map out your website, or SaaS wireframe.
Here’s an example of what I mean.
Created by our UX team for our friends at Adventure Base.
In our example, you can see that our UX designers have outlined a working shell for this webpage. This includes the focus of this page, the information to include, and where each conversion element needs to sit. The UX designer comes to this point of view from researching and testing with the user audience.
At this point, our UI designers were able to get involved and consider the exciting final branded aesthetics and elements that would help increase on-page action and conversion.
In our Adventure base example, you can now see how the UI has expanded on the original UX wireframe to create a much more premium experience. We have deeply considered all of the on-page elements like how to contrast the buttons to elicit more click-throughs, adding quick-glance icons for information understanding, and colours, fonts and backgrounds to add to brand recognition.
UI is about the aesthetic storytelling that leads your user through intended steps within your website or SaaS product, giving them a clear understanding of what they will achieve in doing so.
UI design: fields of work
UI design is involved in many different digital experiences and whilst the principles are still the same, the resulting product can be quite different.
Here are the main fields of UI design
- Graphic user interface (GUI) – This is the process of designing websites or SaaS products as outlined above
- Game UI – A growing field, Game UI concentrates specifically on mobile, desktop and gaming platform products and considers how a user quickly navigates through a game using visual signals
- Voice UI (VUI) – Creating visual signals to a voice platform for visually impaired users, or those with a mobile impairment.
- Touch UI (TUI) – The process of designing for simplified ‘touch’ interaction, such as mobile photo-cropping, or social media ‘likes’.
Where does UI fit into your SaaS design?
We talked a while ago about the SaaS design process and we mentioned the six key steps
- Buyer persona research
- Creating a user flow
- Outlining a wireframe
- Aesthetic design
- The big client sign-off
- Handover to developers
Depending on your UI design team (freelance, agency or in-house) there are two stages that UI designers can be helpful (stages 4 and 6). Here at Strafe, we deploy our UI team to work alongside our UX team from stage 4, the aesthetic design.
This is because we work in an agile approach whilst designing your SaaS, by creating in reiterative sprints which allows us to design, create, test, learn and then tweak where we need to until we get the best product.
How important is UI?
It is thought that the brain can process visual information in as little as 13 milliseconds. That’s 60,000 times faster than text, so UI design is incredibly important when it comes to on-page user experience.
Good UI design can be a game changer in a user’s perception of your product’s usability and interactivity.
The most important elements of your UI design
- Creating an easy-to-use interface
- Making interaction comfortable
- Visually clarifying the intended next step
- Maintaining reliable page rendering and speed
- Branded elements that enhance and elevate the user experience (that premium feel)
If you’re looking for a strong UX/UI experience for your digital product or brand, then get in touch today on our Project Planner below!
