Posts tagged with “user-experience”

Microinteractions in UI – Focus on the details

Tuesday, 11 June, 2019

The brand philosophy of the most popular Design House Stockholm says “Don’t make something unless it is both necessary and useful; but if it is both necessary and useful, don’t hesitate to make it beautiful”. So, the basic idea of Microinteractions are to focus on the details that can truly transform the basic user experience of an application. There are many practices  to enhance the overall user experience such as well-structured information, meaningful content, attractive design, responsive and fast loading pages etc. But apart from all these high-level technicalities, there are micro level interaction details that can that can keep the users delighted and increase retention.

In short, Microinteractions are those tiny enticing moments built into the application, which stimulates a feeling of happiness to the end users. As a designer, identifying the micro interactions in the application is equally important as designing them. It’s the meticulous attention to detail that differentiates an outstanding website from the rest.


Dan Saffer, the famous Interaction Designer & the author of the book Microinteractions, defines micro-interactions as “contained product moments that revolve around a single use case -  they have one main task”. According to Saffer effective Microinteractions follow a four step process mentioned below.

This is what initiates the Microinteraction. A trigger can be a floating icon that enourages a user to click, swipe, tap, pull, scroll.

The trigger engages the rules. This is what happens during the interaction and it needs to feel natural for a user.

This lets the user know what exactly is happening. For example, it can be loading animation, pop-up, color fill an icon or any other range of interaction.

Loops and modes:
This determines the length of a Microinteractions as well if the user will need to repeat it or change it over time.

Instant Feedback:

An input feedback should work instantly in a good UI system. Imagine a scenario where the user is filling a huge web form and when he clicks the ‘submit’ button after completing all the fields, the form is throwing an error message. This will make the user instantly frustrated. Besides the irritation of finding the fault input field, there is a big chance that some of the fields get empty, making you putting the whole information again. Providing information, automatically appearing when needed, will ease the frustrating process of filling rules. For most of the people, this information would be unnecessary, they don’t want to see a bunch of text before each empty field. Thus, that info can be hidden in a small icon, which expands to a small box in case you hover or tap on it.

When the user fills in form, the system instantly checks for the input text and kindly reminds the user to correct the fields if there is a mistake. The process of feedback is given straight after the users leaves that input field. The validation or help message appear only when there is a mistake, sliding from the top and colouring the filed red to attract the user’s eye.


Here are some cool microinteraction techniques created by smart UI guys which I found from various sources on the web.

Quick Reference


Microinteractions are a great way to enhance the overall user experience of an application. Along with other tiny techniques, animations can also bring in a lot of personality which enhances the brand experience. Microinteractions can also make the app user experience easier and more seamless which is a very important aspect of product branding.

In UI/UX, it is highly important to study the behaviour of end-users and how they feel about a particular product. Even very small things require proper attention as it can turn the things in your favour. This is where Microinteractions come into play as they acknowledge the users and give them the necessary feedback and understanding of the current process, thereby making the interface more interactive and usable.

7 Surefire Ways to Improve User Engagement on Your Website

Friday, 2 December, 2016

After setting up a website and wonderful content are being created regularly, it can be depressing if the user engagement is unimpressive. This challenge is often encountered by many websites. With the sea of content out there, the competition is really fierce. Belfast web design companies are concerned with creating a positive and powerful digital presence.

High user engagement makes a website to be more visible and promotes loyalty and familiarity. Here are some suggestions that will assist in keeping both existing and new visitors highly engaged.

1.   Request for opinions

As long as you keep adding value to your audience, they will readily express their views whenever you ask them for their opinions. This can be done by asking a question at the end of a post in a friendly manner. Through their previous comments and the type of posts that they enjoy reading, you can be able to come up with questions that will spur their interests. Asking effective questions at the end of posts will make the comments section come alive and lead to more interactions between you and the audience. In addition, organizing surveys and quizzes can also help to generate fresh ideas that are based on the audience needs.

2.   Revamp your content

It goes without saying that creating high quality content should be top priority for every website. Once they find your content useful, they will have reasons to come back for more and share it with others. There are always trending topics on social media and even in your industry, find ways to creatively use them in your posts. Keywords exist for a reason, utilize the relevant ones to make your posts rank well in searches. Perhaps you are the busy type, expert freelance writers can be hired to take care of your content needs. After your content is in great shape, it must be presented in a way that is appealing to the audience. This can be achieved by breaking pages, using subheadings, headlines and appropriate pictures.

3.   Give rewards frequently

People feel special when they are appreciated, it’s simply human nature. You can acknowledge your audience for commenting or sharing posts on social media channels. Another way to reward them is by hosting contests on the website’s social media pages. Your audience will be curious to know more and many will be interested in participating because of the gifts to be won. A call to action may be included in the contest that will take them to your website landing page. Mere visitors can become loyal audience in this manner.

4.   Consider using different types of content

Apart from using text based content, rich images and videos can also be introduced. Generally, website visitors find great visuals magnetic and entertaining. More people will also be reached within a short period of time. Pictures can be used for posts and the audience can be asked to caption them. When using videos, the most effective ones are short and convey the message clearly. One important thing to note is that auto play should be disabled on videos as many visitors find it annoying.

5.   Minimize page load time

Google takes the page speed of website seriously and it’s one of the basic ranking factors. Removing unnecessary elements help in making a website load faster. Images can be scaled or compressed before uploading them due to the fact that large images take longer to load. Outdated and excessive plugins must be eliminated at all costs to boost user engagement. Tools that analyze page speed performance include Website Grader and Google’s Page Speed Insights.

6.   Optimize sharing on social media

The importance of an active social media presence can’t be underscored for websites. It’s a great way to build an audience by interacting and providing value to them. Posts can be shared directly to the website’s social media platforms like Facebook, Twitter, G+ and LinkedIn. Visitors that find your posts interesting or useful should be able to share it easily on social media and this can promote further sharing.

7.   Place search box strategically

Most of the times, a visitor may come across your website when using the search engine. The search box must be visible and functional so that users can search for information by typing the related keywords. It can be placed at the top right corner or at the center. As visitors discover useful content on your website, they will spend more time and come back for more. A search box is effective in reducing the bounce rate of a website.