Time Picker Animation | Figma Interactive Components

Подписаться 6 тыс.

Просмотров 18 тыс.

50% 1

In this tutorial, I will show you how to create Time Picker Animation in Figma with Figma Interactive Components. Also, you will learn how to use Frames, Components, Figma Properties, Variants, Prototype, Smart Animate and Vertical Scrolling.
In this video I show you:
00:00 Intro
00:44 Create Rectangles
02:04 Create Component
02:16 Properties Variant
02:30 Add Variant
02:50 Select Animation Prototype
03:30 Hour and Minute Texts
05:02 Frame Selection
05:22 Create Two Frames
06:25 Frame Within a Frame
08:05 Prototype Vertical Scrolling
======
Watch my others Figma Interactive Components tutorials:
Pulse Animation: • Figma Pulse Animation ...
Animated Countdown: • Animated Countdown Tim...
Dropdown Menu List: • Dropdown Menu with Scr...
Progress Bar Button: • Download Progress Bar ...
Animated Heart Icon: • Figma Animated Heart I...
Animated Swipe to Delete: • Figma Swipe to Delete ...
Floating Action Button (FAB): • Floating Action Button...
Animated Like Button: • Animated Like (Heart) ...
Search Bar (Keyboard Input Animation): • Search Bar (Keyboard I...
Loading Animation: • Loading Animation | Fi...
Interactive Star Rating: • Figma Star Rating Anim...
Interactive Slider: • Figma Slider Animation...
Interactive Button: • Figma Interactive Butt...
Radio Buttons: • Figma Interactive Comp...
Checkbox: • Checkbox | Figma Inter...
Dropdown Menu: • Figma Dropdown Menu Tu...
Input Fields: • Figma Interactive Comp...
Progress Bar: • Figma Progress Bar Tut...
Toggle Switch Button: • Figma Toggle Switch Bu...
======
Don't forget to like, subscribe and turn on notifications to watch new ui ux design videos and figma tutorials

Наука

Опубликовано:

13 июл 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 24

@pratibhalimbole5890 6 дней назад

Thank you so much ❤ 8:51

@ChinskDesign 5 дней назад

Hi!😃 I’m glad to help! Thank you so much for watching! Have a great week!

@arianemoki189 Год назад

Great content. It really helped me with my project. The only thing I would suggest is zooming in where you are hovering. The way it is now is kind of blurry. Keep posting videos, because they are amazing.

@ChinskDesign Год назад

Hi!😃 Glad to help!🤩 Thank you so much for the feedback, I will work on it! Thanks for watching, share our channel with your friends😀 I will keep posting videos every week. Have a great week!

@andrearodriguezojeda746 6 месяцев назад

excelente, vi muchos videos y no hay uno mejor explicado que este

@ChinskDesign 2 месяца назад

¡Hola!😃 ¡Muchas gracias por los comentarios!

@postal398 2 месяца назад

Not so many videos showing how to do that, many thanks to you!

@ChinskDesign 2 месяца назад

Hi!😃 Thank you so much for the feedback! Have a great week!

@user-cf8qx1ve7x Год назад

thanks for information 💜

@ChinskDesign Год назад

Hi!😃 I’m glad to help!🤩 Thank you so much for watching!💙 Which tutorial do you want to see here on the channel? Have a great week!

@iberco91 Год назад

Thank you very much, you save my life!

@ChinskDesign Год назад

Hi!😃 I’m glad to help! Thank you so much for the feedback! Have a great weekend!

@iberco91 Год назад

@@ChinskDesign thank you! U too!

@anukrititripathi152 Год назад

Excellent 👍🏽 Thankyou so much ! I request you to make more

@ChinskDesign Год назад

Glad to help!🤩 Thank you so much for the feedback! Thanks for watching, share our channel with your friends! I will keep posting videos every week😃 Which tutorial do you want to see here on the channel? Have a great week!

@anukrititripathi152 Год назад

@@ChinskDesign Hey! I am learning ux ui design. I am working on my first case study I found in the process that there are many things/possibility in figma which I am not aware of . I aim to learn and practice to be better in my visual and prototyping skill You are damn good in simplifying things and explaining it. If you can let us more , it will be damn helpful . Thankyou

@ChinskDesign Год назад

I’m glad to hear that!🤩 Feedback like this makes me motivated to keep making more videos😃 Have a great week and best of luck to you on this study journey😃

@ExpectZombiesHD Год назад

Any Chance to make it circular? So that it starts again when you go over 24 hrs / 60 minutes?

@aliciad5531 Год назад

Can you please show us how to make this in Adobe Xd? Thank you 😊

@yanxiao5286 Год назад

NEXT TIME PLEASE ADD YOUR VOICE TO EXPLAIN THE TUTORIAL INSTEAD MUSIC, IT'S TO LOUD AND TOO NOISY. MANY THANKS.

@favourobiukwu5526 Год назад

I couldn't see anything

@ChinskDesign Год назад

Hi!😃 Which part of the video do you need help?

@user-ze9jg6xg9w Год назад

But why you guys don't like to talk when teaching. It just makes people not to wanna click on the video. Not helpful at all.

@DerekMckean Месяц назад

I understand your perspective. Things may seem ambiguous if you're just moving the mouse in circles. However, due to privacy reasons, they may not want to put their voice on the internet, which is also understandable. However, even if it is indeed the latter, including their bullet points of what they did would be extremely helpful.