How To Create Interactive Drop Down Menu In Figma | Figma Tutorial

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

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

50% 1

#figma #uidesign #animation
How To Create Interactive Drop Down Menu In Figma | Figma Tutorial
In this video, I tried to show you how to do an interactive drop-down menu component in Figma using smart animate.
Support Me: www.buymeacoff...
Follow Me
Behance: www.behance.ne...
Instagram: / rohanrhn_
Check Out Previous Videos
Onboarding Screen Design & Animation: • App Onboarding Screens...
3D Verse Landing Page: • 3D-Verse Landing Page ...
3D Mockups: • Create 3D Mockups Usin...
UI Design Resouces: • UI Design Resources
Figma Animation Tutorial Playlist: • Playlist
TimeStamps
00:00 - Preview
00:24 - Design
02:58 - Interactive Component
04:32 - Prototype
06:08 - Final Output

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

14 авг 2024

Ссылка:

Скачать:

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

Добавить в:

Мой плейлист

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

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

@pixxelex Год назад

Thanks for all the support for this video. Check out the latest video of Drop Down Menu using Figma Variables Link is here: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-4Fdpi_rT_Y4.html

@aksinghh77 Год назад

This was the most straight forward & correct way of doing things. Most big youtubers are confusing me with so many steps but u r impressive. Thanks

@pixxelex Год назад

You’re welcome 😊

@niranjalidutta9941 Год назад

From last 2 days I was searching for a easy step by step, tutorial for drop down menu feature other videos a with lot of things jumbled but accidentally clicked ur video and it turned out to be amazing 😍. Straight to the point, perfect for beginners 👍🏻 Thanks a lot 👍🏻

@pixxelex Год назад

Glad it helped you☺

@oliverpolicarpio2467 24 дня назад

in 3:16, how is it able to hide the Group 2 Top right and Top corner from Group 1? Since we have a radial corner. Mine is showing group 2 because it has holes Edit: Nevermind. I missed the step to make the frame corner to round

@akandeaisha5119 Год назад

May God bless you for this awesome video, I have been trying to sort this out for weeks. Thank you for this video

@pixxelex Год назад

Glad it helped you.

@oliviabakerr6418 Год назад

Helped me in the fastest and most straightforward way I needed asap!

@pixxelex Год назад

Glad it helped you.

@huotkosorl 11 месяцев назад

Greate, Thank you

@pixxelex 11 месяцев назад

Welcome!

@xianfier6982 Год назад

lodi, thank you so much!

@pixxelex Год назад

You're welcome.

@RonaldDas42 Год назад

Nice video, short and to the point

@pixxelex Год назад

Glad you liked it

@SPKBLUE Год назад

Gracias por subir el video, muy bien explicado, sin dar tantas vueltas, directo al grano, como debe ser.!

@prajwalmp6179 8 месяцев назад

Hello can you tell me how to bring back the colors down again which u sent using shift+ L because I want to add some more colours to it

@pixxelex 8 месяцев назад

You can move the frame by using ( Shift + arrow keys )

@NHILE-zb3lc Год назад

Coi gần nát cái utube mới được cái clip chỉ có tâm :(( huhu cám ơn

@onwadonjazzy Год назад

Thanks for the display but please add voice explanation alongside the steps taken for better understanding.

@pixxelex Год назад

Thanks for the suggestion

@onyiyehelda7539 Год назад

This is perfect and easy to do thank you

@pixxelex Год назад

You’re welcome 😊

@jayskieeee Год назад

amazing work ♥

@pixxelex Год назад

Glad you like it!

@deekshadatyal8035 Год назад

U have taken the backgrounds white..bt if we are taking any othercolors then they are visible after shifting..

@NHILE-zb3lc Год назад

many thanks 💌💌💌💌💌

@pixxelex Год назад

You're welcome!

@chukwudinnodim5384 Год назад

Thank you!

@pixxelex Год назад

You're welcome!

@mitalbakrania7568 Год назад

Hi, thankyou so much for such a easy & detailed interaction video, there is a one more question how may i share this prototype in my portfolio?? i mean i wont share this i will make another interaction but how to convert figma file into video plz do share if u have a link for that.

@pixxelex Год назад

Glad this video helped you.🙂 And yeah you can attach the embed code of the prototype in your portfolio.

@mitalbakrania7568 Год назад

@@pixxelex thanks for guidance 😊

@pixxelex Год назад

@@mitalbakrania7568 You're welcome

@clydekailastorytellers Год назад

Thank you 🙏🏾

@pixxelex Год назад

You are so welcome

@olashileOlaonipekun Год назад

I LOVE THISSSSSSS

@pixxelex Год назад

Thanks

@ikennagibson3933 2 года назад

Nice video...please how can I add a hover effect to this awesome dropdown?

@pixxelex Год назад

First of all sorry for the late response. Check out my new video about Drop Down Menu(Hover): ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-RtfLXXTtlWg.html

@revenant7863 Год назад

Nice one♥

@pixxelex Год назад

Thanks 🔥

@adusarpongsamuel559 Год назад

good job

@pixxelex Год назад

Thanks

@startswithAendswithE Год назад

During the process of repeating when assigning to the different colors in the component set, is there a shortcut to this manual process or it really has to be this painstakingly long? 😅 As in my concern on my end, my dropdown box will have quite a lot of choices in there LOL. If there is a shortcut to this process would be awesome!

@pixxelex Год назад

First you can attach the prototype to the element then you can copy it and change the color, it'll copy the prototype also.

@startswithAendswithE Год назад

@pixxelex Wil try that, thanks!