75 examples to improve your site’s usability

132 views
  • Home
  • Articles
  • 75 examples to improve your site’s usability
75 examples to improve your site’s usability

What is website conversion?
This is one of the first questions that internet marketers ask their customers.
And if you know the exact answer to this question, let’s ask the following:
Do you know how to increase website conversion already today?
User interface (see why UI design is important) is considered good when it is easy to use and also capable of showing high conversion rates.
Only in this situation a website can be effective for both the company and the customers.
In this article, we offer a list of ideas that you can apply in order to improve the conversion rate of your website, landing page, and online store.
Let’s now go through our list of 75 ideas to improve your conversion by changing your site interface.

1. Use single-column instead of multi-column content layout

A single column arrangement of content on a page provides more insight into how the user interacts with the content.
When the content is displayed in one column, the reader can only move from top to bottom of the page. Whereas, on a page with a multi-column (tiled) arrangement there is a risk that the reader will “wander” through the content blocks and get distracted from the core purpose of the page.
The content presentation logic should natively direct the reader to act on your page.
This recommendation is appropriate for pages with a little content. In many cases it is better for you to shorten a text to guide a visitor in a direct line to call-to-action. It could be some types of landing pages, promo pages, events or discounts. In other words when you need to promote one unique offer.

2. Give first something for free instead of trying to sell a product or service.

Promotional coupon, access to the trial period to the product or just a useful checklist – this is often exactly what you need.
In addition, it is also an effective tactic based on the rule of mutual exchange – if a person received service, he subconsciously begins to develop a sense of gratitude, and can return to your services. By giving the user something for free, you are more likely to get your intended reaction from him; he will definitely use your services again.
“For free” is something that people want and expect on the Internet. So give them what they want. But you have to balance the power of free goods with the goods that you need to sell.

Give first something for free instead of trying to sell a product

3. Merge similar functionalities instead of UI fragmentation.

As the site gets updated, it often happens that newly created pages, sections and buttons may turn out performing the same functions as already existing ones on the site.
The more the user interface is fragmented, the more difficult it is for users to absorb information. So do not forget to check the sections of your site for the presence of duplicates on a regular basis.

Merge similar functionalities instead of UI fragmentation

4. Use social proof to demonstrate the quality of a product or service.

Testimonials about your services, reviews of your product, and the number of real subscribers in social networks make you a trusted partner.
People very often make purchase decisions based on other people experience. 88% of customers (Fan&Fuel’s research) put as much rely on online reviews as they would on personal recommendations.Post customer reviews on the website. Show that a large number of people already use your product or service.

Use social proof

5. Repeat the call to action.

Repetition of a call to action is the way which is the most applicable to long landing pages.
At the same time, you should avoid exaggeration as it irritates users.
Since long landing pages have become the norm, calls to action should be placed evenly.
You can place one call to action on top of the page, and then repeat it more clearly as you move down the page.

Repeat the call to action

 

6. Use contrasting styles to design clickable elements of the site.

Visual styling, such as color, depth and contrast, can be used as a hint that will let your user understand how to interact with your interface and answer his or her questions “Where am I?” and “Where can I go from here?”.
The styles of clickable elements (links, buttons) and plain text should be clearly different from each other and used in the interface in the same form. At the same time, you should not use blurry styles and the same color for elements with different functionality.
When colors are deliberately and properly selected and used, it will be easier for users to perceive the interface of the site.

Use contrasting styles to design clickable elements

 

7. Give users recommendations, not just equal products.

Research in the field of psychology suggests that the more choices a person has, the harder it is for him to focus on a specific one. This theory is known as The paradox of choice.
Showing a list of similar items in a catalog or section, emphasize certain items for users.
This will help them to make a choice and motivate them to purchase.

Give users recommendations

8. Provide the ability to instantly cancel actions that do not require additional confirmation.

Imagine that a user clicked on an icon/form and wants to cancel the action. It is not a good practice to “bombarde” with a barrage of identical requests to confirm the cancellation of each action, as if assuming that the user does not understand what he is doing.
A simple option (or form) for canceling a number of previous actions that is not overloaded with extra pop-up windows will allow users to navigate the interface more easily.

