How to Create A Drop down Sidebar Menu in adobe XD [Tutorial]
Вставка
- Опубліковано 17 жов 2024
- 🔥🔥 Join Members Only Content : bit.ly/3fEEvD4 🔥🔥
🔥 Premium Tutorials : 🔥
⭐⭐ UA-cam : bit.ly/3fEEvD4⭐⭐
⭐⭐ Udemy : bit.ly/2Cqmcgo ⭐⭐
🔥🔥 Collect NFTs : Rarible: bit.ly/34hUCQZ 🔥🔥
🔥🔥 Open Sea : bit.ly/3l8SEJE 🔥🔥
🔥🔥 Sign up for Free in Binance : bit.ly/3c0vXo3 🔥🔥
In this Step by Step tutorial I show you how to create a working drop down sidebar menu in adobe XD
![Animating Horizontal Menu Bar Design in adobe XD [Tutorial]](http://i.ytimg.com/vi/g674uMQ97Zg/mqdefault.jpg)
![Animating Horizontal Menu Bar Design in adobe XD [Tutorial]](/img/tr.png)
ohhh!!! thank you very much!!! I really needed to learn how to do this menu!!!
Good video. The only solution to not make a complete mess is to split your prototype into sections for demo purposes. This way you can show the designs and functions you want without a million connections. I've just created a burger menu list with about 3 sub menu's and it was much easier to design how i want the menu to operate rather than linking it to the whole UI platform.
It looks like this is a fundamental weakness of XD... lists and dropdowns look like far too much work to prototype.
Scott Moyse true im trying to add drop down menu’s to my whole prototype.. i need to copy every page and add the menu with the effects
So much work
Thank you for making this, much more complicated than I had anticipated. I can anticipate a big mess of connections. At least there is a solution though.
We need more tutorial with your sound on, please keep making more.
I just simplified some steps and some coordination to provide a mess. Otherwise it's gettin complicated, to add some menue points in the future. But it's a good tutorial/ overview
Starts off with "It's very simple" followed by 19 minute tutorial haha
15:00 video starts on
Thanks!
This is now partly solved with component states. It at least reduces the work of wiring up multiple artboards.
Hey do you know of a good tutorial or can you explain what you mean? I am still learning components and states, and I'd like to create an FAQ menu like this without having to create a bunch of artboards, as its 13 items long lol.
@@jazzpear8877 Basically, you can use the component states to create the drop down or accordion menu effect without creating a new screen. So, by clicking on the icon, you can trigger a state change which would display the drop down. You should follow this video to set up all of your menu components and then, once all of the various pieces are there, you set the whole menu as a component and then, for each interaction, you create a new component state instead of a whole other screen.
After experimenting with this, I found that it works well, but with one big limitation. I can't give each menu item a hover state, because nesting components just makes the stack not work in the preview again. When you select a nested component you can't give it it's own interaction. I also tried putting each of the nested components into their own group, but that didn't work either, it has the exact same result as just putting the multiple components together. (The accordion not stretching) For now I think my best option is to let Dev know it's supposed to be an . Sorry if this doesn't make sense lol. It's hard to word this kind of thing. Thank you for your help 😊
@@jazzpear8877 It does have its limitations, but regardless, you can still make it. work and it saves creating a ton of artboards.
I think I’m still missing something on the component states. If I make one component for the whole menu with different states for each expanded submenu, I can’t change this state by clicking on one of the menu buttons because I can only change the state of the component that was clicked on. If I make the states on the level of the top menu buttons, then expanding one button on click would work but how can I move the top menu buttons below the one that is expanded? Theoretically, I could use a Stack but a Stack doesn’t work in Preview mode.
This was to long of a video.. pls start scripting and editing you videos
this is painful to watch.
I think this is useless XD still too weak at this time for animated prototypes just a simple one maybe!
No improvement so far in XD...
painful
TOP