UX-UI/subjects/ui/rules/micro-interactions/README.md

## Micro-interactions

### Instructions

Browse the internet and find at least 5 different examples of feedback micro-interactions or micro-animations on websites or apps.

Be careful! Feedback is helpful to provide information to the user, not just showing a catchy design. You need to make the difference.

**Deliverable:**

- A Figma file gathering 5 examples of **feedback** micro-interactions or animations. In each example, show the different versions of the element.

Don't forget to:

- Upload the Figma file on Github, labeled as follows: “Name_FirstName_DeliverableName_Date_VersionNumber”. For example, it can be labeled as “Doe_John_MidFiPrototype_05242024_V1”.
- Add a title within the file.

**Tips:**

- Feedback is the situation when the app specifically sends a piece of information to the user, like:
  - Payment accepted
  - Refreshed feed
  - Information saved
  - etc.
- Pay attention to the global aspect of the file. It must be clear, simple and easy to read. You can get inspiration [canva](https://www.canva.com/) but don’t overload your design with too much details!

**Resources:**

- [Why use micro-interactions in your design](https://hike.one/update/why-use-micro-animations-in-your-design)
- [Micro-interactions: why, when, and how to use them to boost the UX](https://uxdesign.cc/micro-interactions-why-when-and-how-to-use-them-to-boost-the-ux-17094b3baaa0)