Provide the ability to instantly cancel actions

9. Do not try to reach everyone and everything – focus on your target audience.

Do you want to reach the largest consumer segment or select your own target audience? The main idea is to clearly identify the people whom your products or services are directed to.
A good starting-off point would be to segment your customer base. It will be easier for you to make contact with them and make relevant offers.

focus on your target audience

10. Say your message with confidence.

The format of messages to the audience in which words and phrases such as “possible”, “maybe”, “whether you are interested”, “whether you want” are used, will subconsciously tell users that you are not sure about your service or product.
Appeals and messages on the site to potential customers should always have an affirmative form that encourages specific actions.

Say your message with confidence

11. Highlight calls to action

For your call to action to be eye-catching, it must stand out from the rest of surrounding it elements.
Enhance the contrast in several ways.
The first way is to use the appropriate color to make the necessary elements on the site darker or lighter than the rest of the background.
The second way is to create a volume effect using shadows and gradients (in this case, an object with “call to action” will look closer to the user, as opposed to other objects).
And finally, you can use contrasting color combinations (for example, yellow and purple), which, due to its brightness, will enhance the degree of visual perception of your message.
Together, these recommendations will help to create the maximum contrast between your call to action and the rest of the information provided on the page.

Highlight calls to action

12. Describe how your product differs from competitors.

Use specific characteristics which can describe your product. It can be the brand, place of origin, features of production processes or eco-friendliness.
Therefore, even if you specify these facts for purely practical purposes, your potential clients will accept such a description with great confidence.
Often, such descriptions help to position products as something of high quality. And this is already a small victory.

Describe how your product differs from competitors

13. Use as few fields as possible in forms.

People by nature always try to avoid time-consuming tasks. The same is with filling the fields in the forms.
Each new field that you request to fill, with a high degree of probability will make your visitors go around or leave.
In addition, not everyone is typing text quickly enough, especially in the case of mobile devices.
Before creating a capacious form with multiple fields, ask yourself the question, is it really necessary to have each specific field presented?
After that, delete as many unnecessary lines as possible.
If there are a large number of lines in the form, but you really need them all, try placing them on a separate page or in a pop-up window. Remember: forms with fewer fields convert better.

Use as few fields as possible in forms

14. Display the desired options.

Each block with a drop-down menu on the site most likely contains additional options.
If these hidden parameters directly affect the conversion, it’s better to place them in a prominent place.
Instead, you can hide options that are already clear by default (for example, it can be a calendar or a list of cities).

Display the desired options

15. If the content on your page takes up more than one screen – show it.

The “false end” of the page is the conversion killer. Be careful not to give your visitors the impression that some of the pages end unexpectedly in the middle of the screen.
If you still decide to make long pages (occupying more than one screen) , make sure that the user also understands and sees it.
In addition, be careful with large gaps between the individual blocks of the page – those gaps put important, in terms of conversion, elements in the invisible part of the page (which can be reached only after scrolling).

the content on your page takes up more than one screen - show it

16. Focus users on what really matters, instead of “throwing” links.

It is easy to create a page with lots of links, try to answer as many customers’ questions as possible.
However, if your goal is to bring the reader close to a specific target action at the bottom of the page, then avoid this approach.
Any “link” that is above the main call to action risks leading the user to other pages.
Monitor the number of links on your pages and, in addition, balance the ratio of pages with product descriptions or characteristics, to bring the user to the call to action button.
Removing irrelevant links from the right pages will increase the chances for the reader to reach the call-to-action button.

Focus users on what really matters

17. Indicate the current state of the elements.

In any user interface, there are elements that can have different states.
For example, letters can be read or not read, the basket can be empty or not, etc.
Informing users about the specific state of the element is a good way to provide feedback.

Indicate the current state of the elements

18. The buttons should indicate the benefits, rather than standard actions.

