Adobe XD Tutorial | Understanding Auto-Animate to create UI Interactions

[@syednaveedsarfaraz9637]

finally my problem solved thankx subscribed

[@sravanicherry9357]

thank you

[@lolprohighlights1629]

Where to find "time" trigger animation because in newest version of adobe XD i can't?

[@manojgaonkar7375]

i Subscribed just from his beginning voice lol

[@adrianthomas4163]

If you want to follow along with the specific UI kit in this video. Said kit is called "Social Meetup" by Aurélien Salomon.

[@DesignPilot]

Yup. That's right 🤘

[@CelliosGamesCG]

I dont know why, but when i want to select the option ''time'' but i dont see it anywhere in the menu. I copied exactly what you did with all the page's

[@CelliosGamesCG]

Guy, that just liked my comment. I got the solution! Click on the title of the document and then select the time option, this is the only way the function time is usable

[@hishamelyas]

@@CelliosGamesCG Hey thanks man.. I actually came here for the time option and i was like damn where is it.. but you saved me lol .. Thank you soo much!

[@CelliosGamesCG]

Hisham Elyas no problem man, i know the struggle when nobody got the answer. If I helped myself why would’nt I help others :)

[@ygalaxyworld]

Hey i cant find it:(

[@CelliosGames]

@@ygalaxyworld i think they updated it, so it works a little bit different. I havn’t used XD in a bit so maybe a google search could help

[@darshandakshapanchal2051]

Thank you brother

[@DesignPilot]

👌

[@niloofar156]

Very helpful, thank you

[@DesignPilot]

😁

[@vtshreeram]

Super cool video. But i have a doubt, how to convert the interaction animation into code (for a developer to integrate it inside the app)

[@DesignPilot]

Your dev had to manually code it. XD is only to show him how the output should look

[@vtshreeram]

@@DesignPilot how does the developer understand it? can you make some videos for that as well. Thanks a ton

[@Herteddy]

@@vtshreeram "Yaha ye phas gaya youtuber" 😅

[@ashoornable]

@@vtshreeram hi. in order to hand off the right way to your developer, you need to give a file that includes the interaction that can be easily rendered on an html. I see a simple way to do this is to make the interaction using After effects and then converting that to a Lottie. you can then tell the developer the trigger points for the interaction. on click -> play this animation . on hover-> play this animation. Or you can even try exploring options like -> framer (these are little complex to start with) hope this helps :)

[@wizard9389]

How to use as it is android studio ???

[@davidchriss9618]

I Have a question bro can you help me if you don mind? I have a video WordPress site where I post videos but most video are embeded not uploaded from the site I would like to create an App with Adobe XD and connect to my site and when I post a video I would like a video to be posted too in the App with the App format not the Web format. Is that Possible brother?

[@DesignPilot]

Nope

[@maheenanwar6351]

amazing

[@mayarelhady1522]

I did all the steps but the circles pop quickly it isn't smoothly growing as yours, will you tell me why?

[@hishamelyas]

Great content! Helped a lot! Thanks!

[@felipecampos6977]

Thanks for tutorial. Do you have that file available to download ?

[@hanikhan5112]

awesome ..helpful

[@millyattree822]

in my adobe xd there is no time trigger what to do now ?

[@DesignPilot]

It must be there. Please check

[@millyattree822]

@@DesignPilot yes got it by clicking on title

[@marianaalen7828]

@@millyattree822 i cant find it also, only tap, drag, voice and keyboard

[@sneaky6250]

@@marianaalen7828 try getting the latest version

[@amiselkis]

Same problem over here

[@ibrahimaboel3nin425]

It's amazing vedio . thank you ❤️

[@DesignPilot]

😬

[@mdjahin99]

helpful conceptually

[@DesignPilot]

Thanks Man

[@Dzineloop]

Very helpful video..

[@DesignPilot]

Thank you

[@HeavyRiven]

well that was good

[@DesignPilot]

Thanks Man

[@CreateTVT]

in my Adobe XD i cant find the "Time" trigger , how can i get a solution for this?

[@najeestowers1390]

did you ever find it

[@CreateTVT]

@@najeestowers1390 still not yet😔😔

[@DesignPilot]

It’s a very old KZbin video. XD has done a lot of Ui changes

[@nadhifulqolby4803]

This destination its gonna be this keyboard XD

[@TimandLauren]

hey design, thanks for telling me about figma man, i have just been researching more about UI design programs like figma and adobe xd couldn't you create each circle layer on adobe xd, have it sent over to AE and then animate each circle in after effects like you did here as well? was this video more so developing UI interactions for mobile apps?

[@newtonheath92]

Great video, thanks. One question though, how can we export this auto-animation to video or gif?

[@nadimakhter383]

You need to screen record. As far I now

[@atefalsayed2555]

Please need image

[@samsonite3716]

"audiojungle" :D

[@kemasauliahaldi9520]

Why you not create from 0? For us learning from you

[@maggsvamp]

why is your voice have echo?

[@cantona70]

No more coffee for you.

[@DesignPilot]

Why not?

[@lilcleo001]

🤘

[@DesignPilot]

🎉🎉🎉

[@niekdekker557]

So ive view things to point out, i watched your whole things 3 times but cant procceed any futher, i dont know how to make new draw pannels, i sometimes cant change the animation tyope from tap to time without explanations, so many issues that arent explained. How is it that i keep running into this problems and nowhere on the internet people explaining them its just ratarted. I use adobe illustrator and indesign as a graphic designer and find these programs easy to use, and can easily find solutions for surten problems, but all i run in here is people advertising there own work 90% of the time wich is disgusting btw and I still dont know how to fucking import an illustrator file, and why the distances for iphone are different on illustrator then on xd. I just dont understand pls remember this for your next toturial would be nice, sorry for my language and english, not my main language

[@akashcnakod1017]

To change from tap to time you have to select whole panel not just icon/symbol.

[@Tresyy1579]

thank you bro.....u know ! u speak too fast u can be a good raper lol

[@calyx2142]

XD

[@laceincission88]

Please use your natural accent, you surely must have one :). This is quite off-putting actually.

[@DesignPilot]

😂

[@brewsterthegreat4737]

You’re off putting

[@moajmasti416]

Bad video this time 🤔

[@DesignPilot]

Look at the views and likes. They say a different thing 🤣🤣🤣 Also its a very old video

[@moajmasti416]

@@DesignPilot but i think this and some more videos are very bad

[@DesignPilot]

That’s your perception

[@bigbailey1489]

@@moajmasti416 this video explains what the triggers do and easing do, i found it very useful, great vid Pilot

[@rajneeshkumar5718]

Is this your real accent???? Please explain in your real voice

[@nvaishno]

Don't fake accent. Turn down for Views

[@DesignPilot]

I have more than 3 Million views 😝

[@nvaishno]

@@DesignPilot Good for you

[@bahsak6517]

bad