Ikea Load More Pagination

✋ What is it?

This is a UI control found on the official Ikea Website. Ikea's website search allows users to load more results on the page with a UI control that behaves like a traditional "load more" button but with additional context and affordances that disclose how many product results are left to load for that particular search query.

🤲 How does this interaction or solution work?

When users perform a search on Ikea's website, they get a result back with hundreds of matching results.

Naturally, Ikea doesn't show all the available results at first load. Instead, Ikea loads a paginated result that can be expanded with a "load more" button that allows the users to keep all the found products available in the body of the page as they keep loading results.

Unlike other "load more" UI controls that don't reveal the size of the output and have more abstract pagination mechanisms, Ikea's version of this control, fully reveals the size of the output, and shows a completion or progress bar. This bar is an affordance that allows the users to understand the size of the results (that can be loosely determined by the amount of scrolling performed to reach the bottom of the page).

🙌 How does this interaction or solution work?

Predictability

The world of web design is divided into the correct usage of pagination controls with advocates and critics of approaches like infinite scroll.

The traditional pagination control popularized by Google (the paginator at the bottom of the Google results) has cemented itself as the standard, friendly UX for search results since it doesn't remove the ability of the user to navigate at will and it gives some level of predictability.

Infinite scroll has been majorly favored by social media apps and some e-commerce apps since it allows them to increase engagement and scales well with their vast amount of content.

In this particular case, Ikea opted for a hybrid control that allows them to keep all their results on a single page while giving the user a predictable horizon of when they are going to reach the end of the product results.

This approach is beneficial for the user since it allows them to have a single fully contextualized page of results but with the ability to navigate at will and have an idea of how long is the output of their search.

It's important to mention that this type of control may only work for a website like Ikea, which has a significant amount of product inventory but not so large that it will be hard to represent accurately in a progress bar or similar affordance.