Accordion Animation Effect | Figma | Prototyping

แชร์
ฝัง
  • เผยแพร่เมื่อ 27 มิ.ย. 2024
  • In this video I will show you how to make an accordion Animation Effect in figma !!
    We will practice this animation for better understanding. Figma animation is as easy as you can think it can be you just have to know what is the process so ,
    LESSGGOO BOISS!!
    ~
    To create an accordion animation in Figma, prepare your UI design by setting up your accordion sections with both collapsed and expanded states. Duplicate the initial collapsed frame for each section, incrementally expanding the desired section in each subsequent frame. In the Prototyping tab, add "On Click" interactions to the headers, navigating to the appropriate frame. Use "Smart Animate" for smooth transitions in your Figma animation, and adjust the animation duration for the desired speed. Preview your prototype to ensure the accordion effect works as expected, making adjustments to the UI animation and micro interactions as needed.
    ~
    The process I'm about to show you is also one of the simplest ways to do this.
    ~
    If you got stuck in any part you can comment or ask me in my social network handles.
    let us grow together!!
    You can repeat the steps after me and improve your skills in UI design.
    #design #tutorial #ui #figma #animation
    😊DESIGN RELATED SERVICES:
    www.fiverr.com/s/W5L9wx
    🔥SUPPORT:
    www.buymeacoffee.com/Uixsensei1
    SOFTWARE USED:
    Figma
    Downloadable File 🔥 : ( FREE )
    buymeacoffee.com/uixsensei1/e...
    🔥PORTFOLIO:
    dribbble.com/ashusahoo1
    www.behance.net/ashu01?log_sh...
    uixsensei1

ความคิดเห็น •