Create a Profile Dropdown Menu in Figma (Interactive Prototype Tutorial)

Visit my STORE: bit.ly/mavi-design-store
Explore Mavi Design COURSES : bit.ly/mavi-design-courses
Download FIGMA for FREE: bit.ly/get-started-with-figma
Take FULL advantage of ALL FIGMA's features: bit.ly/figma-professional-plan
Get the SOURCE FILES for this project ($1.99): payhip.com/b/LiZUR
FIGMA BASICS: • Figma Basics
In this Figma interactive prototyping tutorial, we are going to create a website profile dropdown menu. The result will be an interactive component with a hover state, smart-animation and a simple, modern look. You'll learn how to create animations in Figma using Prototype. This UX / UI pattern can be found on a lot of websites - profile dropdown menu in the top right corner. User profile. We will be creating an interactive animated prototype.
Topics: prototyping, interactive components, interactive prototyping, UX UI design in Figma, web components design in figma, web design
---------
© 2022 Mavi Design

[@ArkFolio]

Thank you for the teaching. After clicking, it expands to the right side, which make it goes out of frame. Not able to open it on left side. Can you please help on that?

[@star-devil9157]

Mavi u don't trust me brother 😅
it takes me 2 hours to learn this effect
But for u only 20min
Lol 😂 🤣 😂
Thank you... I love the video ❤

[@chan-xs6lu]

thanks a lot man

[@ryanwahlstrom]

ive set it up so that it goes to the designated location, but after pressing on one, how do i auto close the menu

[@sda]

Thank you! when i finished everything, I click on it, it expands to the right side, which make it goes out of frame, any advice on how to make it expand to the left? thank in advance

[@mavidesign]

make sure the Constraints (Design panel on the right) are set to "Right" and "Top". That might help 🤔

[@hoangphucphan8959]

@@mavidesign Thanks for your useful video! I have the same problem like this and I also set Constraints to right and top, but it is not worth

[@vikkesgmail]

@@hoangphucphan8959 did you find it out how to avoid this effect?