Behavioral Sciences applied to Landing Page Design.

I am delighted to see that the discussion has begun. The subject is indeed a passionate one, a very large one, and one that still is in its starting blocks. I am delighted because this will allow me to gain more knowledge.

Just a reminder: the reason why I write articles on this blog is to bridge the gap between the enormous amount of scientific knowledge and subjective creativity when it comes to creating digital screens. I do not publish scientific articles on my blog.

I am not a scientist. That’s why, over the years, I have surrounded myself with several PhDs and professors. They are our Scientific Council.

The combination of business and scientific efforts allows us to book progress in the field of practical techniques. It’s not about revolutionizing whatsoever; it’s about obtaining concrete business results for our clients (e.g. the 140% increase of online sales of Nespresso, in no more than 8 months, or the 29% increase of calls to eBay).

Within the frame of our methodology we perform user tests in order to combine a maximum of different objective parameters providing us precise data on the non-conscious behaviour of users (ocular fixation, pupillary diameter, attention focus, memorisation, …).

It is within this context that Laurent (Doctor Laurent Hermoye), Arnaud (Professor Arnaud Pêtre) and myself have decided to complete our data with IRMf data allowing us mainly to measure the brain activity generated by two different screens, based on the contrasts they generate. The objective: to comprehensively investigate the activations of visual and semantic zones.

After having received the approval of the ethical committee we have initiated our work with an IRM 3 Tesla Philips, equipped with a visual projection system. We have performed an anatomical and functional IRM on 5 healthy patients between 20-40 years old/CSP+ for a period of 40 minutes.

The experimental paradigm consisted in the random presentation of 3 conditions:

• the Belgium.be site, 4 pages, approx. 4 sec. per page
• the facebook.com site, 4 (personalised) pages, approx. 4 sec per page
• blank page, 6 sec in between each block.

Each tester had received a genuine and precise scenario for each of the two sites that needed to be tested.

The analysis of the IRMf data has been done using SPM5 (Statistical Parametric Mapping) with a minimal TMAX threshold of 2.3.

All the conclusions are derived from scientific work (Science,…). Some examples:

• Bro 45: Wagner, A. D. (2002). Cognitive control and episodic memory: Contributions from prefrontal cortex. L. R. Squire & D. L. Schacter (Eds.). Neuropsychology of Memory (3rd ed.), pp. 174-192. New York: Guilford Press
• Bro 44: Dr. Darren R. et al.(1995), Functional imaging of human right hemispheric activation for exploratory movements ,Annals of Neurology, Volume 39, Issue 2 (p 174-179)
• Bro 45/46: Buckner, R. (1996). “Contributions of specific prefrontal brain areas to long-term memory retrieval”. Psychonomic Bulletin and Review 3: 149–158.
• Associative visual zone v4: *Moran & Desimone. “Selective Attention Gates Visual Processing in the Extrastriate Cortex” Science, Vol. 229, No. 4715. (Aug. 23, 1985), pp. 782-784.
• …

You will easily understand that this type of information is not interesting for the majority of UX professionals, and most certainly not on a blog

Would it be possible for the different people who want to leave a comment to also provide some concrete examples and the accompanying business results? That will allow me to supply my professional knowledge with new concrete elements.

I do want to thank you again for the shared passion on UX.

A splendid day to you all…

How can you define something that is simple? Simplicity is indeed an abstract term.

Let’s have a look at some dictionaries, those works that since the 17th century have done an incredible effort of synthesizing all human experience, and see what they have to say about it.

It is terribly interesting to see that for the definition of something that is easy, man has only used terms that mean the opposite: effort, difficult, complex,…

By assembling the main concepts, simplicity is the skill of performing an action that raises no questions, difficulties or efforts.

It is clear that for the word simple to exist, we need to go through a series of objects whose attributes make it simple – or not.

If we apply this concept to our profession, we can say an interface is a series of graphical objects that form an entity with which users will work. And it will be this entity that will be considered simple – or not.

Since human behaviour is 95% non-conscious, simplicity will be evaluated based on:

1. A skill that is 95% non-conscious
2. An imposition to our mind that is 95% non-conscious
3. A difficulty and/or effort that is 95% non-conscious

Non-consciousness, the automatic mode of our brain, makes cognitive activity lighter for us. As such, it is the basis of simplicity.

