Navigation psychological principles

Thomas Pitou
5 min readSep 20, 2017

Scrolling gesture has become very natural for people today. Studies show that 66% of attention on a normal media page is spent below the fold: users expect incoming content and know where to look at. Knowing that, navigation becomes a main part of your product and your strategy: all your choices matter and affect user experience.

Scrolling and reward

If you’re using social medias like Facebook, Instagram or Twitter you know how it works. Scrolling is a huge part of the experience. It always gives you content, make you feel there is always a ton of things to discover, a ton of articles to read, and posts to like. This navigation is especially effective on mobile device: one scroll with your finger make appear more content on a smartphone than on a desktop screen.

Scrolling is part of the adventure, like diving in an endless ocean. We want you to never stop browsing. Your reading experience never ends and it can be hard to stop scrolling again and again. Why that ? Because it works as a reward: each scroll makes appear new content to discover. Psychology shows that nothing holds our attention more than trying to predict what comes next, due to dopamine effect. Brain is literally attracted to the unknown. You can find the same kind of behavior on dating apps with swipe gesture like Tinder, where you keep browsing waiting for your soul mate to appear.

At the end of an article, Quartz automatically loads related content.

However, even if infinite scroll navigation can significantly increase retention rate, an endless flow of colors, pictures and words can also be really brain energy consuming and in some cases, leads to a total disaster on terms of user experience.

Brain is literally attracted to the unknown.

Scroll less, find faster

Have you ever bought something online? (of course you have). You never browse marketplaces, e-commerce platforms or whatever for no reason or just because you get bored. No one does. People have something in mind: buying stuffs. So first they need to find, and they need to find fast : this is a very deeply different way to navigate.

Shopping online is like being a child in a candy shop. What do we see on first page? A ton of products, a ton of possibilities, for everyone and every need. Browsing an online shop is a promise of finding the right product, no matter what you are looking for. But users come to buy just few products, not the entire shop. Then scroll down again and again can quickly become upsetting. Do you think that people are going to browse ten pages of products before finding the one they need, the perfect one? And you, could you handle that? Clearly not. Moreover you could start suffer from choice paralysis: a high amount of products make the choice harder, sometimes impossible. In 2015, Tesco chose to remove 2000 to 3000 products from the shelves. Doing so, they thought that reducing the number of available items would improve shopping experience. Yes, The Less Is More theory. Customers don’t want to be overwhelmed by thousands of items, but to be guided through the buying journey and expect help from filters and relevant categories. Your navigation choice must not be seen as a way to sell, but as a way to help customers.

A high amount of products make the choice harder, sometimes impossible: this is choice paralysis.

White space principles

As we have seen above, displaying a large amount of content and keeping users attention is not as easy as it seems. But designing with simple usability principles can be very helpful. White space for example, is the use of area between elements as a full design component.

As our concentration decreases while we browse websites, using white space (or negative space) can increase comprehension up to 20%. Why? Because human eye needs clarity and comfort to understand what your you are trying to communicate. Psychologically speaking, human eye needs hierarchy and structure to keep focused.

Let your content breathe and create relief to point out what parts of your design matter the most. Using this simple technique, you are not only giving priority on user comfort, but also on quality instead of quantity : like a painting, your content deserves to be well presented and needs space to be appreciated. By displaying fewer elements you also help your user to dive deeply in the experience you designed, and easily take him wherever you want while his mind keeps focused along the path.

The spaces keep your eye focused on the main content clearly displayed but always keep a door opened to an infinite scroll of other stories on the side menu.
Instead of using infinite scroll, Dribbble lets you appreciate the loaded shots and lets you choose to load an other batch or stop browsing.
Instead of directly loading another article, Medium website displays related articles. It’s up to you to keep reading or not.

Conclusion

Navigation choices say a lot about the experience you offer. You can feed your user as much as he can eat to increase your retention rate, or choose to display only selected pieces to keep him focused, but keep in mind that all the choices you make have a psychological impact on how people experience your product.

Sources:
https://www.psychologytoday.com/blog/automatic-you/201208/infinite-scroll-the-webs-slot-machine
https://thenextweb.com/lifehacks/2015/06/09/the-psychology-behind-web-browsing/#.tnw_GlNj6xjI
http://uxmyths.com/post/654047943/myth-people-dont-scroll
http://www.hugeinc.com/ideas/perspective/everybody-scrolls
https://en.wikipedia.org/wiki/The_Paradox_of_Choice
https://en.wikipedia.org/wiki/Analysis_paralysis
https://sites.psu.edu/siowfa15/2015/09/15/whats-the-science-behind-social-media-addiction/
https://www.theguardian.com/lifeandstyle/2015/oct/21/choice-stressing-us-out-dating-partners-monopolies
https://www.shopify.com/partners/blog/how-to-use-psychology-to-shape-your-ecommerce-success
http://blog.usabilla.com/5-ways-whitespace-can-impact-ux/
https://www.sitepoint.com/the-ux-of-zombie-scrollers-and-how-to-cure-it/
http://adrianroselli.com/2015/05/for-infinite-scroll-bounce-rate-is.html
https://en.wikipedia.org/wiki/Psychological_effects_of_Internet_use#cite_note-17
https://www.fastcodesign.com/3046656/why-white-space-is-crucial-to-ux-design
https://www.interaction-design.org/literature/article/the-power-of-white-space

Credits photos:
Visualhunt

--

--