Have you ever pushed on a door handle you should be pulling? Ever clicked on a website object and nothing happened? Or have you been annoyed that you can’t stop Netflix from auto playing movie trailers as you browse? At some point in our daily adventures, we inevitably encounter a moment when we struggle getting something to work the way we want or expect it too. The longer it takes, greater is the failure of the person that designed it.
User Experience Design is not a recent concept but a long standing and ever-growing methodology to improve how people interact with just about anything that we have built. Back in the 1990’s Jakob Nielsen came up with a heuristic approach to user experience. This approach was not an optimal one or even rational, but you could reach an approximation of your design goals if you followed his method.
As a web developer I see these principles in use and follow quite a few myself. Websites have some of these methods ingrained in them by default such as menu structures, page flow, interactive buttons, and universal icons. But many are left up to the developer to include, assuming they know how to do so.
Here are five of these principles and how they apply to modern web design.
Its tempting when building or refining a site to do something new and different. But users come to your site with expectations built on years of experience on the web. Knowing when to deviate and how much is not a skill that one develops quickly. But in time you will find what works and what doesn’t. You can use usability tools and SEO to analyze how users are responding to your new ideas. If mistakes are made you will see negative changes in your data. Do not feel creatively stunted by this principle, but rather consider it a challenge to find a unique way to bring a consistent and standard experience.
Ever have that moment when you’re not sure if a web page or video is frozen or just loading? Or maybe you filled out an online form and you’re not sure if it was completed and sent? Sometimes there is nothing a developer can do about these technical problems, but sometimes there is. A simple alert that a form has been sent can give a user comfort. Likewise, an animated loading icon that lets a user know its being work on. Your site needs to let users know that the interaction they have started is finished or needs more time.
Remember my example of the door that opened by pulling rather than the embarrassing abrupt stop you had when you tried to push it? A man named Don Norman wrote a book called “The Design of Everyday Things”. In this book, he so well explained this concept of poorly designed doors that they are now called Norman Doors. Your mind on some level expected that door to open when you pushed it. It could have been the shape and location of the handle. It also could have been your previous experience with doors. Either way, you assumed how it was supposed to work. This also applies to how things function on a website. If you do not provide the appropriate cues, the interaction fails. When you push a button in the real world, its appearance changes – so should it also on your website. A loading icon should be rotating clockwise like a clock does so the user knows things are moving forward. Using colors from stoplights can signal to your users how to proceed from an interaction. All these subtle methods help users better interact with your site.
When I first started using Adobe Photoshop, I was floored by all the tools you could use to alter images. I also quickly started making plenty of mistakes. That is why the first hotkey I learned was how to undo things. When you interact with a system having an undo or exit option is crucial for the user’s experience. Giving users this freedom allows them to maintain a sense of control. The last thing you want is your users to feel stuck or frustrated. If you site has a lengthy form on it, one of the most overlooked additions is the reset button. A simple way to start all over again. Having a well-designed menu that allows people to easily traverse your site helps greatly with user freedom. And when linking to outside sites, have the button set to open a new window or tab instead of leaving your site.
Websites should always be built so they are easy to use. You never want your visitors to get frustrated trying to complete a complex action or unable to locate what they are looking for. At the same time, you can include short-cuts for advanced users to get to their goals quicker. One of my most used efficiency methods is accelerators. This is usually not noticed by your average user. When you have a web page that is very long, you can create anchor links. These links are usually located at the top of a page. When the user clicks them, they will automatically scroll quickly down to the content the button was referencing. While novice’s user would scroll through the page manually, a more advanced user would appreciate the faster option. This is one example, but many more exists to be inclusive of multiple user types in your design.
I hope you enjoyed my perspective on these five user experience principles. Next week I will discuss the last five principles of user experience and how they can improve your website. I find each and everyone can be applied in some way to modern web design. And when used correctly, they can improve user experience and keep them coming back.
