Component
Set Status Micro-Interaction in Framer
This is a smooth micro-interaction recreated in Framer from Nitish’s original work. Feel free to remix the project to see how a complex interaction like this is structured in a nice, neat way.
About the resource
You might actually think that micro interactions like these in Framer can be achieved in Framer with a single component. Well, you couldn’t be more wrong.
To set something like this up in Framer without any code, you need to carefully break it down into smaller elements, also known as components.
As you can see it on the image below, even the icons used in the interaction have a separate component, just like the set status button, or the popover.
About the resource
You might actually think that micro interactions like these in Framer can be achieved in Framer with a single component. Well, you couldn’t be more wrong.
To set something like this up in Framer without any code, you need to carefully break it down into smaller elements, also known as components.
As you can see it on the image below, even the icons used in the interaction have a separate component, just like the set status button, or the popover.
About the resource
You might actually think that micro interactions like these in Framer can be achieved in Framer with a single component. Well, you couldn’t be more wrong.
To set something like this up in Framer without any code, you need to carefully break it down into smaller elements, also known as components.
As you can see it on the image below, even the icons used in the interaction have a separate component, just like the set status button, or the popover.
Components used for the creation process.
Components used for the creation process.
Components used for the creation process.
Once you have all components set up, you usually have one main component where all the interactions are finalized.
Once you have all components set up, you usually have one main component where all the interactions are finalized.
Once you have all components set up, you usually have one main component where all the interactions are finalized.
The final main component with all the interactions.
The final main component with all the interactions.
The final main component with all the interactions.
