Adobe XD Interactions with Auto Animate

Helloz friends,

A very quick interaction design done in Adobe XD.
I love XD now! Thanks, Adobe Team

So, this is gonna be first shot using Adobe XD with it feature Auto Animate. Once you figure out the logic in it, it’s gonna be crazy and ease of use. No other tools have been used for this shot just XD.

I’ve been working on this past 2-3 days to learn properly, worked on wallet dashboard to use the auto animate feature.

Process:
Day1
- Created low fidelity designs with the concept of the wallet.
- Grabbed some reference from dribbble to rectified the idea of the auto animate feature.
Day2
- Created the style guide for the dashboard (i.e colors, font style, symbols)
- Started high fidelity designs with keep in mind that using only auto animate features, what could be the best result.
Day3
- Started with auto animate feature
- Login
- Loading screens
- Dashboard first-time user experience
- Animating numbers, graphs
- Menu icon effects
- Signing off screens
Day4
- Final files to make a video and cover page for the contest.

Advantages:
- XD gives the ability to upload an image/vector from any software like Illustrator/photoshop.
- Iconography importing from illustrator to XD is such easy to use.

Good to have it future updates
- Hover states could be very helpful for CTA’s for dashboard or web applications
- Embed Videos, I wanted to add some 3D rotation to the hand that would be triggered by the text content changing.

I wish XD gives us update on Hover states as well.

Hope you like it!
Cheers