Holy crap, my progress indicator demo task has gone from impossible-feeling to easy-peasy. Thanks Dansky!
@ForeverDansky Жыл бұрын
Aha awesome! Glad to hear it Rob 😊👊
@amandeepkaur-pq1bn2 жыл бұрын
'Superb' it is so easy I always ran away from tutorials but you make learning so easy :)
@coderarcher71224 жыл бұрын
I experimented on my own and it worked!! I'm very happy as this is my first ever animation made on XD! I created shorter segments, taking time, and it was cool!
@ForeverDansky4 жыл бұрын
Awesome! 😎
@Eren891643 жыл бұрын
That was amazing 👍, love from India❤️
@Chreative4274 жыл бұрын
Thank you! I'm working on a thermometer mockup and this came at a perfect time
@ForeverDansky4 жыл бұрын
Aha awesome! Glad it's helpful Chreative 😃
@realmeraj36814 жыл бұрын
This is my First animated making video seeing....so great
@angelovergara4 жыл бұрын
This is so awesome! I would've never have figured this out on my own. Thank you!
@ForeverDansky2 жыл бұрын
Happy to help Angelo!
@rafsan_1.6183 жыл бұрын
You don't have to make different components, Just increase the Dash size in the next artboard.
@TheMikenart2 жыл бұрын
Thanks for this!
@rafsan_1.6182 жыл бұрын
@@TheMikenart You're welcome.
@FLOWTUTS4 жыл бұрын
Ohh that's really cool ❤ this inspired me to do a tutorial on it in after effects 😊
@santhoshsoftware3 жыл бұрын
thats awesome Dan!!!
@ayo104 жыл бұрын
Thank you for this @Dansky. This just saved me a ton of time
@charlesmoses77244 жыл бұрын
Clear and precise. Congratulations, you just made a new subscriber.
@theanecdotist98533 жыл бұрын
Thank you so much, my guy! This was so helpful. You've 'earned' a new subscriber today.
@arkoprabhobhattacharjee75474 жыл бұрын
You, sir, are very kind! What a brilliant, easy-to-follow tutorial! :)
@lydiawere4 жыл бұрын
thank you so much Dansky, this tutorial jus made my day.
@ahmadkhudai3 жыл бұрын
Thank you
@ForeverDansky3 жыл бұрын
You're welcome Ahmad!
@Alex-np5dx2 жыл бұрын
10 out of 10 marks🤩🤩🤩
@wahidislamjoy91743 жыл бұрын
nice presentation sir
@Anonymous-cb6by4 жыл бұрын
thanks sir i am a developer i am working on a project and it helped me a lot for creating a completing progress bar😊❤
@ameyabuty23153 жыл бұрын
Thanks, it helped me a lot
@uxninjaa4 жыл бұрын
Great trick!
@aimiliosdiakakis29324 жыл бұрын
Very good tutorial!
@avrahamnacher32234 жыл бұрын
Great stuff! Keep it up
@ForeverDansky4 жыл бұрын
Thanks, will do Avraham!
@Carcass255CZ Жыл бұрын
Thank you. Is it possible do this animations in one artboard?
@md.rahimuddin50574 жыл бұрын
Thank you sir.😍 It's perfect for me.
@mrag7923 жыл бұрын
you fulfill my dreams :) thank you very very much
@adreyy97644 жыл бұрын
I'm new here and I have one thing to say: I've seen no person but you who looks like a designer that much. I love your videos!
@ForeverDansky4 жыл бұрын
Thanks so much 😊
@mehdionline13 жыл бұрын
thanks
@fnonaka4 жыл бұрын
OMG I never imagined to create a ring like that! I used to substract forms + using the pen tool wtf a lot of work! Now, how to do this animation with a "ring" with gradient?
@viethahoang24094 жыл бұрын
this is so smart... why didn't I think of this before :o
@1raskumar4 жыл бұрын
thank you!
@AhmedKhaled-ey2is3 жыл бұрын
thank you
@GeGe-gg3zt4 жыл бұрын
Thanks!
@eguchiyuuki Жыл бұрын
Great
@sarajones8337 Жыл бұрын
This is a great video! Could you auto-animate the progress bar to a scrolling text? I assume you would link to the scrolling box instead of the artboard, right?
@mohdshahnawazalam92214 жыл бұрын
superb
@SemageNamalSurendra4 жыл бұрын
Excellent 😘
@neutillius3 жыл бұрын
May I ask ? Where is the gradient look you've put in cover thumbler of this video.
@ForeverDansky3 жыл бұрын
I create the thumbnails in Photoshop, and the effect is mostly solid pink for the rings, with a feathered white brush on one end of the progress bar.
@neutillius3 жыл бұрын
@@ForeverDansky tahnks for reply. I'ld like to know any available videos of you includes progres bar ring animated with the gradient end.
@Bontelucci2 жыл бұрын
Hi there Dansky, How do we export this for developers? Best way/practice? Thanks so much!
@jordydejong29604 жыл бұрын
Great tutorial as always! One question: is it possible that the colour gradually changes as the progress bar fills up?
@ForeverDansky4 жыл бұрын
Hey Jordy, thanks so much! Yes you can change the colour and sometimes get away with it happening during the animation, although sometimes it stands out and is a bit too noticeable. Hopefully colours graduating during an animation is something the XD team will consider adding in future 😋
@harshkadyan-themanager26882 жыл бұрын
actually transforming complete colours is not possible, but you can use a gradients, with multiple colours
@kasra103 жыл бұрын
very nice thanks:))))))))))
@ForeverDansky3 жыл бұрын
Thank you! Cheers!
@ulvinomarov4 жыл бұрын
Dansky, I think u have to new and cool letter D for ur logo)))) The current is so simple)
@Favoxhille4 жыл бұрын
Wouldn't be the same to create states in which the ellipse has different dash/gap settings instead of duplicating the ellipse component over and over?
@vigneshraja2164 жыл бұрын
Awesome
@raveer124 жыл бұрын
Hey Dansky , Last step before prototyping, selecting all component and rotation i am giving 0, I can't select 0 in the rotation. Is it for Mac only, i have window only not mac?
@MrOngtrum14 жыл бұрын
how to make Sprite Sheets look like this Adobe Flash CC ?? please tell me !!!! because i think Adobe XD with very much Art Board is very tight document not good i love Sprite Sheets
@ceruleandream9724 жыл бұрын
Hi I had a question! What do you do if you want the bar to start from 0? Like blank
@vanhellsingniko85804 жыл бұрын
Really cool but i can't press "0" when all component are selected... I have to do this on each segment...
@Banzaiiable4 жыл бұрын
Hey ! If you haven't figured it out yet, set the rotation to any number but 0. Once the rotation is the same for all the instances, you can then set a 0 degree rotation for all components.
@jnsaba55514 жыл бұрын
Hey mate, on the last step before the prototyping phase I can't select 0 in the rotation, it just won't let me :(
@chaitanyakrishna70694 жыл бұрын
Was facing the same issue. Last resort, go to every segment and make the rotation zero. Collectively its not happening for me too.
@jermelpierre19943 жыл бұрын
Do you have to rotate if you are using a hexagon instead of a circle?
@esk2k53 жыл бұрын
could this be done with a clock/timer, starting on 12, with the hand going round and as it does a solid colour follows the hand around to 12
@samuxui3 жыл бұрын
Please reproduce this effect in a rectangle, I am not getting the same result. A big hug!
@moseskarunia4 жыл бұрын
Hi mate, how do you cast your inner shadow? Afaik it's not possible unless I do some ugly hack.
@ForeverDansky4 жыл бұрын
Hey Moses, there isn't a native inner shadow option in XD just yet. I've got a video covering the neumorphism design style going up either this week or next, but in the meantime here's another tutorial that may be useful kzbin.info/www/bejne/pl7Gl2RvnLqrr5Y
@rauldanielfloresa4 жыл бұрын
Hey thanks a lot! I have a question on the background gray that you have as part of your setup, What did you used to make is to soft? Looks very nice
@UnknownUser-re6yg3 жыл бұрын
It's called neomorphism design. Look it up
@SukiiHon4 жыл бұрын
super useful! how can we use this for a shape other than a circle (ex. rounded square box)?
@hillzdoe4 жыл бұрын
Yaaay!!! I'm early notification squad where you at? Great video once again Dansky!!!
@ForeverDansky4 жыл бұрын
Hillary Lakeman BOOM early squad! Thanks Hillary 👊
@hillzdoe4 жыл бұрын
@@ForeverDansky ayyee!!! All the love from JAMAICA 🇯🇲🇯🇲
@andycreatives2 жыл бұрын
how can I loop the animation without retracting? the loop goes on in a circular loop?
@fahadsheikh15134 жыл бұрын
You are great budy! your face is same to same my big brother duplicate 😃
@ForeverDansky4 жыл бұрын
fahad sheikh Haha thanks 😂
@fahadsheikh15134 жыл бұрын
@@ForeverDansky hahaha every time i watching you i remember my brother his name is waqas he is working in dubai 😃
@chimed664 жыл бұрын
Is it possible to animate with a mask included within the component?
@Mo-kq4er3 жыл бұрын
Is there a way we can do this but with a gradient?
@vincybadman8714 жыл бұрын
Why didn't you use the actually dash properties to animate instead of multiple individual circles?
@GeGe-gg3zt4 жыл бұрын
i have the same question -)
@akshaycreation4 жыл бұрын
Any solution for gradient border in XD
@SquaredbyX4 жыл бұрын
Instead of duplicating complete art boards, you duplicate the first set over so they keep the same names.
@jigarparmar35974 жыл бұрын
Can you show a tutorial using a rectangle?
@taimoorkhanvlogs4 жыл бұрын
Please please make tutorial of How to Create skeumorphism design plz
@laizamlathyf56314 жыл бұрын
how can you make the progress bar gradient?
@suburbanview3 жыл бұрын
So after u have fun with XD, what it takes to make it a real website? Let me guess. If u used DW you need to do all over again the process to connect the dots. Or hire a web developer to do the job. Unless you are not the average joe and know html or java.
@aeeweb64643 жыл бұрын
How export it and use it in html css files ?
@beeyoch3 жыл бұрын
nice tattoo yo
@bradeaton34284 жыл бұрын
Could you do this with multiple circles loading at the same time within the same artboard?
@fractalelement8574 жыл бұрын
1:32 what do you mean by press return ?
@MateusHenrique-ne5el4 жыл бұрын
Manooooooooooooo, tu e foda
@vasekcz4 жыл бұрын
I gave 1000 like!!!
@agustincastro58134 жыл бұрын
do you know how to put ths on android studio?
@nikyabodigital4 жыл бұрын
cant u just animate this by increasing Dash value instead of copy pasting component like what you did here?
@The00sk004 жыл бұрын
Adobe please add remove anchor point tool in the adobe xd without shape close
@ForeverDansky4 жыл бұрын
👍
@ivelina_vk4 жыл бұрын
You can do that by using Option + Del :)
@elias1410e3 жыл бұрын
Suena chistoso con el XD XD
@JulianStiber3 жыл бұрын
Thanks, but I guess this Video is obsolete now with the last xD Update 😉
@Whitepillednazarene3 жыл бұрын
anybody know how to make this a loading bar in html/css?
@AmpedUpTech3 жыл бұрын
Can you teach us how to create an intro animation like you. Thanks. 🙂
@snap-n-shoot2 жыл бұрын
its supposed to be a wireframing app I thought
@naina90jaiswal4 жыл бұрын
i have followed excatly what youve done... why doesnt my auto animate do the same thing ...
@naina90jaiswal4 жыл бұрын
Instead of loading in a flow... it just appears in a fade in effect
@ForeverDansky4 жыл бұрын
Hey Naina, that issue usually means there's a problem with the layers, in particular the names might not match between artboards, or perhaps one artboard has the layers grouped, and one doesn't.
@dragerstudio3 жыл бұрын
I know this I'm already macked in Android alight Motion
@margoumix4 жыл бұрын
Will be Nice if transformed to code :)
@fahadshakoor94513 жыл бұрын
any programmer watching?? is it hard to code?
@SPGraphics_channel3 жыл бұрын
Why made so many components, instead of just duplicate the artboard, put dash initial and final on both the components and auto animate the artboard
@dharmatreasure29194 жыл бұрын
🎩 😁 👕👍Great! 👖
@ForeverDansky4 жыл бұрын
M T M Nice! A+
@digikalaakaar4 жыл бұрын
मैं यह ट्यूटोरियल हिंदी में करता हूं
@thatguywhoplayschess52834 жыл бұрын
Hating Adobe XD right now. It's so hard to come up with this kind of solution, as auto-animate is so poorly developed. This is such a counter intuitive and complex way to do such a simple task... Adobe XD should give the user a wider range of ways to animate stuff, not just "try to guess" with auto-animate. Moreover, with auto-animate the result is just the same of transition too often. The funny part is that Adobe XD is made to design UX, and itself has such a bad UX design.
@maxpower93934 жыл бұрын
Neomorphism or What you Call it... is pretty Weird and super low contrast. IMO it is useless in real applications
@moseskarunia4 жыл бұрын
The key is don't overdo it. Like this progress bar. You actually don't need the "gutter" that much, because the actual "bar" is already eye catching enough. The "gutter" is just a nice touch
@mayabitar13162 жыл бұрын
I thought it was figma man 😂
@elpibebasado70683 жыл бұрын
XD
@dynamichorse97792 жыл бұрын
Too much acrobatics for a small animation, XD has to grow fast with animations