Shopify usability: 10 laws that decide your success in e-commerce

Anyone who has to search, guess or wait in an online store is more likely to leave it. Usability describes how easy an online store is to use: how quickly visitors find what they are looking for, and how effortlessly they get to the order.

There is a set of laws for usability in e-commerce. Some come from Gestalt psychology, others from research on human-computer interaction. They are based on research and experience and give you a foundation for making stores, websites and apps easier to use. They apply to Shopify usability just as they do to any other online store: Shopify provides the technical framework. Whether the store is easy to use is decided by theme, structure and content.

In many cases, visitors leave a website that is hard to use and buy elsewhere. An app that is too complicated is used reluctantly or deleted again. The ten laws in this article are a toolkit you can use to check whether your store works for your customers. For each law you will find an example from an online store and a review question for your own pages.

Usability in e-commerce: the 10 laws at a glance

1. Hick's law: less choice is faster
2. Fitts's law: large, nearby targets are easier to hit
3. Law of Prägnanz: the simpler, the clearer
4. Jakob's law: meet user expectations
5. Miller's law: only what really matters
6. Law of proximity: what is close together belongs together
7. Law of similarity: orientation through similarity
8. Law of continuity: the eye follows the line
9. Law of past experience: we recognize what we know
10. Doherty threshold: response time under 400 milliseconds

1. Hick's law: less choice is faster

Hick's law, also called the Hick-Hyman law, goes back to the psychologists William Edmund Hick and Ray Hyman. Hick published his experiments in 1952. The law states: the time it takes to make a decision increases with the number of options, and it does so logarithmically. Twice as many options do not mean twice as much time, but every additional option slows the decision down. If an interface offers too many options at once, the result is confusion and frustration. That is why it often makes sense to limit the number of options so that users act faster and with more confidence.

In an online store this shows above all in the navigation and on category pages. A main menu with a great many items of equal rank, or a category with several hundred products and no filters, demands many decisions at once. It is better to offer the choice in stages: a few main categories, subcategories below them, plus filters by size, color or price. In Shopify you set up such filters with the free Search & Discovery app. They become visible if your theme supports filters. On the product page, a highlighted recommendation helps, for example the matching set or the most common variant.

Review question: How many decisions does a visitor have to make before they see the first suitable product?

2. Fitts's law: large, nearby targets are easier to hit

The psychologist Paul Fitts showed in 1954 that the time someone needs to reach a target depends on the distance to the target and its size. The closer the target, the faster it is reached. The larger it is, the easier it is to hit. Fast movements toward small targets, on the other hand, lead to errors more often.

On a smartphone this is felt every day. The most important buttons should be large enough to hit reliably with the thumb, have enough distance from other elements and sit where the thumb already is. In a store this mainly concerns the “Add to cart” button, the variant selector, the cart icon and the buttons in the checkout. Small size boxes placed tightly next to each other are a typical case: anyone who taps slightly off picks the wrong size.

Review question: Can the most important button on every page be hit reliably with one hand on a phone?

3. Law of Prägnanz: the simpler, the clearer

People tend to organize complex visual impressions so that a simple, symmetrical and well-structured form emerges. Gestalt psychology also calls this the law of good Gestalt: we prefer to perceive forms that are memorable and simply built. That is why users prefer clear, ordered information over cluttered pages. A website or app with a clear structure, balanced spacing, consistent colors and ordered elements is more appealing.

The law of Prägnanz helps avoid visual chaos so that visitors take in information quickly and effortlessly. An example from a store: a product page on which reviews, seals, discount notices, delivery time and several banners compete for attention at the same time feels restless, even if every element makes sense on its own. A few clearly structured blocks with consistent spacing are grasped faster.

Review question: Does a new visitor recognize within a few seconds on your product page what the product is, what it costs and how to buy it?

4. Jakob's law: meet user expectations

