micro-interaction

Micro-interactions are an essential part of what we are talking about when we talk about UI. Micro-interaction is the use of movement and effects to visually guide the user to the next action according to the purpose of the user using the site or application. Micro-interactions are movements and functions that provide various types of information feedback, such as indicating that the device is working properly. This is called micro-interaction. Let's look at some examples.

For example, the input form above. When you click on it, a cursor in the shape of a vertical line flashes where the text is to be typed. This is meant to guide the user to the place where the text is to be typed, and to show that the site is working properly. This is another example of micro-interaction.

One of the things that are classified as micro-interactions is mouse hover. A mouse hover is a reaction such as changing the size or color of a button on a website when you hover the cursor over it. When you hover the cursor over a button on a website, it reacts by changing its size, color, and so on. This makes it easier for the visitor to see where he or she is clicking and This makes it easier for the visitor to see where they are clicking and makes the site easier to use.

Hover your cursor over some of the examples below.

The "Like" button on Twitter, a globally used social networking service, is another good example of micro-interaction. When the Like button is pressed, the color of the button changes with an effect, making it easy to understand the operation.

In addition, when you press the button on your smartphone, you will feel a vibration in your hand, indicating that the button is being approached in ways other than visually to enhance its usability.

In addition to these mouse and cursor-related movements, there are many other ways to make the usage of applications and functions easier to understand.

In addition to these mouse and cursor movements, there are many other ways to make the usage of applications and functions easier to understand. Let's take a look at more examples on the next page.