Adobe XD States | A New XD Feature

Поділитися
Вставка
  • Опубліковано 15 вер 2024
  • States in Adobe XD help you easily design variations for elements like buttons and more in your project. These are made even more powerful with the new Hover trigger:
    Remember to Subscribe goo.gl/6vCw64
    Add interactive elements to your prototypes without unnecessary work. With Component States, you can design variations of a component for different scenarios, like Hover or Pressed. States can also be used in Prototype mode.
    This brings new levels of interactivity to your prototype. Hover is a new trigger available in Prototype mode that you can use to specify different interactions when a user places a cursor over a particular design element.
    #AdobeXD #UXDesign
    ------------------------------------------------------------------------------------
    ////////// Want to support my content and get extra goodies? Become a member and get perks like member-only content, behind the scenes, design files, and more...
    designchamps.i...
    ////////// Connect with me here 👍🏼
    Instagram: / imjesseshow
    Twitter: / imjesseshow
    Anchor: anchor.fm/imje...
    Medium: / imjesseshow
    ////////// Sign up for my Monthly Newsletter 📫
    jesseshowalter....
    ////////// Music is from Musicbed click below for a free trial 👇🏼
    share.mscbd.fm/...
    ////////// Equipment 📸
    www.amazon.com...

КОМЕНТАРІ • 146

  • @imranhdse1
    @imranhdse1 4 роки тому +2

    Thanks Jesse. I love you for the support!

    • @JesseShowalter
      @JesseShowalter  4 роки тому +1

      Thanks so much, Imran!! Go make amazing things, my friend!!!

  • @jovanih.design
    @jovanih.design 4 роки тому +2

    Dude do you know how happy this makes me?!? Thank you Adobe! :’)

    • @JesseShowalter
      @JesseShowalter  4 роки тому

      So so glad this brought you joy!! Go make rad things! 🤘🔥

  • @hannah3853
    @hannah3853 3 роки тому +2

    BRO U JUST SAVED MY LIFE! THANK U SO MUCH! I've been looking everywhere for this! 😩😭💕

  • @danielpedersen1688
    @danielpedersen1688 2 роки тому +1

    Can we just take a moment to appreciate how perfect that circle is that Jesse created for the toggle switch without having to adjust the height / width, he did it in one go. If it's me that did it it wouldn't be that perfect.

    • @nyb.mediaprod
      @nyb.mediaprod 2 роки тому +2

      You can do it to, if you just hold shift while "drawing" the circle ;)

    • @danielpedersen1688
      @danielpedersen1688 2 роки тому

      @@nyb.mediaprod ahh thanks will do that! 😃👍

  • @ScottMoyse
    @ScottMoyse 4 роки тому +2

    A VERY welcome feature... XD just got way more manageable

    • @JesseShowalter
      @JesseShowalter  4 роки тому +1

      Thank you so much, Scott!! Have a good one!

  • @jarodmorris611
    @jarodmorris611 4 роки тому +1

    Your channel is way underrated. 146k subs but your content is gold.

    • @JesseShowalter
      @JesseShowalter  4 роки тому

      Thanks man. Spread the word and maybe I’ll hit 200K soon

  • @Gamerstupid
    @Gamerstupid 4 роки тому +7

    That's whaaaaaaa, cool I'mma try this tomorrow

  • @Charlotte-zj3ng
    @Charlotte-zj3ng 4 роки тому +4

    This is super helpful once again, thanks a lot Jesse ! Love your Tutorials :)

  • @lincoln6559
    @lincoln6559 4 роки тому +4

    Thank you, This is what I've been looking for!

  • @rosengarten3210
    @rosengarten3210 3 роки тому +1

    Your videos are soooo helpful and at the same time entertaining - thank you :)

  • @MegaRadisic
    @MegaRadisic 4 роки тому +1

    One small tip. Only when you have like 10 seconds or more of explanation, switch to yourself fullscreen. The way it is now it's really annoying and it's breaking the flow of the tutorial when you are switching fast cuts between you and the screen. :D

    • @JesseShowalter
      @JesseShowalter  4 роки тому

      Thanks so much for the suggestion!! Have a good day 🤘🤘

    • @MegaRadisic
      @MegaRadisic 4 роки тому

      @@JesseShowalter Thank you for your whole channel! :D Love it!

  • @donnaknight2451
    @donnaknight2451 3 роки тому +1

    Thanks Jesse! I find your videos really really helpful. I used one of your videos to do parallax.

    • @donnaknight2451
      @donnaknight2451 3 роки тому +1

      You're really easy to follow and make things so clear.

    • @JesseShowalter
      @JesseShowalter  3 роки тому +1

      Thank you so much, Donna! So happy to help!

  • @ashfaqhussain6865
    @ashfaqhussain6865 4 роки тому +2

    Thank you Jesse, there’s great value in your video!
    I wanted to ask what monitor do you use, and is it good for colours?

    • @JesseShowalter
      @JesseShowalter  4 роки тому +1

      I use an LG Ultra wide 34' and it's great on color

  • @poojap862
    @poojap862 4 роки тому +1

    Awesome, it will save more time and efforts. I hope they introduce show hide feature on click too.

  • @TheCleft
    @TheCleft 4 роки тому +1

    Awesome Jessie, your videos are always on point!

  • @kavr
    @kavr 4 роки тому +1

    Love your XD content , keep up the good work 💙👌

  • @farvizn5364
    @farvizn5364 4 роки тому +1

    wow! now it's super easier and our art board will looks clean!

    • @JesseShowalter
      @JesseShowalter  4 роки тому +1

      That’s so awesome to hear, Farviz!! Get out there and make amazing things!!

    • @farvizn5364
      @farvizn5364 4 роки тому

      @@JesseShowalter yeahhhh!!!

  • @jalajam3027
    @jalajam3027 4 роки тому +1

    Awesome for your explanation

  • @richardottley4611
    @richardottley4611 4 роки тому +1

    Great job 👍 Jesse.. states for XD are awesome 🤗 definitely mind-blowing 🤯🤯😎

    • @JesseShowalter
      @JesseShowalter  4 роки тому

      Thanks so much, Richard!! You’re awesome! Have a good day!

  • @antsinpantsninja6619
    @antsinpantsninja6619 4 роки тому +2

    This is amazing! I'm bummed I can only give this video 1 like, it deserves 100.

    • @JesseShowalter
      @JesseShowalter  4 роки тому

      Thank you so much, ants in pants ninja. I’m so overwhelmed and humbled by all the support you guys have and are continuing to give me. Stay cool 🤘

  • @manojsharmamanish2040
    @manojsharmamanish2040 4 роки тому +1

    Thanks a ton mate, This video really helped to create a component as an amateur............

  • @wearestudiotonic
    @wearestudiotonic 4 роки тому +2

    Awesome update! Thanks for the tutorial

    • @JesseShowalter
      @JesseShowalter  4 роки тому

      Thanks so much for the support, Tom! Have a good one!

  • @michellezhu1559
    @michellezhu1559 4 роки тому +1

    Wow mind-blowing...

  • @liquid7creative887
    @liquid7creative887 4 роки тому +1

    Thanks Jesse! Awesome.

    • @JesseShowalter
      @JesseShowalter  4 роки тому

      Thank you so much for the support!!🤘

    • @liquid7creative887
      @liquid7creative887 4 роки тому

      Will we see other software following the same type of update?

  • @Jamesviolaofficial
    @Jamesviolaofficial 4 роки тому +2

    Super helpful, thank you!

    • @JesseShowalter
      @JesseShowalter  4 роки тому

      Thanks so much for the encouragement, James!! Have a great day!!!

  • @healthsongs
    @healthsongs 2 роки тому

    Cheers Jesse. Realy helpful mate,

  • @primatondyaryakurniawan267
    @primatondyaryakurniawan267 4 роки тому +1

    Wow thank you so much, i wish i knew it earlier. I'm new on xd, just working on school project and it's really stresful to copy paste same element every time.

  • @AnastasiiaN
    @AnastasiiaN 3 роки тому +1

    Thank you! You do amasing job!

    • @JesseShowalter
      @JesseShowalter  3 роки тому

      Thanks so much, Anastasya! Have a great week!

  • @javed8080
    @javed8080 4 роки тому +1

    Your videos are amazing! Thanks for doing this

    • @JesseShowalter
      @JesseShowalter  4 роки тому

      Thanks so much for your support!! Have a good day! 🤘

  • @K4ZA
    @K4ZA 4 роки тому +2

    Damn this is really sick! Definitely going to use this feature in my graduation project!
    (Is it called graduation project in english? I dunno, but I mean the final project to be done with my studies)

    • @JesseShowalter
      @JesseShowalter  4 роки тому

      Haha, yeah you’ve got it right! Well, thanks so much, and I wish you the best!!

    • @kavr
      @kavr 4 роки тому

      Hey, whats it about website development, mobile app?

  • @ArbaazKhan-wb2dt
    @ArbaazKhan-wb2dt 4 роки тому +1

    Thank you!

  • @yossigorin7738
    @yossigorin7738 4 роки тому +1

    Great video Jesse. Keep it up.

  • @titoshaba8780
    @titoshaba8780 4 роки тому +1

    Awesome.

  • @Trackdaygenius
    @Trackdaygenius 3 роки тому

    Hey fella, good production as always. What video editing software(s) do you use to create the picture in picture and general editing? Thx

  • @johanahadichandra
    @johanahadichandra 4 роки тому +1

    Daaaaaaamn, i just make a project without knowing thisss!

  • @Chinuchinmay_K_Shorts
    @Chinuchinmay_K_Shorts 4 роки тому +1

    Excellent Man; Thanks For this Video 😍

    • @JesseShowalter
      @JesseShowalter  4 роки тому

      Thank you so much for the support, Chinmay 🤘 have a super day!

  • @BeerBarBeyond
    @BeerBarBeyond 4 роки тому +3

    Hey dude, what is that world clock extension or app you have installed that displays times on your menu bar

  • @achillemeyvis7890
    @achillemeyvis7890 4 роки тому +1

    Is there a possibility for you to for example have XD remember what you changed? Like if you where to switch on a toggle and move to another page and then return would that button be back to default or will it be in the on state? Is this possible. I would like to now because I want to to do a type of customisation in my app. Thanks you!

  • @CreativeWorkersBest
    @CreativeWorkersBest 4 роки тому +1

    I liked your video. Thank you I learn new one thing today👍👍👍

    • @JesseShowalter
      @JesseShowalter  4 роки тому

      Thank you so much, I’m so humbled and honored that I got to help you out!

    • @CreativeWorkersBest
      @CreativeWorkersBest 4 роки тому

      @@JesseShowalter I wait for your interesting Adobe XD videos

  • @JuanRojas956
    @JuanRojas956 3 роки тому

    Why doesn't my state animate? When I did the first example you showed the colors change suddenly without animation...

  • @njihyeon
    @njihyeon 4 роки тому +1

    Booooooooom! Thx a lot!!!!

  • @pninaws
    @pninaws 4 роки тому +1

    Tnx!!

  • @turkallarltd322
    @turkallarltd322 2 роки тому

    I think Im in love with ur beautifl Mind!

  • @JonneytheKidd
    @JonneytheKidd 2 роки тому

    Very good, thank you brother.

  • @_sp_sp
    @_sp_sp 4 роки тому

    game changer. Thank You!

  • @MrSipralexaify
    @MrSipralexaify 4 роки тому

    Which software do you use for screencasting without background on your webcam ? Thx

  • @tbtester3378
    @tbtester3378 4 роки тому +2

    "Let's dive in, let's get started, let's do it", let's anything else?

  • @akashpise289
    @akashpise289 4 роки тому

    Thanks Bro .. Its really amazing ,,, grate

  • @incacube
    @incacube 4 роки тому +2

    whaaaaaaaa... this is so cool

    • @JesseShowalter
      @JesseShowalter  4 роки тому

      Thanks so much, Berkay! I had a blast making it for you all!! 🤘

  • @cricricri_ina
    @cricricri_ina 4 роки тому

    Hi Jesse! I do it that but when i try to export and see the prototype in my mobile doesn't work. Don't have a hover effect (yes in my laptop). What is the reason for that? Thanks

  • @mikeormoab
    @mikeormoab 4 роки тому +1

    Kind of a different question perhaps, that maybe you may not be able to answer but I figure I ask anyway since I feel like a designer would know this more than anyone. I am also a graphic designer (and photographer) and I'm looking to purchase a good/color accurate monitor and was wondering if you had any suggestions? I'm asking because every video I see online regarding these types of monitors usually range around 1000-1500$ lol, I was wondering if you know of any other alternatives perhaps? Thank you so much for your help!

    • @JesseShowalter
      @JesseShowalter  4 роки тому

      A really nice monitor is gonna cost you... sorry

  • @rochakworks4066
    @rochakworks4066 4 роки тому +1

    Jesse, hi jesse, do we similar function in sketch? as i dont wanna multiple artboard for one animation

  • @jsr4276
    @jsr4276 3 роки тому

    amazing

  • @Avm371998
    @Avm371998 4 роки тому

    But can you have like another button showing when hovering over something and then make that button that shows up do something...?

  • @strugglingElds
    @strugglingElds 4 роки тому

    love this simple tutorial. new subscriber here! create more mate!

  • @meenakshirajput5146
    @meenakshirajput5146 4 роки тому

    wow this is too good, I tried it and it looks amazing....but if we want to have an animation with this same feature, let's say a revolving sun with time trigger so will it be possible ?

  • @davidglabais4919
    @davidglabais4919 4 роки тому

    Hi Jesse, is it possible to use a button, text or toggle to interact with another component's new state on the same art board? I'd like to use hover for instance over a text link which would trigger a new state from a different component on the same art board? Like a java script rollover?

  • @oscarmosh
    @oscarmosh 2 роки тому

    Great, now use the button at least 20 times, and have fun changing the content in the instance hover state.

  • @ivan_vecerek
    @ivan_vecerek 3 роки тому +1

    Awesome video!!!!!!! :D

  • @chocobala2536
    @chocobala2536 4 роки тому +1

    Thanks jesse

    • @JesseShowalter
      @JesseShowalter  4 роки тому

      Thank you, Choco!! Have a good day bro 🤘

  • @Yas-lu9nu
    @Yas-lu9nu 4 роки тому

    heeey i like your videos.thank you!!!
    i have a question.can i have 2 hovers in one component?

  • @swordandsorcerergaming
    @swordandsorcerergaming 3 роки тому +1

    What's the lunchbox in the bg? Thank you!

  • @kavineesh12
    @kavineesh12 4 роки тому

    Need this in Figma..

  • @luman1109
    @luman1109 4 роки тому +1

    ✌✊new✌✊ feature

  • @OmegaATaylor
    @OmegaATaylor 4 роки тому

    Jesse, question. Im trying to create a hover drop down menu that when you then hover your mouse over the newly animated menu each of the menu items has a dot appear next to it. Sort of a hover state within a hover state. It has not been working out for me. Only the original dropdown menu seems to work with the dots not appearing. Any advice?

    • @rrmcintyre21
      @rrmcintyre21 4 роки тому

      I'm not that this is possible yet. I saw a question like this on the adobe request page (Nested hovers). Everyone seemed pretty stumped.

    • @JesseShowalter
      @JesseShowalter  4 роки тому

      not nested hovers but nested states are possible. I'm putting together a video now

    • @rrmcintyre21
      @rrmcintyre21 4 роки тому +1

      @@JesseShowalter Awesome please let me know when it is released!

    • @JesseShowalter
      @JesseShowalter  4 роки тому

      Stay tuned!

  • @kipuchino
    @kipuchino 4 роки тому +1

    Looks like they are finally trying to catch up to Axure.

    • @JesseShowalter
      @JesseShowalter  4 роки тому

      I’m not a big fan of Axure but to each his own

    • @kipuchino
      @kipuchino 4 роки тому

      @@JesseShowalter Yeah same, but it's been the only one so far that has true interactivity. I'm very excited about this. Much prefer using xd.

  • @LilyBrand12345
    @LilyBrand12345 4 роки тому +2

    I'm sorry Figma, but the temptation to switch is too strong 😅😅

  • @roter13
    @roter13 4 роки тому

    Can you take figma files and bring them into XD?

  • @The.spiritual.sailor
    @The.spiritual.sailor 4 роки тому +1

    You are a bit late buddy 😅 but this feature is really cool 😀 thanks for sharing 🙏🏻

    • @JesseShowalter
      @JesseShowalter  4 роки тому

      Thanks for the feedback, have a great day, Deepak! 🤘

  • @viswa6126
    @viswa6126 4 роки тому +1

    Tx

  • @nithinbabunaidu5565
    @nithinbabunaidu5565 3 роки тому

    How do you export that hover effect stuff

  • @I_Lemaire
    @I_Lemaire 4 роки тому +1

    Amazing!

  • @wensihu8356
    @wensihu8356 3 роки тому

    Can i do this in figma?

  • @Ajaykumar-ky6mv
    @Ajaykumar-ky6mv 4 роки тому +1

    Sir how can download XD software free
    Please share me link

  • @firasalsghier3944
    @firasalsghier3944 4 роки тому +2

    Jesse please can you make tutorial about jquery please I need this tutorial don’t ignore my comment

    • @JesseShowalter
      @JesseShowalter  4 роки тому +1

      Thanks so much for the suggestion, stay tuned, so much more in the works! Have a great day 🤘

    • @firasalsghier3944
      @firasalsghier3944 4 роки тому

      @@JesseShowalter Thanks so much for your reply jesse All my respect to you Have a great life

  • @bryancngan9268
    @bryancngan9268 4 роки тому +1

    I WILL BE SELFISH AND NOT TELLING THIS TO EVERYONE I KNOW
    AND STILL MAKING XD THE OLD WAYS\