From the course: Applied Interaction Design: Accordion Folds
Unlock the full course today
Join today to access over 22,400 courses taught by industry experts or purchase this course individually.
Add interactivity and animation to the menu
From the course: Applied Interaction Design: Accordion Folds
Add interactivity and animation to the menu
- [Instructor] In this exercise, we use Adobe's experienced design to add the interactivity and the motion to bring the menu to life. So to get yourself started, open the interactive.xd file in your download. So here's the plan. When the user taps this strip, these three items move down and the card becomes visible. Of course, we have a bit of a problem here now don't we? The card is visible below the menu items. An obvious solution would be to set the card's opacity to zero. Now the problem with that idea is when the card does become visible, it will appear to blink, which is not exactly what we need to do. There is a solution. You use a shape to cover it and have the shape move down with the menu items. Here's how. First thing we're going to do is we're going to open up the layers panel, select the card and just get the dimensions, which are 479 by 315. So far so good. Okay, we're just going to zoom in here…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.