For example, imagine two simple buttons, one displays “Save 30%”, and the other “Register”. Which button user will click on? Obviously the one that displays “Save 30%” because the second one does not point out any benefit for the user.
Moreover, the registration process requires effort and is often associated with long and numerous input fields.
Buttons-benefits, in turn, can lead to higher conversion.
Alternatively, you can place text next to the regular button that shows the user what he will receive after clicking.
We are not trying to ask you to completely abandon the usual names for the buttons. Use these elements in the areas of the website interface where there is no task to “warm up” the user’s interest with additional triggers.

The buttons should indicate the benefits

19. Provide users with more convenient control elements.

Sometimes it makes sense to give users the ability to interact with certain interface elements directly.
For example, when displaying lists with data, we can, as a rule, allow the user to perform some manipulations with them (add, delete, compare, etc.).
Another simple control option is to create clickable fields in the list items.
For example, the user can click on the text, which after clicking turns into an editable line.
Creating such functionality reduces the number of steps performed by your users, compared to those cases where the control panel is rendered as a separate unit in the interface (without “binding” to specific menu items).

more convenient control elements

20. Place forms with input fields immediately on the landing page.

On landing pages that directly affect the conversion, it is very useful to immediately place forms with input fields.
For example, placing the registration form directly on the landing page has several advantages compared with the option when separate pages are created under it (or pop-up windows).
First, in this way, we exclude unnecessary steps for the user, thereby saving his time.
Secondly, by demonstrating the number of fields in the form directly on the landing page, we give the user a more complete idea of ​​how long the filling process may take.
Of course, this technique works better with forms that have a small number of lines.

Place forms with input fields

21. Use animated transitions.

Some interface elements may appear, hide, move, resize when interacting with them.
We recommend to artificially create some exposure time between the transition of an element from one state to another by adding some animation (for example, an hourglass).
This is done in order to make it easier for the user to understand what the actions on the site lead to.
At the same time, keep in mind that if the duration of the transition exceed 0.5 seconds, it may seem annoying for some users.
There are cases where the interface requires the most rapid responsiveness, and so the transition delay should be reduced to the minimum.

Use animated transitions

22. Gently engage the user.

Instead of offering your visitors to register immediately, for example, first offer to perform some task, through which they will be shown the direct benefit of your product or service.
This way, you will be able to tell users about the benefits you offer. When users become aware of the value of your products, and see how it can be tailored to their individual needs, they will become more open to interacting with your company.
Gradual involvement is the best way to delay the registration process somewhat, and at the same time, to keep the possibility of personalizing your application.

engage the user

23. Avoid creating unnecessary borders to disperse the attention of users.

Of course, borders can be used to highlight the important content on a page. But, in addition, they also draw extra attention to them, because they are perceived as full lines.
Agree that focusing attention is an indisputable valuable resource. And borders, or delimiters, directly compete for attention with real page content.
To determine the relationship between individual screen elements that require less user attention, it is better to group them together, align them to height/width, create a different background, or simply use a similar typographic style.
But this method also has its drawbacks.
A large amount of content on a page without delimiters creates the feeling that they are not ordered and not grouped in any way.
Consequently, pages with a large number of blocks can look very chaotic and erratic.
That is why sometimes it is still useful to emphasize their fragmentation with the help of lines.

Avoid creating unnecessary borders

24. Don’t just sell the product, sell its benefits.

People are less interested in the functionality of the product than the benefits they can get from it.
Benefits always carry a well-defined value. Chris Gilbo in “Startup for $ 100” wrote that people really want to get more love, money, recognition and free time. At the same time, they do not want stress, conflict, hassle and uncertainty.
Of course, the “less important” characteristics of your products should also be displayed, but still it is better to harmoniously link them together with specific advantages (at least, where this is possible).

sell products benefits

25. Adapt the output of the results on the page to any amount of data.

In the online store catalog, for example, depending on the user’s request, absolutely any amount of data in the output can be obtained: they can be 0, 1, 10, 100, and even 1000+.
The site should be as adaptive as possible for any amount of information.
Also, make sure that the web page is blank the first time a user make a search query.
Website visitors will certainly be disappointed if, for the first time using a resource, they get a blank screen with the message “0 results for your query”. The same applies to situations with large amounts of data.

Adapt the output of the results on the page

