When we are designing products, we often give priority to various scenarios under ideal conditions, and the ideal user flow is free of any problems and obstacles. But real life is often not like this, and people's embarrassing situations will happen from time to time. The unplanned problems are what we call "edge cases", or "extreme cases".
Edge cases are rare, but they have a significant impact on the user experience. Positive and smooth interactions are rarely remembered by users, but the occasional extreme situation will leave a deep impression on the mind. If there is no reasonable solution for extreme situations, the entire product experience may be compromised.
In today's article, I will share some relatively common corner cases, how to avoid them through reasonable planning in the design. There are generally two basic approaches to solving corner cases:
Prevent edge cases
Provide support for handling edge cases
Giving choices is the best way to prevent extreme situations. In some cases, this can be prevented by reducing overall system complexity (eg limiting the number of operations a user can perform when interacting with the system). The reduction in complexity can make extreme cases less likely. However, some edge cases cannot be completely avoided, so you need to design and support them to mitigate the impact of these edge cases.
1. Struggle with Lazy Loading
With the development of technology, users are becoming more and more impatient, and unwilling to wait is the most direct manifestation. According to Google's latest research, two-thirds of mobile users say page loading speed has the biggest impact on their mobile experience. To meet user expectations, you should make your website/app load as quickly as possible. However, in actual usage scenarios, there are always various situations that prevent the loading from advancing smoothly. There are many reasons for delayed loading, it may be a poor network connection, or other. But in any case, you should create a feeling of "it's working hard and loading is okay". Be aware that the apparent loading speed is more important than the actual loading speed.
Loading the skeleton of the entire layout first as the page loads gives a sense of speed, a subjective feeling that it appears to be loading much faster than it actually is. This technique is called skeleton layout.
LinkedIn is all about giving the impression of fast loading through the skeleton layout.
2. Design the empty state
Many websites and APP pages are filled with various data and content during design, but in actual situations, they may have no data available, which is what we often call an empty state. For example, in a fitness application, before the user completes the first exercise, there is no data to fill in the user challenge page, which may be blank. As a designer, this situation needs to be avoided as much as possible, and it is definitely not acceptable to leave a blank page there. Instead, designers can provide instructions such as how to populate the page, or introductory content, rather than leaving a confusing page. The Khaylo Workout app for iOS is a good example of an empty state page design.
An empty status page can be used to provide the user with instructions for proper usage.
3. Resolve user and system errors
Every interaction between every user and system can be a source of error. Errors can easily occur when the user is required to enter data. We mentioned that in order to prevent errors in this link, the best way is to provide rules for user input. But when it comes to user input, we should address the following potential problems:
The data entered by the user is invalid. For example, the user entered the wrong credit card number during checkout. In this case, the application should provide detailed and accurate error information to help users locate the source of the problem.
Due to technical problems, the system cannot continue to operate. In this case, the error message should clearly state b2b data that the system, not the user, caused the error, which can prevent the user from continuing to submit data.
In both cases, you should make sure that the app or web page handles errors gracefully. Error messages should be clear, written in a user-friendly language (avoid high-level jargon), and the system should provide a precise solution (this could be a series of instructions, or something else available).
4. The available result is zero
Most websites and apps provide a search function. The most common usability problem in the search function is that the user finds zero results, and then gets a blank page with the prompt message "0 results found". Such results are undoubtedly frustrating to users, especially if they searched for it several times.
If you have control over your search functionality, consider doing it the following way: