filmov
tv
Figma Tutorial: Upload Files Interaction
Показать описание
How to make an Upload Files Animation in Figma
𝗪𝗵𝗮𝘁 𝗮𝗿𝗲 𝘁𝗵𝗲 𝗠𝗶𝗰𝗿𝗼𝗶𝗻𝘁𝗲𝗿𝗮𝗰𝘁𝗶𝗼𝗻𝘀?
Those are the small, everyday events in digital products that can be a great way to enhance the overall experience for your users.
In this tutorial, I'm going to show you a way how to prototype a File upload component in Figma.
You'll learn how to make this animation for the file upload component. There are different upload box designs out there. I have chosen this one because its a part of my Brainstorming UI kit.
Now, I know it might not look like much, but that's the whole point. Microinteractions are supposed to be useful, but not intrusive.
Wrap up
You can always try different approaches to animate elements. Most used is the process bar.
Try Figma for FREE
-----------
-----------
Check Figma tutorials - 13 Chapters:
𝗧𝗼 𝗺𝗮𝗸𝗲 𝘁𝗵𝗶𝘀 𝘀𝗲𝗿𝗶𝗲𝘀 𝗼𝗳 𝘁𝘂𝘁𝗼𝗿𝗶𝗮𝗹𝘀 𝗜 𝗵𝗮𝘃𝗲 𝘂𝘀𝗲𝗱 𝗕𝗿𝗮𝗶𝗻𝘀𝘁𝗼𝗿𝗺𝗶𝗻𝗴 𝗨𝗜 𝗦𝘁𝘆𝗹𝗲 𝗞𝗶𝘁.
𝗪𝗵𝗮𝘁 𝗮𝗿𝗲 𝘁𝗵𝗲 𝗠𝗶𝗰𝗿𝗼𝗶𝗻𝘁𝗲𝗿𝗮𝗰𝘁𝗶𝗼𝗻𝘀?
Those are the small, everyday events in digital products that can be a great way to enhance the overall experience for your users.
In this tutorial, I'm going to show you a way how to prototype a File upload component in Figma.
You'll learn how to make this animation for the file upload component. There are different upload box designs out there. I have chosen this one because its a part of my Brainstorming UI kit.
Now, I know it might not look like much, but that's the whole point. Microinteractions are supposed to be useful, but not intrusive.
Wrap up
You can always try different approaches to animate elements. Most used is the process bar.
Try Figma for FREE
-----------
-----------
Check Figma tutorials - 13 Chapters:
𝗧𝗼 𝗺𝗮𝗸𝗲 𝘁𝗵𝗶𝘀 𝘀𝗲𝗿𝗶𝗲𝘀 𝗼𝗳 𝘁𝘂𝘁𝗼𝗿𝗶𝗮𝗹𝘀 𝗜 𝗵𝗮𝘃𝗲 𝘂𝘀𝗲𝗱 𝗕𝗿𝗮𝗶𝗻𝘀𝘁𝗼𝗿𝗺𝗶𝗻𝗴 𝗨𝗜 𝗦𝘁𝘆𝗹𝗲 𝗞𝗶𝘁.
0:02:04
0:21:50
0:00:59
1:05:41
0:00:16
0:16:20
0:00:27
0:07:49
0:05:00
0:00:24
0:00:23
0:08:45
0:02:55
0:03:44
0:00:21
0:00:17
0:00:19
0:00:35
0:00:42
0:00:30
0:01:00
0:00:37
0:01:00
0:00:59