Web apps each have their own unique functionality, content, and purpose. As designers, we consider the core actions a user can take and how these flows and journeys work. We create cohesive styles for all the different pages and views. We may be able to mock up enough designs to get approval from our clients to begin development, but there are always elements or features that may get overlooked. Let’s explore five potential “blind spots” that we may overlook during the web app design process.
1. Imagined Content vs. Real Content
As designers, our interface mockups usually depict the ideal, best-looking use of the page. For example, on a hypothetical profile interface, we use a short and easily spelled name like “Sam Miller” along with a perfectly crafted 2-3 line bio and a well-cropped hi-res headshot. This may work as a way to impress clients and gain design approval, but it’s important to remember that real use cases of the interface may include impossibly long names, huge chunks of text for the bio, and a terrible profile pic. We should keep these in mind and make sure our designs are flexible enough to handle these cases.
When Facebook came out with their new app Paper earlier this year, they launched a beautiful site showcasing impeccable designs that contained gorgeous content. But as people know from taking one look at their Facebook feed, the Internet buzzed with cracks on how Facebook’s mockups couldn’t be farther from reality.
2. The Onboarding Experience
First impressions are vitally important. The first few moments of a user’s experience on a new web app can make or break their willingness to come back. Do you need to educate the user in any way? Do you need to take the user on a tour of the major features? What’s the first thing they should do? Is there starter or example content that you can display to let the user poke around and see what’s possible? Don’t let the user get frustrated – give them positive feedback by providing something quick and simple to get started.
First Time UX showcases a lot of great mobile app onboarding examples. User Onboarding tears down a lot of popular web apps.
3. User Roles and Permissions
Most web apps have more than one user type. It’s important to identify all user types and distinguish what each of them can and can’t do. Take the case of a learning web app that lets students take practice quizzes. While the student may be the primary user type, the web app may have a more administrative access level for teachers and a limited “grade-view only” access for the students’ parents.
4. Confirmation Modals
We want our experiences to be quick and smooth. However, we need to be careful around major (often undoable) actions in the app. For these scenarios, it may actually benefit the user to slow down. Confirmation modals are a good way to verify a user’s intention before they do something critical like delete a record or upgrade/downgrade to a different plan. You’ll minimize calls from panicked users who may have accidentally deleted an important file or made the wrong purchase.
5. Email UX
Emails are a part of the web app user experience even though it appears to happen in a user’s inbox. Consider triggering confirmation emails whenever there’s an action that requires the user’s attention. A popular example is when a user has posted something (think Craigslist or TaskRabbit) and is waiting for responses. Without an email notification, the web app risks losing a key interaction by betting that the user will come back to the site voluntarily without knowing someone has responded. Reminder emails are also opportunities to use email to provide a better experience. An events-based web app will benefit from the ability to send out reminder emails to attendees a day in advance. Think through the overall email user experience and use your best judgment to ensure that users are getting the right amount of notifications and aren’t being bombarded by unnecessary ones.
If you’re worried about annoying the user with too many emails, consider building in email notification settings (usually within the account settings), so that users can control what emails they get.
Conclusion
As designers, we should take it upon ourselves to be thorough in considering the various edge cases and less visible user flows that may confuse or frustrate users. Through a combination of experience and attention to detail, we can play an important role in minimizing blind spots in our web apps and delivering a more seamless user-experience.
What other blind spots do you run into while working on web apps?