26. Give users a choice.

Choice means that users may not voluntarily participate in something or do not perform certain actions.
On the other hand, the strategy is also common when to get something the user must perform some actions on the website (click a button, fill out a form, etc.).
But there are two good reasons why the first option works better than the second.
Firstly, it reduces the number of barriers for the user on the website.
Secondly, by giving the visitor a choice, you show that the website does not impose anything on them and they are free to act as they want.
As studies show, this tactic make your visitors life much easier.

it reduces the number of barriers for the user on the website

27. Apply easy-to-use features.

Creating a consistent and understandable user interface is the easiest way to reduce the time your users spend on mastering it.
Consistency in design makes the learning process more efficient and native.
You can create a similar UI by using colours, directions and arrangement of lines, size, shape, marking, etc.
However, sometimes some inconsistency can be justified. For example, an element uncoordinated with the rest immediately attracts attention.
Try again and again to identify a middle ground.

Apply easy-to-use features

28. Embed “smart” forms in the UI

One of the worst things in terms of conversion is to ask the user to enter information that they have already been provided.
In the input fields of the forms for each individual user, by default, display the values ​​that they previously entered, instead of constantly requiring the same information.
“Smart” forms are another way to save the user time and reduce the number of actions that he needs to perform on the website. The less work a potential client needs to do, the better.

Smart forms are another way to save the user time

29. Apply what already works.

Website UI should be not only consistent, but also understandable for the user or, in other words, similar to what they are used to.
For example, using the usual templates in the UI, we, by default, expect to see a button to close the window in the upper right corner of the screen, or understand how icons for the settings menu may look like.
Do not try to introduce into the UI any unique logic or new solutions with which the user may experience difficulties.
If you still need to deviate from the standard patterns then make sure that the user will understand how to interact with this.

Apply what already works

30. Tell the client what kind of pain they will avoid getting your product or service.

According to the rules of psychology, we are more likely to avoid losses than to get some profit.
This can be applied to product positioning.
Tell a potential customer that with the help of your product they will be able to maintain their well-being, it will strengthen their monetary or social status, etc.
This strategy may be more effective than the one in which we offer the client just something extra that he does not have.

Tell the client what kind of pain they will avoid

31. Implement a clear visual hierarchy.

The correct visual hierarchy can be used to underline important elements against less important ones.
A visual hierarchy can be built based on things like the alignment, colour, indents, font size, element size, spacing, etc.
When all these elements are built correctly, they help to direct and hold the attention of people within the page, thereby improving its readability.
It can be said that the visual hierarchy creates accents and keeps users from skimming the page.
The study of this technique, although it entails a longer presence of the user on the page, stimulates him to pay attention to more elements and characteristics.
Think of it as a journey. You can go on the road and get to your destination point faster (in our case – down the page), or you can choose a more scenic route and remember much more interesting places.
Create a visually “catchy” interface.

a clear visual hierarchy

32. Group related items

The grouping of related elements is the main condition for ease of use.
Most of us know that the knife and fork, like the “open” and “save” functions, are logical to place next to each other.
By placing related items side by side, you will make the UI more logical and not confuse your users.

Group related items

33. Check the correctness of the entered data in every single field, and not throughout the form.

When trying to validate a form, it is a good practice to highlight the field that is required before the user presses the “Submit” button.
After seeing the error message (for example, on the right side of the input field), the user will correct it immediately.
On the contrary, when error messages appear after refreshing the page, the user will have to find out by himself where the errors occurred and correct them.

Check the correctness of the entered data in fields

34. Provide different data entry formats.

Fields for entering information into forms should be able to recognize various data formats. This will make your interface more friendly.
An excellent example of the implementation of this technique is when we create a form asking for a telephone number.
A telephone number can be entered in different ways – with brackets, spaces, dashes, area codes, and so on.

Provide different data entry formats

35. Use time constraints.

