How To create components without changing artboard layer order

Community Beginner ,
Sep 23, 2020 Sep 23, 2020

Copy link to clipboard

Copied

Hello! I'm designing an interactive color index.

I have 6 rectangles in four colors, and the idea is to activate/deactivate these shapes by clicking the button that matches their color, and creating multiple color combinations by having more than one button activated at the same time.
My only problem is that the shapes must mantain their original layer order:

claraa21341977_0-1600891479803.png

the shapes are stacked in a way that makes it impossible to create a component for each color, because it would group all the shapes with the same color together, and compromise the order above.

I've tried making the whole thing a single component and prototyping each color inside it, but it didn't work.

is there a way to make this sistem work?

 

thanks!

 

Views

146

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct Answer

Adobe Community Professional , Sep 24, 2020 Sep 24, 2020
Hi Clara   If I understand correctly, you want to make it so that when you click the red circle for example, the 2 red squares disappear or appear. Right now one element's trigger can't affect another element or component's state or style on the same artboard. Since they are at a different "depth", the only way to do this right now would be to make a component encompassing all the elements on the page, or multiple artboards. In both cases, you will need to make one state or artboard for e...

Likes

Translate

Translate
Adobe Employee ,
Sep 24, 2020 Sep 24, 2020

Copy link to clipboard

Copied

Hi Clara,

 

Thanks for reaching out. I tried achieving similar animation and the approach that I took was to group the same color shapes individually and then making them a component. So if there are 4 colors(including no fill) then there will 4 components. Please try this approach and see if you are able to achieve it.

 

Let us know if you need any further assistance.

 

Regards

Rishabh

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Sep 24, 2020 Sep 24, 2020

Copy link to clipboard

Copied

LATEST

Hi Clara 🙂 

 

If I understand correctly, you want to make it so that when you click the red circle for example, the 2 red squares disappear or appear.

 

Right now one element's trigger can't affect another element or component's state or style on the same artboard.

 

Since they are at a different "depth", the only way to do this right now would be to make a component encompassing all the elements on the page, or multiple artboards. In both cases, you will need to make one state or artboard for each possible scenario (of which there will be like 36 or something), and wire them all up, which would be rather complicated. 

 

I would suggest just showing how it works with maybe 4 combinations, and the programmers will do the rest 🙂

 

Hopefully that brings more clarity.

 

Cheers!

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines