UI design is a growing field, full of talented designers. With user interface becoming one of the most important aspects of website design, expert advice is invaluable. Proper UI design on a website can decrease bounce rates and build loyal customers, which can have a direct impact on your business, blog, or other organization. Try some of these tips to create the best UI for your website.
Know Your Users
Arguably the most important aspect of creating the optimal UI is knowing who your audience is. You must be able to adapt the website to your users. Use analytics software to determine demographics and other data about your visitors.
It is also important, however, to address your users’ wants and needs. Getting information about deep aspirations is often more difficult because you cannot get it from charts and software. Analytics data can only give you enough to assume or interpret what the users may want or need.
To truly get to know your users, you must interact with them on a more personal level. Have conversations with them about what they are looking for. Many website designers believe that the only important question is asking what the user thinks of the design. However, this question only skims the surface. You want to get to know your users as people.
Determine How People Use Your Interface
As you are creating your website, it is important to keep in mind how people use your website. People generally use websites directly or indirectly. Direct interaction is interacting with an element of the product by doing things such as:
- Tapping a button
- Swiping a card
- Dragging and dropping an item with your fingertip
Indirect interaction occurs when you interact with an element that is external from the product such as:
- Pointing and clicking with a mouse
- Using key commands
- Typing into a form field
- Drawing on a tablet.
Direct interaction is more likely on mobile devices and indirect interaction more commonly occurs on computers. Think about who your audience is and how they will access your website.
“The brief panic right after sending an email that you accidentally sent it to the wrong person.”
Users of any website have a deep fear of accidentally completing an action that they did not intend. There are thousands of horror stories of people sending emails or messages to the wrong people. Users will appreciate it if you make it clear what is about to happen.
For example, Gmail offers an option immediately after sending an email to ‘undo’ the action. This option has saved many people in the past. You can let people know the consequences of their actions through copy or design.
Setting expectations with design may include:
- Highlighting the option they are about to click
- Using a widely understood symbol such as a trash can
- Picking colors with relevant meanings
Setting expectations with copy could include:
- Writing clear button copy
- Providing directional copy in empty states
- Delivering warnings and asking for confirmation
Making clear what is about to happen will give your users peace of mind that they will deeply appreciate while using your website.
Even after making consequences clear, people are bound to make mistakes on your website. If you cannot prevent the mistake before it happens, it is important to provide ways for people to undo the mistake. Detailed messages outlining the error are extremely useful. With error messages, you want to:
- Explain the problem
- Explain how to fix it
Make sure that the user can easily remedy any mistake that they made. For example, if they entered information incorrectly on a form, explain what information was wrong and how the user can go back and change it.
Give Fast Feedback
Many websites do not provide any indication or feedback after something has occurred. Not only does providing feedback encourage the user, it confirms that an action has been completed. For example, MailChimp offers images of high-fives or ‘rock-on’ symbols when someone sends an email.
However, it must occur almost immediately. There are few things that users hate more than waiting long periods of time for things to load:
“I spend more time online waiting for pages to load than I do actually *DOING* anything online!”
If you are adding feedback, make it instant. Users will quickly lose patience with your website if they need to sit around and wait for everything to load. If the page can load in under five seconds, do not include a progress bar, as these can make the wait time seem longer.
Think Carefully About Where to Put Elements
UX relies on functionality. For example, the closer and bigger an icon is, the easier and more tempting it is to click on it. Prioritize the elements on your website and make them easy to select. If you have certain things that people use more frequently, make those icons larger and more visible.
Do Not Try to Be Too Innovative
While it is good to revolutionize and re-invent aspects of design, it is important to appreciate the standards. Many of the standards are still used because they work.
Additionally, many users subconsciously assume where things are on a page. They may automatically assume that the ‘archive’ or ‘delete’ option is in the bottom corner of the page. For example, Google Docs has almost the exact same format as Microsoft Word because everyone is used to the layout of Word. The more automatic your site is for users to navigate, the less they will need to stop and think about where everything is and the more they will enjoy your website.
Make It Easy to Learn
It is always dangerous to make a website overly-complex. Make it simple and easy to navigate or users will lose patience and leave. Limit the number of things that a user needs to know and understand to use your website.
Microsoft Word struggled with this concept. Most people just use word to type and do other basic activities. Users would become confused by the wide range of options and settings that they never used. To combat this, Microsoft adjusted the software so that the advanced features are tucked away and do not get in the way of more basic functions.
Make Decision Making Simple
Along with making your website easy to learn, make it easy for users to make decisions. Do not complicate it with many different options, icons, or pages.
“Why are college websites so difficult to navigate like I thought you wanted me to go here please use easy buttons that say yes or no”
Too many options will confuse users and make your website seem less appealing. You should try to limit the options in every aspect of your website, including:
- Overall layout
- Navigation menu
- Pricing pages
- Blog indexes
- Content feeds
The easier it is for people to make decisions on your website, the quicker and easier it will be for them to use it, creating the ideal UI.
Pay Attention to Data
There are numerous applications and analytics software available to help you evaluate the effectiveness of your website. While designing a site, it can be tempting to focus more on art and aesthetics. However, the basic goal is to make your website appealing and easy to use. Pay attention to analytics data that reports the number of visitors, bounce rates, and demographics.