Urgency is a persuasion tactic that applies when it is necessary to motivate people to act now rather than later (or, as a result of inaction, never at all).
It is effective because it makes the customer realize that there is a deficiency, meaning that something accessible now may not be available tomorrow.
Its effectiveness can be explained by the fact that people do not want to miss opportunities.
On the other hand, such tactics are often regarded as a method that isn’t so “clean”. However, if everything is done honestly and after a specified period of time the service or product becomes unavailable, then this method will work.

Use time constraints

36. Focus on the shortage of goods

The deficiency method is very widely used in offline trading, yet it is unfairly forgotten in e-commerce.
It is the deficit that allows users to demonstrate that the goods may soon disappear completely from sale.
Think about how many tickets to the webinar you can sell, how much customer flow you have time to close within one month, or how many products you have in stock before the next batch is delivered.
Show this data to potential customers, and tell them that the number of places/products, etc. is limited. Encourage users to take action.

Focus on the shortage of goods

37. Ask users questions.

This classic design principle is closely related to psychology and lies in the fact that it is always easier for users to describe something when they have certain basic data.
Sometimes multiple choice question tests are performed faster than open question tasks.
Give users tips to help them quickly answer the questions posed instead of asking them to describe something from memory.

Give users tips to help them quickly answer the questions

38. Make important buttons larger.

According to Fitts’s Law, the more remote or smaller the field to press, the more time we need to make a click.
Because of this you should consider whether your forms, calls to action and links are the right size.
Alternatively, you can save the size of the elements by increasing the clickable area around them.
A good example of this technique is the text links on mobile devices or in navigation menus, which are clicked even if you are not exactly hitting on them.

Make important buttons larger

39. Accelerate page load time.

The screen loading speed when launching the interface and its responsiveness to user actions can directly affect whether they will wait further or not (there is an assumption that each extra second of loading entails a decrease in conversion).
Therefore, the tactic here is to reduce boot time from a technical point of view by optimizing code and images.
Another tactic is to reduce the perception of prolonged loading by applying some psychological techniques.
In particular, you can use some tricks to make people feel that they are not waiting for so long.
One of them is to use indicators that display the status of the task.
A general rule is that you need to somehow keep the attention of users while downloading is in progress. One way to do so is by putting important information about a product or service on the screen.

Accelerate page load time

40. Show users the possible keyboard shortcuts for interaction instead of the usual buttons.

When you have a product that people will often access and use, it is always a good idea to take into account the needs of more advanced users.
People often look for ways that allow them to perform repetitive tasks faster, and keyboard shortcuts are one of those ways.
Hotkeys that a person will remember one time can significantly speed up the execution of tasks and help him or her more easily click from one interface to another.
One such example is the use of the J and K hotkeys to load the next and previous pages (they were popularized by applications such as Gmail, Google Reader, Twitter, and Tumblr).
Buttons (clickable UI elements) also have to be displayed, but it is best practice to supplement their functionality with keyboard shortcuts.

Show users the possible keyboard shortcuts for interaction

41. When demonstrating the price, go from larger to smaller

When we start with a higher price, and then move to a lower price, the latter no longer seems so tangible and large.
A typical marketing example in which this technique is used is a display of the average market value of a product, followed by a lower price — your price.

demonstrating the price, go from larger to smaller

42. Show user progress.

People are more motivated to wait for the completion of a process if they see that it is nearing its end.
If we consider this approach from a UI point of view, then during registration, many web resources show their users a block which says that the process is __ percent complete.
This model is also called “goal gradient effect ”. Create the appearance of progress for your users and give them the feeling that very soon they will come to the final stage.

goal gradient effect

43. If there are many fields in the form, do not overload the user with them immediately

With Progressive disclosure technique the form does not display all the fields to fill in at once, but instead does so gradually, as the user moves through the form.
If, when switching to a form, the user immediately sees a large number of fields, he or she will be discouraged and will avoid filling them in.
This technique helps to keep the user’s attention on the form until he or she reaches the last field to fill in.

do not overload the user with them immediately

44. Introduce users to the product gradually.

This is a psychological phenomenon which states that a person is more likely to fulfill a larger request after doing a small and insignificant one.
Suggest that your users start with actions that imply less commitment to your website and gradually move them towards longer actions.
One example of the use of this technique is a dating site, which, to begin, suggests that people just look around, and only after that do they begin to fill out a questionnaire.
This is the exact opposite of telling them to immediately get married, for example. This strategy can also be applied in the context of pricing, when we invite our customers to make a monthly payment instead of an annual payment.