An efficient method is a procedure that assembles all graphical objects in such a way that users will perceive its use as simple and that generates behaviour that is based on the 95% of non-conscious activity of our brain.

Not all methods to create a strong user experience are efficient. Worse still, some are quite the contrary !

Allow me to explain using an analysis of number representation by Denis Guedj (a professor in science history and epistemology at the university Paris VIII-http://en.wikipedia.org/wiki/Denis_Guedj).

Roman numerals use letters: I, V, L, C, D, M, …

The problem with this method is that for each number that is higher than the previous one, you need to add a new sign. That means that the number of basic signs increases in function of new needs.

The Indian numeration, which is the basis of our system, allows doing everything using very little.

With only ten numbers, from 0 to 9, you can represent any possible number you want.

This method, which was finalised in the 16th and 17th century by Indian astronomers and mathematicians, is still valid today and has never been challenged by any other method.

Let’s take an example and write the number 1999

In Roman numeration, these are the rules to be followed:

• Use addition to reach the number
• Proceed by power of ten by power of ten (multiples of the decimal)
• If you need to use four symbols, use the subtractive method
• Only use the symbol immediately preceding the symbol when using the subtractive method

By following these rules, we get this result for 1999: M CM XC IX (1000 -100 + 1000 – 10 + 100 – 1 + 10) and not MIM (1000 – 1 + 1000)

In Indian numeration, instead of having to follow rules, you have to answer the following questions:

• How many thousands? Answer: 1
• How many hundreds? Answer: 9
• How many tens? Answer: 9
• How many units? Answer: 9

To me, the world of user experience can be compared to numeral systems:

Usability is a set of techniques that evolve empirically, like Roman numeration. Usability mainly uses the rules of common sense applied to objects.

What is extraordinary is to see how many usability guidelines lists exist that contradict one another.

Usability, like Roman numeration, leaves us with an enormous field of possible subjective interpretations.

The interpretation of the rules concerning Roman numeration allows us to write 1999 in several ways:

• MCMXCIX (1000 – 100 + 1000 – 10 + 100 – 1 + 10) -  Respects the official rules as they were written down in the Middle Ages
• MCMXCVIIII (1000 – 100 + 1000 – 10 + 100 + 5 + 1 + 1 + 1 + 1) – Probably how the Romans wrote it, since the 9 was often written as VIIII
• MDCCCCLXXXXVIIII (1000 + 500 + 100 + 100 +100 + 100 + 50 + 10 + 10 + 10 + 10 + 5 + 1 + 1 + 1 + 1) – Possible because there are four following letters

Behavioural science however is based on the fundamentals of the perceptive and cognitive system of the human brain. If you know these fundamentals, you can answer all possible interaction cases without having to rewrite new rules every time you encounter a new problem. It’s like using the numbers from 0 to 9. What does evolve over time is not the set of rules, but the fundamentals themselves.

That’s why I am convinced usability has been on the decline since 2 years and why UX based on Behavioural Sciences is so rapidly gaining ground. The future will tell

In the digital world, where business results are ever more top of the list, user experience is one of the key factors of success.

Today is a day I’ve been looking forward to for 3 years. I am going to present you the latest innovation of Netway: the ability to travel in the mind of users in order to gain a better understanding of what’s going on.

I want to illustrate this by sharing part of the analysis we did on the Facebook site for one of our customers.

But, before getting into the subject, allow me to explain why it is necessary to understand what goes on in a user’s brain when you design a screen.

The answer is quite simple: users are more and more in contact with competing screens, it becomes ever more difficult to differentiate your screen from the competitors’ screens, …

Google’s CEO Eric Schmidt is right when he says human behaviour becomes a vital tool in the success of digital projects and in meeting objectives.

So, let’s go!

The brain works in sequences of activities that last milliseconds.

Thanks to eye-tracking, we can see where the brain decides to go to collect information because we can observe the eyes. However, it is impossible to know whether the person is already familiar with the content on the screen, whether the screen incites users to click or whether the user has memorised the screen, …

Now, all these problems belong to the past! Imagine looking through your customer’s eyes and now to travel within their brain.

The images of fMRI (functional magnetic resonance imaging) and of EEG (electro-encephalography) allow us to know which neurological mechanisms are involved when someone uses a site.

In plain English: we can see which zones of the brain are activated when a user is performing a task.

If we can identify the activated zones of the brain, we also know the answer to the following questions:

• Doesn’t the screen have too many elements?
• Which parts of the screen are analysed the most by the brain?
• Do users recognize the used visuals?
• Do the call-to-action elements incite action?
• Do users understand the content?
• …

And if we do that, we can objectively measure the user experience.

Let’s get back to our Facebook example…

I will deliberately make my explanation a bit more accessible so the greatest possible number of our community members can benefit from it.

Let’s go for it …

In the case of Facebook we see the right visual cortex has a higher level of activation. This indicates the visual elements at the left side of the interface generate more brain activity than the right-side elements.

But what does this mean? Let’s take a closer look at the activation flux in the visual cortex.

We see the visual cortex is not very activated between zone V1 and the Brodmann 7 zone (in blue). This means the visual attention (position in space, orientation and size of the graphical objects) requires little effort. This means the site has a visual organisation that requires little visual attention.

But if we look at the zone that goes from V1 to V4 (in orange), we see it has a higher level of activation. This means users non-consciously identify and recognize the visual elements on the screen.

The fusiform gyrus is the zone that will make us recognize faces and well-known things.

We can conclude Facebook has an easily understandable and efficient visual organisation. People recognize the visual elements of the screen, and in particular the faces.

We now have interesting data on the visual elements of the Facebook homepage. However, during a visit, many cerebral systems will be active in parallel. These activities constitute sequences of milliseconds and involve:

• the visual system
• the semantic system
• the motor system
• …

Let’s now analyse the content understanding of the site.

The Brodmann 44 zone is involved in recovering information in our semantic memory. This means a surfer watches the elements and this system will activate a network of knowledge about a certain word or an object.

The information that is recovered in the long-term memory during a Facebook site visit activates the semantic network. People will know what they see and that activates a set of linked information (I know this person, it is a friend of…, …).

We see the Brodmann 45 zone is not activated. If this had been the case, it would have meant the recovered information didn’t activate strong associations. That would mean the content is not very well known or not very often used by our brain.

In short, the content on Facebook is simple and does not require a considerable cognitive effort.

Let’s know check whether the call-to-action elements generate a lot of reaction.

There is a special zone in our brain, the Brodmann 6 zone, which is activated when a surfer thinks about clicking on something. This zone of the premotor cotex plans the movement of the hand and the fingers (before actually moving). By analysing this zone we know whether a call-to-action makes people want to click on something before they actually do so.

In the case of Facebook, the interface gives moderate results.

The conclusion…

Facebook has a simple visual organisation; users immediately recognize the graphical elements; the cognitive efforts are low and surfers understand the content.

We have analysed many more zones, such as the hypocampus that allows us to know whether a screen has been recognized, or the reward system that allows us to check whether people are happy, and so on.

So how do you put this information into practice?

In our case:

• We build screens based on the required behaviour.
• Once the screens have been designed, we check whether they activate the zones and activation levels that have been determined beforehand in the form of a hypothesis.
• We cross these data with the data of ocular analysis that have been gathered in order to have a view that is as objective and as certain as possible.
• If needed (read: in 99% of the cases), we correct the screen in order to generate the expected behaviour in more than 80% of the cases.

In a December 2009 post (http://www.useit.com/alertbox/anybody-usability.html), useit.com claims that with little knowledge on the subject of usability and after only 3 days of testing, you can typically at least double your conversion rate or other key business metrics.

On the other hand, it also says:

“Many people without a grounding in behavioural user-research principles use bogus methodology and thus get misleading findings. Poor methodology is especially common for eye-tracking studies, and thus most published studies in this area are wrong”.

So, what’s it going to be?

Does this mean today’s sites are all magnificent, offering an optimal user experience and with incredible conversion rates? A quick reality check is all we need to know that’s far from the truth…

My team recently worked on a project for a pure Internet player. Their senior staff, which came from various web disciplines, including usability, changed some elements on a landing page and saw their conversion rates fall with more than 30% in less than a week.

So let’s keep our feet on the ground… Not only are their more and more digital screens, user behaviour – present company included – also changes at a staggering pace.

We need ever more sophisticated techniques to build result-driven interfaces.

There is something to be said for this analogy made by Mr Nielsen, even though I do find it cool. Here’s what he says:

“Usability is like cooking: everybody needs the results, anybody can do it reasonably well with a bit of training, and yet it takes a master to produce a gourmet outcome.”

I think a chef has more than just some basic knowledge about cooking. I also believe one needs more than just a set of guidelines to obtain the same result as a chef.

A chef is no less than a professional of taste who knows all there is to know about a product. It is this in-depth knowledge that enables him to time after time create incredible dishes without needing a recipe.

Usability will always be the type of cuisine anyone can use if he applies regularly updates rules. But it will never be the solution to constantly create efficient screens.

Neuromarketing can be compared to the cuisine based on the fundamentals of taste (what customers want and expect, an in-depth knowledge of products,…). It combines all these fundamentals to obtain a high-quality result, whatever the dish to be made.

Have a nice week

Jean-Claude Grosjean (an expert in AGIL methods, which I strongly suggest you read) has recently published the article “Web ergonomics: 8 tips to sell better on the Internet”.

This article talks among others about guiding the eyes by exploiting the Gutenberg diagram (tendency to read from the left to the right, and from the top to the bottom).

I wanted to share some screen composition elements with you: they will indicate the ideal placement of an action button.

To do so, I propose to work with two real examples, which are screens used in Jean-Claude’s article (dailyburn.com & goodbarry.com).

Before working on the best solution for these two screens, it is worthwhile to analyse the two screens using the ErgoSuite filter, a series of tools that predict human behaviour, created by Netway).

Remember that when we first look at a screen, our eyes automatically look at certain zones of the screen. The first zone is the so-called Netway Interface Sweet Spot Zone, the zone in which 90% of the first ocular fixations take place.

This zone is the basis used by our brain to analyse and interpret the composing elements of the interface. To do so, it will use the so-called peripheral vision.

dailyburn.com

• the button stands out very clearly
• it is easy to see it and identify it
• the button is also rather close to the foveal zone (the zone where we have 100% vision)
• we can’t read the text but we can clearly distinguish there are three words in the button.

When analysing the screen using shades of grey (as if we only use the rods of our eyes), we reach the same conclusions.

goodbarry.com

• the button gets lost in the blue at the bottom of the page
• it is not clearly identifiable
• we can’t distinguish the number of words in the button.

The problem is even clearer when we look at the interfaces in shades of grey.

The signal the button will send to our brain is much weaker than the one sent by the dailyburn.com site.

One of the variables defining the right position of a button is its capacity to distinguish itself from the other graphical elements of the screen in peripheral vision mode.

Let’s continue our analysis. Another important factor is whether the button can easily and quickly be clicked.

dailyburn.com

• wherever the cursor, the button is accessible using normal effort (yellow circle).
• even better: the button is easily accessible from all important visual elements (green circles)

goodbarry.com

• if the cursor is in the top main navigation, the action button is accessible using a major effort (orange circle)
• it is accessible using normal effort starting from the main components of the screen (yellow circle).

A second variable determining the position of a button is the ease with which it can be reached from the main screen zones.

To continue our analysis, I propose to analyse the geometrical structure underlying the visual behaviour on a screen.

We have already talked about the determining role on the screen played by the Netway Interface Sweet Spot and the Netway Interface Comfort Zone.

A geometrical analysis of the two sites reveals that 90% of the first ocular fixation will take place in the Netway Interface Sweet Spot, whereas the second fixation will happen in one of the two illustrated zones.

In the case of dailyburn.com, the button has the correct vertical position. However, it could be placed more at the right. Moving the button by a few pixels will align its centre with the second natural zone of ocular fixation.

In the case of goodbarry.com, the button is not only hard to see using our peripheral vision, we also see it is placed too high and too much to the right.

Let’s get back to dailyburn.com. How can we improve the position of the button?

Here’s the result. I leave the conclusion to you

In this case, the button is perfectly placed to fulfil its role in the peripheral vision field.

If the brain of the user decides to take action, he will have identified the button in just a few milliseconds after opening the site. He will easily guide the eyes to the button.

Since it is easy to click the button, the brain will place the cursor close to the button and when the user has to click, it will be easy to do so.

All this of course in a non-conscious way…

Gestalt theories are a tool behavioural experts can use to predict how a user’s visual system will respond in front of a screen.

Today, let’s discover the fifth of a total of seven principles and talk about the law of symmetry.

A set of shapes will be better perceived when the individual elements are symmetrical.

Thanks to this principle, shapes can be grouped around an axis (vertical and/or horizontal). The axis in itself can also be a shape. This allows the brain to better guide the foveal fixations on the screen.

The geometry of a screen starts with the fixation of the priority vertical and horizontal axes. The intersections will allow for the placement of the priority graphical elements.

The principles of symmetry, closure, good continuation, proximity and similarity enable the natural focus on the appropriate graphical elements of the screen.

Sometimes, when secondary graphical elements compete with the priority elements, the expert will adapt the Gestalt principles in order to diminish the emphasis on these secondary elements.

I’ve used these techniques when I was working on the Ethias site. I have emphasized the attention onto the priority graphical elements (the green and orange zones), thanks to the combined application of the Gestalt principles, whilst diminishing the attention to the non-priority zones.

In the case of Ethias, the green objects are symmetrical to the central element. When you take a closer look, you will see that the central green object is located in the so-called Netway Interface Sweet Spot™.

In the AXA screen, this principle is present but the objects are placed too closely together. As a result the brain will not be able to identify a set of different graphical elements but will perceive just one shape.

That’s why it is important to take into account the effects of the peripheral vision when creating screens. Without doing so, the Gestalt principles will lose their effectiveness.

Have an excellent week!

A couple of months ago insurance company AXA was building its new website.

During the transition period, a screen was shown, explaining the different changes planned to be integrated in the new site.

One of the five key points was: “Innovating ergonomics and a simplified navigation”.

Since I am passionate about my work, I couldn’t wait for the new site to go online and discover these ‘innovating ergonomics’.

So, on February 17, when the new site was live, I visited it in detail.

Having worked previously for the insurance sector, I simply tried to realise 5 priority scenarios, as they had been defined for other missions: “A manager wants to contract an insurance against loss by fire for his new property. He wants to consult the tariffs online and decides to visit three different websites.”

The homepage profusely worked on the ‘wow effect’ so it took me some time to understand the content and to simply find what I was looking for.

Coming onto another page, I used the navigation menu on the left to go the products ‘Living, family and hobbies’. There, I stumbled upon a navigation menu that was really difficult to use.

All the choices that have been made go against the basic scientific principles used in behavioural sciences:

1. The menu is composed of 38 items, presented in 14 different labels. It therefore requires a great cognitive and perceptive effort.
2. The formats used for the title products (Habitation, Famille, Loisirs) are the same as those used for the “Dossiers / Guides” and the “Devis / Simulations”. This gives the brain the impression these elements are comparable, which in reality is not the case.
3. The words used to denominate the different topics are interchangeable which makes it hard to choose the right link.
4. The matrix structure creates vertical and horizontal reading behaviour which prevents focused reading and leads to a chaotic ocular behaviour.

User behaviour is one of the essential weapons to differentiate oneself from the competition. However, more and more, companies and / or agencies use the terms used by our profession in an attempt to legitimise work that is far from the quality work one may expect from an expert in behavioural sciences.

The future has always belonged to those who passionately and fastidiously assimilated and/or developed state-of-the-art technology, which goes far beyond mere words. This allows companies to recognize their talents as experts.

Gestalt theories are a tool behavioural experts can use to predict how a user’s visual system will respond in front of a screen.

Today, let’s discover the fourth of a total of seven principles and talk about the law of closure.

A closed form will more easily be identified as a shape (or a form), in comparison with an open form.

The law of closure allows the brain to dispose of a visual frame (like the frame of a painting) that will allow the user to concentrate on the content at the centre of the frame.

This Gestalt law is closely linked to the first two laws that enable the construction of a strong ‘Netway Neuro-Visual Landscape’.

On the Ethias site, the green objects constitute a frame to the content and allow us to focus on the content in between the two green zones.

In general, an expert can use the law of closure freely: the superior block is in most cases located outside the comfort zone of the screen.

In order to activate the closure effect, our brains needs to rapidly perceive the contours of the frame. That means we need to work on the zones using the Gestalt laws and strengthen the visualization of the frame.

In the case of AXA, the law of closure has not been applied. This leads to an ocular behaviour that doesn’t lead the eye to the centre of the interface.

Have a good week!