The following post was co-authored by UI Designer Emily Dunkle:
Have you ever noticed that the most popular and effective web applications allow you to do what you want easily without getting in the way? Well, since that’s what we do every day, we certainly have. Simplicity is a difficult principle to use when designing something as complex as a user interface for a web app, but in my opinion a simple, accessible and intuitive interface is the most important principle in how users interact with an application.Users are trying to accomplish a goal or perform an activity. After defining what those activities and goals are, UI designers are tasked with delivering a visual interface that makes it as easy as possible to accomplish them.
Where it gets a bit tricky…
In our experience designing applications, clients often expound on the importance of the UI matching the public marketing site – and in most cases with good reason. Brand consistency and feeling like you’re connected to something cohesive definitely builds trust and confidence.
But how much parity between the two is too much?
If the public website that markets an application and steers users toward signing up boasts large visuals, huge headlines and has a prominent brand, does that mean the application UI should match it? The short answer is no. The focus and activities associated with a public site vs the actual application it’s marketing are vastly different.
A marketing site for a web application has to grab your attention within 5 seconds, inform you of the problem being solved, how it works, what some of the features are, who uses it – and of course, urge you to sign up and give it a try. The application, on the other hand, has to deliver on the promise made by the marketing site simply, intuitively and elegantly.
With many Web Application re-design projects, we always hear from the client that the UI really has to ‘pop’ or ‘sizzle’. While I think most people would agree that aesthetically pleasing design is a major benefit of engaging a firm for a UI project, the single most important aspect of the process is to ensure that completing activities is dead simple and intuitive. While there is room for polishing the treatment of the graphical UI elements – the form fields, the messaging and general framework of an interface – there is no room for distracting or competing messaging or visuals that don’t contribute to solving problems.
Take, for example, a case where a user is interacting with a list of records and is deciding to add, edit or delete something – like in the case of email or a CRM. As a user, would you rather interact with only that data even if the page seemed a little sparse, or would you prefer to see a side column that had redundant navigation or news being fed in from the company’s corporate site? I’d venture to guess that most folks want to focus on the task at hand, complete it and move on with their day.
If your process is more linear, as in the case of a setup wizard, you literally have NO room for anything that doesn’t usher a new user through the steps to get them on board.
One way to add more personality to the interior of an application without over-designing the interface is through the language and messaging. MailChimp for example has a simple and beautiful interface, but the application really takes on a personality really through the messaging. Instructional text and application language can is so often dry and boring but given a little extra attention, can really make a difference in the user’s experience. This approach should be treated with caution however – You can easily run the risk of getting too cheesy or obnoxious, which slows the user down and gets in the way of their workflow. The idea is to strike a subtle balance of useful, appropriate messages that let the personality and voice of the brand peek through.
Aside from a general facelift and reducing the amount of screens for tasks, the most common area where we provide value is simplifying the navigation of an app.
Marketers need to understand that if you solve someone’s problem quickly without distraction, then you’re providing the maximum value possible. Focusing on making it easy to use your application for what is does best is what makes it sticky. While a great UI can definitely help, many great designs also aren’t noticed as being loud and in-your-face. But simplicity can be a hard thing to achieve…
Below are a few examples of web applications we use every day paired up with a screenshot of the marketing site that represents it.