Introduce users to the product gradually

45. Use hints instead of dialog boxes.

Dialog boxes quite rudely attract the attention of users. First, such windows may block some other functions or obscure some important information.
In addition, such windows are sometimes very difficult to close, and often even slow down the execution of processes on your computer.
Finally, dialog boxes can distract the user from the target.
This is why it is best practice to use more delicate and less intrusive text prompts directly on the page.

Use hints instead of dialog boxes

46. Implement multifunctional control elements.

It is a big mistake to believe that the more elements a control panel contains, the more convenient it will be to use it.
One of the ways in which you can make the UI more convenient is to endow the controls with multifunctionality.
That is, you take one control and place two or more functions in it.
For example, we can combine a search field with filters. This eliminates the need for an additional panel. We can also combine the search results screen with the ranking function.
It is also worth considering that multi-functionality is not a way out. Although it simplifies the interface, this happens by combining the functionality of different buttons, which can confuse the user.
That’s why it is better to offer multifunctionality to visitors who are already well-versed in your UI and are easily able to deal with the features.

Implement multifunctional control elements

47. Use icon captions.

The functionality of icons without signatures can be quite ambiguous to the users.
Accompanying these icons with a verbal description will help eliminate this ambiguity.
The problem with icons without signatures becomes even more relevant in the case where a user does not have much time to interact with the interface.
In order to make your UI more understandable, we recommend adding text labels to the icons.
However, if you have very little space on the screen, make sure that all these labels appear only when you hover over one of the icons.

icon captions

48. Talk to people in the same language.

Natural language is a more informal, colloquial style of communication, as opposed to very formal language. Use natural language on the site – in signatures, text and media content. Also, make sure the search form on the site is written in simple, easy-to-understand language. This will help avoid situations where in order to find a product, the user needs to enter his full name in the search box – exactly as it is on the site.

Talk to people in the same language

49. Stimulate user curiosity.

This tactic is a way of “teasing” the user.
This may be part of a chapter in a book you are selling, a trial version of a product, or free unique content that carries a call to action. As a rule, it sounds like “in order to see the rest, you need: 1 … 2 … 3”.
A small “tease” like this is a good way to push the audience to action.

Stimulate user curiosity

50. Offer warranties.

When you bring users to the order form, give them some guarantees.
For example, report that the money transfer procedure is 100% safe, delivery for them will be free and that they have the opportunity to return their funds for some time without any problems and risks.
Such clarifying elements help to increase the credibility of the company in the eyes of users.
According Google quality guidelines, a warranty is a necessary piece of content for quality ecommerce pages.

give people some guarantees

51. Experiment with pricing tactics.

If you want to use human irrationality, then display the price so that it can be justified as simply as possible.
For example, it can be broken down into unit costs (30 cents per page instead of $30 per book, or $1 per day instead of $30 per month package). You can also use prices ending in “9” instead of rounding them.
Finally, prices can be shown with fewer digits ($30 instead of $30.00).
There are dozens of price tactics you can use.

Experiment with pricing tactics

52. Show your gratitude.

Gratitude for completing any chain of actions is about more than just feedback.
It is also about user motivation for further dialogue. In addition, this is a great opportunity to invite users to perform a follow-up action.

Show your gratitude

53. Simplify user calculations.

The user interface can independently perform some mathematical calculations and, thus, eliminate unnecessary actions by the user.
Suppose that a user has subscribed to a certain service. From the user’s point of view, it would be more useful if the service showed him or her how many days left before the end of the subscription instead of the date the subscription began.

Simplify user calculations

54. Highlight freedom of choice.

The idea is to remind the users that they have freedom of choice. They can accept the offer or refuse.
Make the notice visible and clear.
The maximum effect of the “but you are free” (BYAF) compliance-gaining technique technique can be obtained if it is used in close proximity to the form.

Highlight freedom of choice

55. Reward your visitors from time to time