Jakob's law is named after Jakob Nielsen, co-founder of the Nielsen Norman Group. His observation: users spend most of their time on other websites. So they expect your website to work like the ones they already know. People transfer their experience with similar products to new systems.

Anyone who builds on established patterns makes things easier for users. If a store uses navigation patterns that customers know from other stores, they find their way immediately and do not have to learn anything new. That lowers the learning curve, and visitors feel confident sooner. In e-commerce this means, for example: logo top left as a link to the home page, search and cart top right, filters on the category page in a sidebar or, on a phone, in an expandable panel. Idiosyncratic solutions in these places cost orientation, even if they look good.

It also follows that major changes should be introduced carefully. After a relaunch, returning customers must be able to find the most important paths again.

Review question: Would a customer who has never visited you before find search, cart and customer account without thinking?

5. Miller's law: only what really matters

In 1956 the psychologist George Miller described that people can hold on average about seven units in working memory at the same time, plus or minus two. Hence the name “magical number 7 ± 2”. When we are confronted with more information, options or elements, we feel overwhelmed sooner.

For design this means: do not overload the interface, so that the cognitive load stays low. This applies especially to menu items. Information should be easy to take in and process. It helps to organize content into groups: a long list of product features becomes clearer when it is split into sections such as material, dimensions and care.

An important note: the number seven is not a fixed upper limit for menu items. How much someone can grasp at once depends on prior knowledge and the situation. Use the rule as a reminder to bundle information, not as a calculation rule.

Review question: How many items does your main menu have, and could some of them sensibly be combined?

6. Law of proximity: what is close together belongs together

According to this Gestalt law, elements with little distance between them are perceived as belonging together. Designers use this to place information that belongs together close to each other. If you see two buttons right next to each other on a website, you automatically assume that they belong together or have a similar function. That makes pages easier to understand and makes them look more orderly.

In a store, spacing is often more important than any line or box. If the price sits closer to the neighboring product than to its own product image, visitors assign it to the wrong product. On the product page, price, unit price (Grundpreis), shipping note and button belong together, and the spacing should show that too. In forms, the label belongs close to its own field, not in the middle between two fields.

Review question: Is it clear at first glance on your product cards which price belongs to which product?

7. Law of similarity: orientation through similarity

If different elements of an interface share similar colors, shapes, sizes or other visual properties, we assume that they belong together.

Designers use this principle to group information or to separate it. In a product list, for example, products of the same category can carry similar colors or icons so that they are recognizable as a group. This makes information easier to classify and patterns faster to recognize.

The flip side: similarity promises sameness. If all links and buttons look the same, whether they add something to the cart or only open more information, visitors lose their bearings. Give each function a fixed appearance and keep it throughout the store. The buy button should look the same everywhere and differ from all the others.

Review question: Do all elements that do the same thing look the same on all pages?

8. Law of continuity: the eye follows the line

People perceive lines and patterns as continuous, even when they are interrupted by other elements. In Gestalt psychology this is also called the law of good continuation: lines are seen as if they followed the simplest path. Our brain processes visual information fluidly and logically, even when small interruptions are present.

In interface design this helps to guide visitors through a page. Lines, shapes or a clear axis direct the eye, and images or text fields can interrupt them without the connection getting lost. One example is a product slider whose last image is cut off at the edge: visitors understand that there is more and swipe. A progress bar in the checkout or a numbered sequence of steps also uses the law of continuity.

Review question: On your home page, does the eye follow a clear line to the next meaningful step?

9. Law of past experience: we recognize what we know

In German-language design theory, the law of past experience is often counted among the Gestalt laws. It describes how we interpret the unknown and the incomplete with the help of what we already know. We can still read a word with missing letters and still recognize a heavily simplified icon. For design this means: products and interfaces should build on the abilities, experience and expectations of their users. Anyone who draws on familiar forms shortens the time visitors need to understand.

