Creating add to cart button with 2 functions

Report · Aug 19, 2023

Hi all,

Am new to Adobe XD and am working on creating an add to cart button. So far I have set it up as a component with multiple states 1-10 that move up and down when the + or - buttons are clicked. But I also want the button to funtion so that a prompt temporarily appears saying its being added to the cart. I know that its potentially not possible for 2 different types of animations to be happening on the same page? I tried to create a new "artboard" (I dont know what they call it in XD) and make that the frame that the promt transitions to but when I tested it the + and - functionality didn't work.

I want "Add to cart" to appear each time + or - is clicked.

These are the states I've set up for the button

Report · Aug 20, 2023

Hi @Eva9604, I think I'd do it this way, let's say the number is 1:
- Click the button, with tap trigger number changes to 2,
- While the number is two, with time trigger, the artboard changes to an artboard that has "added to cart" popup/prompt appears.

- Again with another time trigger, artboard changes to the another art board with number 2 (that doesn't have a time trigger)

I know it's not very practical since you need to use 3 artboards for each state but that's the only way I can think of now. If I come up with another idea, I'll update you, and would like to be updated by you if you find another way. Hope this gives you an idea to explore!