Nowadays, we know how important it is to take care of the ergonomics of our website and more importantly, the user must have a quality experience during the moment of interaction.
We know the importance of design and UX design, we know that a site must be attractive and we know that we must optimize customer satisfaction to generate conversions.
Finding a definition and describing UX design is interesting, but until we have concrete examples to illustrate what makes a good UX design, it all remains a bit abstract. So, how can we be sure to adopt the right approach? What are the different steps to achieve a successful user experience?
Step one: research and benchmark UXTrends
Design and UX are constantly evolving as users' habits change. That's why this research phase must be based on proven best practices, but also take into account emerging trends. The ultimate goal of this process is to select sites that have the best practices in terms of design.
Chrystelle Liauzun, our UI/UX designer pointed us to her favorite sites and selected some of the best websites in terms of user experience!
"There are many diverse resources for doing UI/UX intelligence. The most important thing is to find the format that suits you and be open to diversifying your sources and remain curious. Personally, I like to mix up the media for monitoring quite a bit, whether it's Youtube or Twitch channels, Instagram or Dribble posts, blog posts or even company case studies. The web is full of multiple resources, all interesting for their specific contributions. These resources allow me to practice a rather different kind of monitoring depending on my needs and/or the time I have to spend on it.
For a quick look, I suggest you turn to Dribbble, Behance, Muzli or even Uxcel (on Instagram)."
Dribbble and Behance are the two major social networks dedicated to the different fields of graphic design. You will find logos, icons, UI interfaces, illustrations, case studies, moodboards...in short a real gold mine!
Fast and efficient for finding inspiration, Muzli is a content aggregator and search engine. Every week, it offers a recap of design trends in several areas: UI, illustration and packaging. A little extra that allows you to discover new people and follow their work.
My favorite, Uxcel offers several forms of UI/UX learning:
- on Instagram you’ll find quick and fun quizzes to test your knowledge
- on their site, they offer courses that are divided into several lessons to deepen your knowledge on many topics
If you want to do an in-depth monitoring whether it's to keep up to date with developments, new UX trends or to do a specific research on a topic for your work, it will be better to turn to case studies or blog articles. Here are some of them:
NNGroup: NNGroup is recognized worldwide for its expertise in the field of UX. Their articles talk about usability, ergonomics and user experience
UX Collective: a blog that gathers a lot of articles on different themes
UX Daily: a blog from Interaction Design, a well-known international UX player
Smashing Magazine: a blog with very specialized subjects with topics around the web, design and new technologies
Apart from blogs, don't hesitate to look for inspiration on the latest versions of recognized sites.
Finally in video format, I enjoy watching or streaming Basti UI on twitch. His Youtube channel gives various tips to improve one's design process and talks about tools like Figma or Sketch while on Twitch you can follow him in real time working on professional projects. I like to watch how others work to get inspired and adapt good practices to my projects."
Second step: know your audience and understand their issues
This may seem obvious, but before even starting the development process of a project, a UX designer must put themselves in the shoes of the end user. They need to know the motivations and friction points of the users. Designers must be able to see a website through the eyes of a user and anticipate the best ways to navigate it. They need to take the multitudes of pieces and put them together in a way that makes sense to those who navigate it. This can also be done through the use of personas.
Third step: imagine the user's path based on the main objectives
Imagine we develop a website for seasonal rentals, here are the objectives of the user:
- View rental offers in a geographical area with specific dates,
- Compare different housing options,
- Respect a budget by filtering prices,
- Change the dates and see if there is a price reduction.
Once the objectives have been defined, it’s easy to determine what the user's path will be for each objective. For our example:
- To visualize rental offers in a geographical area with precise dates > one must be able to easily fill in an arrival and departure date (via calendars). Is it possible to add useful information (such as school vacations or public holidays)? A map will help visualize a defined geographical area. In this case, the user will probably use filters. The UX work will be based on the UI with each filtering that must be clearly identified.
- Compare different housing options > at what stage in the different steps will the user be able to compare? And how to develop a tool that is not too complex, but effective?
- Respect a budget by filtering prices > filter with a slider that allows you to define a minimum and maximum ceiling by moving it.
Which filter do you think is the most relevant to use? Tests could be done to determine what works best for your users.
- Change dates and see if the price is cheaper> this objective could be the subject of a particular tool that would take the form of an "I'm flexible" button and that would propose a tool with date ranges and price variation.
Could this tool be adapted to answer the objective "If I change my dates will the price be cheaper"?
In the next article, we will detail examples of user path problems for IMAIOS and what we have chosen to put in place to meet the various objectives.
Things to remember for a good UX design
- Always keep it as simple and consistent as possible: simplicity and consistency are the characteristics of a good user interface. The user wants to understand at a glance and needs to know what he has to do to reach his goal (subscribe, find the information he is looking for...). Recent studies have shown that the average attention span of a human is estimated at 8 seconds!
Careful: make sure that the user always knows which page he is on in the site. This is often achieved using a breadcrumb trail and/or a visual effect that allows the user to find his way around.
Similarly, the user's comprehension depends on known visual elements that will serve as landmarks and facilitate reading. For example, most sites place the shopping cart on the right-hand menu bar, so users naturally expect to find it there.
Here, the breadcrumb trail is visible, but the category you are in is also indicated by a visual effect: the category is in bold and underlined. The user is not lost and knows exactly which part of the site they are in.
- Design should be user-friendly and accessible: when it comes to design, designers are often obsessed with appearance and appeal rather than functionality and accessibility. Most favor things that are beautiful and aesthetically pleasing. Of course, aesthetics are important and we should definitely try to make designs attractive, but only after we have user-friendly products. The most important task of digital products and services is to fulfill a function. Accessibility enables people with disabilities to use websites, tools and technologies.
- The tree structure must be clear and structured: the tree structure of a website refers to the organization of the content and pages of a website and the links between each page. We consider that a good tree structure is not too deep, that is to say that it does not contain too many levels (the home page being level 1). The goal is to make it easier for users to find what they are looking for. A well-designed architecture will also benefit your SEO because if Google's bots understand your site well, your pages will be better indexed.
- Use UX Writing: it refers to the editorial dimension of UX. It is about texts written to improve the visitor's experience on the whole site. The idea here, unlike copywriting or web writing, is not to convince, sell or bring value to the reader, but to:
1. to make their journey on the site more fluid;
2. enable understanding and accessibility;
3. personalize the experience to generate affect around a brand, a product or a service.
This is done in aim of reducing user friction points by trying to remove all the elements that could be confusing.
In this example, which message do you think is the clearest and makes the user's progress more fluid? For us, example 1 really helps to understand what is to be avoided in the email address entered and how to correct it. There is a real support for the user.
Now that you know a little more about UX design and why it is essential to take it into account when creating or redesigning a website, you can start thinking about how to improve the user experience on your site by going through all the steps. This undeniably takes a lot of time, but it's worth it: it creates a virtuous circle, because the user will be less frustrated and will therefore spend more time on the site. Your referencing will be optimized, your ranking as well, which will increase the number of new users and the global traffic.