Make the email-checking process more addictive for your users. You can give a gift in one letter, an interesting story in a second letter and useful advice in a third.
These are ways to get users hooked and continue looking forward to your emails.

Reward your visitors

56. Pay attention to the most significant elements.

This can be achieved in many ways, starting with the most obvious, namely increasing the size or enhancing the contrast of an element.
Other, less trivial ways of focusing attention include the use of non-standard shapes, automatic field focusing, lighting, interaction with floating elements, as well as directional arrows.
Of course, you cannot use them in relation to all elements of the page, but it is worth emphasizing the most significant calls to action.

Pay visitor's attention to the most significant elements

57. Give users the chance to compare similar products.

In some situations it is helpful to show users a comparison of products with similar functionality (in the form of a table, for example).
This creates an easier UI.
There are many ways in which such comparisons can be made more understandable and as a result help users make better decisions.
First, limiting the comparison process will help to limit the number of goods or their individual properties.
Second, the classification of properties should also contribute further in this process (therefore, do not mix different properties in one column).
Third, give the user only one decision to make – this manipulation will help them to make an accurate and deliberate choice.
Ultimately, the goal of the table you create should be to show the difference between the most important attributes and help the user make a decision.

Give users the chance to compare similar products

58. Offer products in a set

The purchase of a set of products can be more motivating than when they are offered separately.
Displaying a set of products also makes users feel more confident that they’ve made the best choice and gives them a sense of achievement. The motivation for buying a complete set is also stronger when users know that the quantity of goods is limited (they are in short supply).

The purchase of a set of products can be more motivating

59. Point out the expected steps.

Unhelpful interfaces is a fog that keeps users in the dark.
All these small refinements in the process of interaction with the site UI not only inform the users, but also create trust in you.
This obvious and easy advice can increase your conversions by about 50%.

Unhelpful interfaces is a fog that keeps users in the dark

60. Use humor.

You can always create a better experience for the user by simply by resorting to humor in some places of the UI.
In some cases, humor helps to establish closer contact with users/clients, and can also be used to lighten the mood in a serious situation.
That’s why it is very likely that a smile will work in your favor. In the event of an unfavorable situation for you (for example, if you made a mistake somewhere in your service), people with whom you have previously established trusting relationships will be more likely to remain loyal to you.

humor helps to establish closer contact with users

61. Give feedback

When we perform a task, we want to make sure it was completed successfully. So your visitors need visual confirmation that they are doing everything right.
It can be in a fairly unobtrusive format, or highlighted, as is the case with dialog boxes confirming the delivery of the letter.
On the other hand, lack of feedback creates uncertainty – “Did it work out?”, “Did I press the button?”, “Should I repeat it again?”.
Feedback answers all these questions. This is a very valuable and important element for successful interactions with users.

Give feedback

62. Try to predict user actions.

A user interface that appropriately “guesses” the user’s follow-up actions usually brings more money and customer confidence.
For example, Amazon has achieved this at the level of interaction with its drop-down menu.
Such a menu, using special algorithms, independently determines which submenu should be subsequently shown to the user. This saves the user from having to move the cursor diagonally and does not cause the complete disappearance of the drop-down list.
Note that the prediction of user actions is a technique that can be implemented using much simpler scenarios.
Nevertheless, in most cases the user still needs to usef highly advanced artificial intelligence technologies to achieve this.

predict user actions

63. Make the UI more readable with white spaces.

This technique can be useful for lists, tables, paragraphs or any group of elements.
One of the most common ways to indicate free space is to add an extra frame around an element.
In other words, if you need more readable content in the elements, padding may help.

Make the UI more readable with white spaces

64. Use storytelling.

Instead of listing information as facts, why not present it in a narrative form?
Usually, stories elicit a stronger emotional response from people. Such messages will be remembered by users much better than a simple list of facts.
For example, long “selling” letters that use a narrative format for presenting information remain effective to this day.
Search engines also prefer natural language content.

Use storytelling

65. Be authentic.

