The Doherty Threshold: How to Optimize Performance and Responsiveness in Web Design
The Doherty Threshold is a principle that optimizes performance and responsiveness in web design.
Web design and web development are two crucial aspects of creating a successful online presence. However, they are not enough if the user experience (UX) and user interface (UI) are not taken into account. UX and UI are the disciplines that focus on how users interact with a website or an app, and how they perceive its functionality, usability, and aesthetics. UX and UI can make or break a website or an app, as they can influence user satisfaction, engagement, retention, and conversion.
One of the key principles that UX and UI designers should follow is the Doherty Threshold. This principle states that a system should respond to user input within 400 milliseconds in order to keep users’ attention and increase productivity. If the system takes longer than 400 milliseconds to respond, users may lose interest, become frustrated, or abandon the task altogether. On the other hand, if the system responds faster than 400 milliseconds, users may feel more immersed, motivated, and satisfied with the interaction.
The Doherty Threshold was first proposed by Walter J. Doherty, a researcher at IBM, in 1982. He observed that when users performed tasks on a computer system that responded within 400 milliseconds, they entered a state of flow, where they became fully absorbed and focused on the task. He also found that users’ productivity increased by up to 45% when the system met this threshold. He concluded that “productivity soars when a computer and its users interact at a pace (<400 ms) that ensures that neither has to wait on the other” 1.
In this article, we will explore how to apply the Doherty Threshold in UX and UI design, and look at three real examples of web design that follow this principle.
How to apply the Doherty Threshold in UX design
UX design is the process of designing a system that meets the needs, expectations, and preferences of the users. It involves researching the users’ goals, behaviors, emotions, and pain points, and creating solutions that provide value, ease of use, and enjoyment. UX design covers aspects such as information architecture, navigation, content, functionality, feedback, and accessibility.
To apply the Doherty Threshold in UX design, designers should aim to optimize the system’s performance and responsiveness for the users. This means minimizing loading times, reducing latency, and employing caching techniques. Designers should also regularly assess and fine-tune the system’s responsiveness to ensure it consistently meets the Doherty Threshold.
To apply the Doherty Threshold in UI design, designers should aim to create interfaces that are intuitive, user-friendly, and appealing for the users. This means following the principles of design, such as contrast, alignment, repetition, proximity, hierarchy, balance, and harmony. Designers should also adhere to the standards and guidelines of the platform, device, or industry they are designing for.
However, sometimes it may not be possible to achieve a response time of less than 400 milliseconds due to technical limitations or complex tasks. In such cases, designers should use perceived performance techniques to improve the response time and reduce the perception of waiting. Perceived performance is the way users perceive how fast or slow a system is, which may not always match the actual performance. Designers can manipulate perceived performance by using various methods such as:
- Providing feedback: Feedback is any indication that the system has received or processed the user’s input. Feedback can be visual (such as progress bars, spinners, or animations), auditory (such as sounds or voice), or haptic (such as vibrations). Feedback helps users understand what is happening behind the scenes and reduces uncertainty and frustration.
- Creating anticipation: Anticipation is the expectation of something positive or rewarding that will happen in the future. Anticipation can be created by using elements such as countdowns, teasers, previews, or gamification. Anticipation helps users stay engaged and motivated while waiting for the outcome.
- Reducing cognitive load: Cognitive load is the amount of mental effort required to process information or perform a task. Cognitive load can be reduced by simplifying the interface, breaking down complex tasks into smaller steps, providing clear instructions and guidance, or eliminating distractions. Cognitive load reduction helps users focus on the task and avoid mental fatigue.
3 real examples of web design that follow the Doherty Threshold
To illustrate how the Doherty Threshold can be applied in web design, let’s look at three real examples of websites that follow this principle.
Example 1: Google
Google is one of the most popular and widely used search engines in the world. It allows users to find information on various topics, such as web pages, images, videos, news, maps, and more. Google’s web design follows the Doherty Threshold by providing fast and relevant results for user queries.
Google’s web design optimizes the system’s performance and responsiveness by using techniques such as:
- Indexing and ranking: Google uses sophisticated algorithms to index and rank billions of web pages based on their relevance, quality, and authority. This allows Google to retrieve and display the most relevant results for user queries in a fraction of a second.
- Autocomplete and suggestions: Google uses autocomplete and suggestions to predict what users are typing and offer them possible queries that match their intent. This allows users to save time and effort by selecting a query from the list instead of typing it completely.
- Instant results: Google uses instant results to show users a preview of the results page as they type their query. This allows users to see if their query is returning the desired results and modify it accordingly without having to wait for the page to load.
Google’s web design also uses perceived performance techniques to improve the response time and reduce the perception of waiting by using elements such as:
- Feedback: Google uses feedback to indicate that the system is processing the user’s input and returning results. For example, Google shows a spinner icon next to the search box when the user types a query, and a loading icon next to the results page when it is loading.
- Anticipation: Google uses anticipation to create a sense of curiosity and excitement for the user. For example, Google shows a doodle on its homepage that changes every day and celebrates various events, people, or topics. The doodle invites users to click on it and learn more about it.
- Cognitive load reduction: Google uses cognitive load reduction to simplify the interface and make it easy for users to find what they are looking for. For example, Google uses a minimalistic design that only shows a logo, a search box, and two buttons on its homepage. Google also uses tabs to categorize the results by type, such as web, images, videos, etc.
Example 2: Netflix
Netflix is one of the most popular and widely used streaming services in the world. It allows users to watch movies, TV shows, documentaries, and more on various devices, such as TVs, computers, smartphones, tablets, etc. Netflix’s web design follows the Doherty Threshold by providing personalized and engaging content for users.
Netflix’s web design optimizes the system’s performance and responsiveness by using techniques such as:
- Content delivery network (CDN): Netflix uses a CDN to distribute its content across multiple servers around the world. This allows Netflix to deliver its content faster and more reliably to users based on their location and bandwidth.
- Adaptive streaming: Netflix uses adaptive streaming to adjust the quality of its content based on the user’s device and network conditions. This allows Netflix to provide a smooth and uninterrupted viewing experience for users without buffering or lagging.
- Recommendation system: Netflix uses a recommendation system to suggest content that matches the user’s preferences, behavior, and mood. This allows Netflix to provide personalized and relevant content for users based on their viewing history, ratings, genres, etc.
Netflix’s web design also uses perceived performance techniques to improve the response time and reduce the perception of waiting by using elements such as:
- Feedback: Netflix uses feedback to indicate that the system is processing the user’s input and returning content. For example, Netflix shows a spinner icon when the user selects a title to watch, and a loading icon when the content is buffering. Netflix also shows a progress bar and a timer when the user pauses, plays, or skips the content.
- Anticipation: Netflix uses anticipation to create a sense of excitement and curiosity for the user. For example, Netflix shows a trailer or a preview of the content when the user hovers over a title. Netflix also shows a countdown and a teaser for the next episode when the user finishes watching an episode of a series.
- Cognitive load reduction: Netflix uses cognitive load reduction to simplify the interface and make it easy for users to find and enjoy the content. For example, Netflix uses a grid layout that shows large and colorful thumbnails of the titles. Netflix also uses categories and subcategories to organize the content by genre, mood, popularity, etc.
Example 3: Spotify
Spotify is one of the most popular and widely used music streaming services in the world. It allows users to listen to millions of songs, podcasts, playlists, and more on various devices, such as computers, smartphones, tablets, speakers, etc. Spotify’s web design follows the Doherty Threshold by providing personalized and engaging content for users.
Spotify’s web design optimizes the system’s performance and responsiveness by using techniques such as:
- Content delivery network (CDN): Spotify uses a CDN to distribute its content across multiple servers around the world. This allows Spotify to deliver its content faster and more reliably to users based on their location and bandwidth.
- Offline mode: Spotify uses offline mode to allow users to download and listen to their favorite content without an internet connection. This allows Spotify to provide a seamless and uninterrupted listening experience for users without worrying about network issues or data usage.
- Recommendation system: Spotify uses a recommendation system to suggest content that matches the user’s preferences, behavior, and mood. This allows Spotify to provide personalized and relevant content for users based on their listening history, ratings, genres, etc.
Spotify’s web design also uses perceived performance techniques to improve the response time and reduce the perception of waiting by using elements such as:
- Feedback: Spotify uses feedback to indicate that the system is processing the user’s input and returning content. For example, Spotify shows a spinner icon when the user searches for a song, artist, album, or playlist. Spotify also shows a loading icon when the content is buffering or downloading.
- Anticipation: Spotify uses anticipation to create a sense of discovery and enjoyment for the user. For example, Spotify shows a cover art or an animation of the content when the user plays it. Spotify also shows a shuffle play button that randomly plays songs from a playlist or an artist.
- Cognitive load reduction: Spotify uses cognitive load reduction to simplify the interface and make it easy for users to find and enjoy the content. For example, Spotify uses a dark theme that reduces eye strain and enhances contrast. Spotify also uses icons, tabs, and menus to navigate through the app.
Conclusions
The Doherty Threshold is a principle that states that a system should respond to user input within 400 milliseconds in order to keep users’ attention and increase productivity. The Doherty Threshold can be applied in UX and UI design by optimizing the system’s performance and responsiveness, as well as using perceived performance techniques to improve the response time and reduce the perception of waiting.
In this article, we have seen how three real examples of web design follow the Doherty Threshold: Google, Netflix, and Spotify. These websites provide fast and relevant results, personalized and engaging content, and intuitive and user-friendly interfaces for their users.
By following the Doherty Threshold in web design, designers can create websites that are more satisfying, immersive, and productive for their users.
Bibliography
[1] W. J. Doherty and A. K. Thadani, “The economic value of rapid response time,” in Proceedings of 1982 conference on Human factors in computing systems - CHI '82 , Gaithersburg, Maryland, USA, 1982, pp. 139–146, doi: 10.1145/800049.801811.
[2] J. Nielsen, “Response Times: The 3 Important Limits,” Nielsen Norman Group, Jan. 01, 1993. [Online]. Available here.
[3] S. Alshamari and M. Mayhew, “Perceived Performance: How Long Should Users Wait for Your Website to Load?,” in Proceedings of the 2018 International Conference on Advanced Visual Interfaces - AVI '18 , Castiglione della Pescaia, Grosseto, Italy, 2018, pp. 1–9, doi: 10.1145/3206505.3206520.
[4] M. Csikszentmihalyi, Flow: The Psychology of Optimal Experience, 1st ed. New York: Harper Perennial Modern Classics, 2008.