Users are coping with information overload while businesses try to deal with the impending attention crisis, fighting for engagement and conversions. What once was the popup has since become the modal and recent research has shown that users dismiss modals in the same way that they dismissed popups, rendering them nearly ineffective. However, with the proper approach, the modal can be implemented in an effective way for certain use cases.
Every second, on average, around 6,000 tweets are published on Twitter. This corresponds to over 350,000 tweets per minute, 500 million tweets per day, and around 200 billion tweets per year. Around 300 hours of new videos are uploaded to YouTube every minute and over 6 billion hours of YouTube videos are watched every month. Every day, over 40 million new photos are uploaded to Instagram, 350 million uploaded to Facebook, and 400 million sent via Snapchat. More than 30 billion messages are exchanged in WhatsApp every day.
We are experiencing an attention crisis. For the first time in history, there is simply more content available to humans than they could ever conceivably attempt to consume. As a result of this, designers are having to change the ways in which they approach problems like time and usage. Some of the solutions that we’ve seen in recent years have been groundbreakingly innovative, thoughtful, and creative. Others, however, haven’t quite lived up to that standard. And some of those lower quality solutions have become commonplace in modern design.
One of the most prevalent negative design patterns today is the modal. But it was preceded by another design pattern that, while not directly related from a technological perspective, is very closely related from a design and business perspective. That predecessor is, of course, the dreaded popup. And while the popup was a very successful design pattern for many years, it eventually met it’s end when popup blockers started being directly integrated into browsers. This rendered the popup almost completely ineffective. But the need for a disruptive element was still there.
Enter the modal. It does the same thing as the popup, but it appears inside the existing browser window, rather than creating it’s own external “pop up” window. While a nice technological solution was eventually devised to kill the popup, we haven’t yet created an effective technological solution to kill the modal. So, for the time being, web users are having to live with it.
But are users really just accepting that they have to live with modals? Some recent research that I conducted began to indicate that they aren’t. While a technological solution for blocking modals doesn’t exist, I have been able to observe behavioral solutions in users. While conducting my research, I saw user after user encounter a modal and, without thinking, immediately move the mouse to the upper right hand corner and close it. No matter how good the content was, it went ignored. Users just don’t like to be disrupted during their browsing sessions, regardless of whether it’s a popup or a modal doing the interrupting. As a result of these findings, one would begin to assume that modals may be nearly as ineffective as popups. And I would agree with that sentiment in most instances. Engagement and conversion rates on modals are, relatively speaking, horrendous. However, when executed properly, I have seen modals work. So I’m going to talk about that a little.
While modals are in most instances unnecessary (a better solution could be devised) and ineffective (very few users pay attention to them), they can be pretty powerful when they’re created and implemented appropriately. I’ve devised a set of “best practices” for using modals and I’m going to share them with you today. Before I go into that however, I want to point out that, as with any list of best practices, these are simply guidelines and they very well may not apply to your scenario or resonate with your audience. Ensure that you exercise your due diligence and test these recommendations within the context of your unique audience, product, and business. With that said, these should be able to help you gain a general grasp for what goes into making an effective modal.
By implementing these general practices, you should have a pretty good shot at creating an effective modal that serves the needs of both the user and the business. But just in case you’re still not completely sure about whether or not you should use a modal, I’ve put together a handy dandy flow chart for you. Have a look and decide from there.