UX Design, Accessibility, Color blindness

Aline Thomé
NYC Design
Published in
6 min readOct 2, 2018

How can our pages be as beautiful as they are intuitive? How can we help our users in finding what they are looking for, instead of getting lost in a sea of information? Those were some of the questions participants from this year’s Round Table were asking themselves. Thus, we wrote this post to share with you what we told them.

Spoiler alert: the solution lies in the experience of our users!

How to keep our users interested

As mentioned in this post, physically our brain is not so different from our great-grandparents’, but on the other hand, our expectations evolve a lot with technology! Nowadays, what really makes a difference when buying an electronic are not the features, but the experience you have while using it. So basically, the way to stand out from the crowd is through user experience.

The same applies to our reports. Not all reports are the same, but the content structure is more or less similar and doesn’t change much over the years. So, to keep the reader interested, we need to enhance the experience.

UX vs. UI

Now let’s talk about the difference between UX and UI — respectively shorts for User Experience and User Interface.

Basically, UI focuses on how things look like, while UX goes deeper on the user journey, content and processes behind the scenes. The two thought processes are not the same. They have different strategies and outputs, as they are two separate fields. But they are highly collaborative and share the same vision and goal, which is: happy users! So actually, it isn’t about UX versus UI, but UX and UI!

How we really use the web

Here it’s an example from the book Don’t make me think, where Steve Krug describes some ways how we think our users behave versus how they really use our pages.

One of his golden rules is: When using the web, we don’t read pages — we scan them. So, what we need to do is to adapt to our users, which in this case means format content to support scanning. This can be done, for example, through using more headlines, shorter texts, and bullet points whenever possible. Best-case-scenario with images and graphics to support content and help the process of retaining information.

Case study — Solvay

Ideally, our users should be able to find what they want with minimal effort. We have to make our reports are so intuitive that finding something is almost an automatic process. Here at nexxar through user testing, statistics analysis and other methods, we study our reports extensively to find the most important needs of different user groups. Once those needs are identified, we make the redesign to best address them. In other words, by improving the design we save our users’ time.

Through testing we can answer questions such as: Which teasers are being clicked the most? Are the users scrolling until the end of the page? Are there clickable areas that aren’t being clicked? These are examples of questions we had last year before testing Solvay’s 2016 Annual Integrated Report.

We did a small round of UX tests, looking for qualitative results rather than quantitative data. Those users were given a list with assignments that they needed to perform, such as:

1- Find the report online
2- Evaluate look & feel from landing page
3- Change the language of the page
4- Find specific information on Solvay’s shares
5- Find the chart generator
6- Read the Chairman’s message
7- Download the complete PDF

We based the assignment list on the statistics, so we knew which pages were visited the most from different types of stakeholders. As you can see, those are simple tasks, but summed up they could give us very nice perspectives on how different users navigated through the report, as well as see when it was hard to find key information.

We had an extensive list of learnings through testing, but here we will focus on a page that is key to the report: Solvay’s business model, aka Sustainable value creation model.

Sustainable value creation model redesign

Solvay’s business model in 2016 was the first step into making an interactive online model. It was very avant-garde and engaging, but on a closer look we found a few usability issues. To improve those issues in 2017, we have:

  • drastically reduced the amount of content in the page — this way it is clear that the SVC is the focus;
  • created a very visible tag inviting you to click to explore, thus making sure all users could notice that the SVC is clickable;
  • redesigned the tab on top to avoid confusions, evidence the inputs and outputs;
  • used stronger colours for better differentiation;
  • evidenced the division between key figures;
  • designed a new, clearer icon for strategic objectives;
  • included extra content in the main wheel;
  • created links from the markets to a page with further information.

Accessibility

Here at nexxar we are always paying attention to accessibility, which is often a forgotten topic. Well it shouldn’t be, because improving accessibility makes our reports reachable to a broader audience. We often check diverse parameters on our reports, from readability to colour contrast checking, up to a colour blindness simulator, which is what you can see here.

Crucial parts of the report can be tested and improved, which was the case with Solvay’s business model as well. See below on the left the original Business model and on the right a simulation of how it looks like to someone with red-green colour blindness (Deuteranopia).

Colour blindness simulation made with app Color Oracle

As you can see, to users affected by red-green colour blindness (at least 5% of all men are affected), several of the pastel colours of 2016 appear to be indistinguishable from one another. By making the colours more vivid and making the key figures boxes stand out, we’ve highlighted the difference between elements, at the same time improving contrast and, therefore, readability.

Colour blindness simulation made with app Color Oracle

UX is always evolving

I need to state that there is no perfect page: you can’t make tests, design “the perfect page” and stop there. UX is constantly evolving. How designers approach the user experience changes as technology advances and users respond to those advances. Companies that really invest on usability are continually evolving. Our platforms need to adapt to the users’ behaviour, instead of forcing users to change how they interact.

Technology evolves, and with it, users’ behaviour changes as well. We need to understand our users to give them the best possible experience while facing our brand.

Conclusion

I hope that now UX is clearer to you. Some people think of UX as something new to web design, but trying to understand our users has been a “thing” for decades already. Having a real understanding of what motivates people to do what they do, is one of the most important skills for a designer.

I personally believe that through improving UX we are simplifying our users’ lives.

This post was originally posted on the nexxar lab: User Experience Design.

Do you want to improve the UX Design of your page, but don’t know how?

Let’s talk: alinethomedesign@gmail.com 🙂

.

--

--