Most people can sense lies. For example, stock images that depict happy people smiling for no good reason look very suspicious and undermine the confidence of your potential customers. Conversely, the desire to stand out from the crowd can be a good tool to demonstrate your trustworthiness.
Another aspect that may also be a source of skepticism is product reviews.
A mix of good and bad reviews will help you get around this. In addition, exact numerical data instead of rounded data are also perceived by people as more credible.

demonstrate your trustworthiness

66. Adapt UI to user proficiency.

This rather simple idea is that during user training for your UI, functions that are very important at first lose their importance over time.
For example, some buttons located on the control panel can be moved a little further, in order to make room for other content.
Alternatively, verbal designations of icons can be hidden once the user understands their purpose.

Adapt UI to user proficiency

67. Check your ego.

Changing your thinking from “I” to “You”, active listening and sincere interest in others are all central elements of Dale Carnegie’s book ‘How to Win Friends and Influence People’, written almost a hundred years ago. In particular, the level of focus on the audience or the client is directly expressed in our language and actions.
Behavioral tactics that imply a shift of focus away from self-interest can be a source of additional user trust and bring a lot of value to your business in the future.

Changing your thinking from I to You

68. Explain instead making assumptions.

Some things that seem obvious to us are often less clear to others.
Input fields are a classic example of this problem — this is where you need to give explanations, descriptions and tips.
In fact, the use of explanations will help to eliminate uncertainty when interacting with the UI.
You can describe in detail the typical issues related to the operation of the UI, give examples of valid input, and list the requirements or point users to the source of the requested information. However, keep in mind that this context description should not be used as the default text located inside the fields.

Explain instead making assumptions

69. Make your messages as short as possible.

Try to write sentences using more simple and understandable words. After preparing the first version of the content for the page, see if you can cut it even more.
The messages on the page should be clear for users, without diverting the attention of your users with empty and lengthy wording.

Make your messages as short as possible

70. Use responsive layouts.

There are many different screen sizes among phones, “phablets,” tablets, desktops, game consoles and TVs. Screen sizes are always changing, which is why it is better to have adaptive or responsive design.
One way to solve this problem is by using responsive layouts.
Nowadays developers can use basic technologies such as HTML and CSS to implement responsive design.

responsive layouts

71. Explain UI with visual tricks.

The biggest detriment to good UI is ambiguity. That’s why it’s better to intentionally group similar elements using different font sizes and different shades.
It isn’t good if users have to figure out for themselves whether an error was made in one or another fragment of the UI, unless this was originally intended.

Explain UI with visual tricks

72. Give users the chance to correct their mistakes.

Giving users the opportunity to correct their mistakes allows them to make changes without starting over completely.
This can be used, for example, when a user is logged in with a friend’s account and would like to re-authenticate.
Other examples of this are when the user needs to change the quantity of products in an order or change his or her personal profile. Perhaps the user’s email address has changed in the past month and he or she needs to update it.
These are reasons why forms in the UI should allow users to make corrections.

Give users the chance to correct their mistakes

73. Motivate users with public commitment.

Public commitment is a form of self-motivation. We are inherently inclined to seek any opportunity to evaluate ourselves. Making a public statement or promise makes us feel responsible for following through on it.
A typical case that demonstrates this technique is the weight loss challenge.
When we publicly affirm that we will do something, we are more likely to keep our promise and make it happen.

Public commitment is a form of self-motivation

74. Give users the chance to do something again.

Some things do not always work as planned, and users may need to try again.
Just give your users the opportunity to re-attempt or re-do an action without page reload. The UI must make such re-dos and re-tries easy for the user.
The user interface must contain such functionality that facilitates this.

Give users the chance to do something again

75. Give users less options instead of too many.

The more choices there are, the harder it is to choose one of them.
Moreover, when given more choices, our sense of satisfaction can diminish because expectations and regrets (of a potentially wrong decision), as a rule, also increase. Offer users three to five product options instead of long lists of options in which it is easy to get lost.

Give users less options instead of too many

Did you like these tips to improve your site’s graphical interface?

Implement them on your site and share new ideas in the comments section.
While these recommendations were confirmed by many cases, you should get professional advice from a UI designer regarding changes to your site.