Imagine opening an app that has the same layout and the same navigation as other apps you know. You intuitively know where to find certain functions because the design matches your previous experience. This makes the law of past experience closely related to Jakob's law: Jakob's law concerns whole flows, the law of past experience already concerns the perception of individual signs and shapes.

Examples of the law of past experience in an online store

• A shopping cart or a bag at the top right stands for the cart, a small number on it for the number of items.
• A magnifying glass stands for search, a heart for the wishlist, three horizontal lines for the menu on a phone.
• Underlined or color-highlighted text is read as a link.
• Stars below a product are understood as a rating, even without explanation.
• Many read a padlock icon in the checkout as a sign of a secure connection.

Anyone who uses one of these signs differently, for example a heart for the cart, forces visitors to rethink. That costs time and trust.

Review question: Would a visitor interpret every icon in your store correctly even without a label? If not, label it.

10. The Doherty threshold: response time and fast loading

A fast-loading website is not only important for visibility on Google. Visitors are impatient. The Doherty threshold sets 400 milliseconds as the time frame in which users expect feedback, for example after clicking a button. If the response time exceeds this limit, interest is at risk of being lost.

Usability and response time: the 400 millisecond limit

The value goes back to Walter J. Doherty and Ahrvind J. Thadani. In 1982 they published research findings in the IBM Systems Journal according to which computers should respond within 400 milliseconds instead of the two seconds that had been customary until then. When the response time was below that, users worked more productively because neither person nor machine had to wait for the other.

For usability in an online store this means: every action needs a visible reaction within this time. This applies to the click on “Add to cart”, to setting a filter and to selecting a variant. If nothing happens after a tap, visitors tap again or assume the store is broken.

When it takes longer: make waiting time visible

If actions on your website still take longer, visitors should see that their input is being processed in the background. This can be done, for example, with a loading bar, a short animation or a button that changes its state. Progress bars make waiting more bearable, regardless of how precisely they show the progress.

A fast loading time improves the user experience and increases the chance that visitors stay. Google rates the user experience of a page, among other things, with the Core Web Vitals. They measure loading time (Largest Contentful Paint), responsiveness (Interaction to Next Paint, INP for short) and visual stability (Cumulative Layout Shift). According to Google, good values are among the things its ranking systems aim to reward, as one aspect among many and with no guarantee of specific positions. For responsiveness, Google names an INP under 200 milliseconds as the target value.

The combination of a fast page and visible feedback holds attention, even when individual actions take a little longer.

Review question: Does every button in your store react immediately and visibly on a phone, even on a weak connection?

Shopify usability in practice: where the laws work in an online store

The ten laws rarely work in isolation. On a product page almost all of them apply at the same time. This mapping helps when you go through your store page by page:

• Navigation and home page: Hick's law and Miller's law. A few clearly named main items instead of a menu that shows everything at once.
• Category pages: Hick's law, law of proximity and law of similarity. Filters, consistent product cards and clearly assigned prices.
• Product page: Fitts's law, law of Prägnanz and law of proximity. A large, easy-to-reach buy button, price and delivery information right next to it, no competing elements.
• Cart and checkout: Jakob's law, law of continuity and Doherty threshold. Familiar flows, recognizable steps, immediate feedback.
• On a phone: all ten, but above all Fitts and Doherty. Here the screens are smaller and the connection is often slower.

Usability is not everything, though. A store can be easy to use and still sell little if visitors do not trust the offer or an important question remains open. How we review usability, trust and the buying decision together is described by our 545 method.

Conclusion: user-friendliness in e-commerce is no accident

All ten laws have the same goal: a store should be so easy to use that visitors think about the product, not about how to operate the store. Then a website, an app or a store becomes clear and understandable, and visitors are glad to have found it instead of leaving frustrated. Anyone who takes the usability laws into account makes sure that a store meets the needs of its users.

Take the review questions from this article and go through your store page by page, and do it on a phone. Every question you answer with no is a concrete starting point.