Highlighted

Working with Shadows in "New Components" vs. "Old Symbols" (XD19, April/May 2019 Release)

Community Beginner ,
May 14, 2019

Copy link to clipboard

Copied

With the new April/May release from yesterday, I run into some issues with Adobe XD 19 when using shadows. With the previous versions of Adobe XD, the shadow of symbols wasn't considered into the size of "Symbols", whereas, the new "Component" architecture with "Master Components", Adobe XD 19 adds the shadow space measurement into the component (see screenshot below). Is this a bug which needs to be fixed, or, is it a feature to accept? In case it is a feature, is there any tutorial out there which explains how to use shadows inside the new component architecture that exceeds inner borders? Please notice: this issue also affects alignment issues, because usually, I don't want to align other elements on the artboard to the shadow of a component.

Thank you for your help,

Sebastian

xd19-april_may_release-components_with_shadow.png

Thank you, everyone for your feedback. Please post your suggestion on Adobe XD Feedback : Feature Requests & Bugs

Meanwhile, the team is investigating changes to this feature similar to the suggestions here.

Thanks,

Preran

Views

1.6K

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

Working with Shadows in "New Components" vs. "Old Symbols" (XD19, April/May 2019 Release)

Community Beginner ,
May 14, 2019

Copy link to clipboard

Copied

With the new April/May release from yesterday, I run into some issues with Adobe XD 19 when using shadows. With the previous versions of Adobe XD, the shadow of symbols wasn't considered into the size of "Symbols", whereas, the new "Component" architecture with "Master Components", Adobe XD 19 adds the shadow space measurement into the component (see screenshot below). Is this a bug which needs to be fixed, or, is it a feature to accept? In case it is a feature, is there any tutorial out there which explains how to use shadows inside the new component architecture that exceeds inner borders? Please notice: this issue also affects alignment issues, because usually, I don't want to align other elements on the artboard to the shadow of a component.

Thank you for your help,

Sebastian

xd19-april_may_release-components_with_shadow.png

Thank you, everyone for your feedback. Please post your suggestion on Adobe XD Feedback : Feature Requests & Bugs

Meanwhile, the team is investigating changes to this feature similar to the suggestions here.

Thanks,

Preran

Views

1.6K

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
May 14, 2019 4
Community Beginner ,
May 14, 2019

Copy link to clipboard

Copied

+1 here. Additionally, if you remove the shadow, the dimensions stay the same. The one on the right had the same properties, but I simply removed the shadow completely after creating the component. The box stays the same, even though I'm editing the master.

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
Reply
Loading...
May 14, 2019 2
Community Beginner ,
May 14, 2019

Copy link to clipboard

Copied

@radekj ... Yep, experienced that, too.

A possible solution: It would be great if a flag (maybe a checkbox) could be placed somewhere which provides two options: "Yes" and "No" for "Consider shadow in layout". But at first, let's see what Adobe XD staff thinks about it. Maybe that change is somewhat intentional, or, there is a work-around for it  ... e.g. shown in a tutorial somewhere. Thanks

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
Reply
Loading...
May 14, 2019 1
Community Beginner ,
May 14, 2019

Copy link to clipboard

Copied

An "Include shadows in dimensions" checkbox, set to off by default, would be useful. But to be honest I don't see the reason why the objects with shadows are treated differently in the first place?

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
Reply
Loading...
May 14, 2019 2
Community Beginner ,
May 14, 2019

Copy link to clipboard

Copied

For the moment, I have to stop working on my current Design System, because, even the Master Component doesn't resize the way I expected it from Symbols previously. Probably also, I have to revert back to Adobe XD 18. Shouldn't have saved the XD file with Adobe XD 19 ... damn. Unfortunatelly, this update took me a day from being productive. Hopefully, some explainations or bugfixes will be available soon

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
Reply
Loading...
May 14, 2019 1
Adobe Employee ,
May 14, 2019

Copy link to clipboard

Copied

Sharing the response I received from the team, "This is deliberate behavior because component bounds are now explicit. Anything outside the bounds will be clipped, similar to artboard clipping."

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
Reply
Loading...
May 14, 2019 1
Explorer ,
May 16, 2019

Copy link to clipboard

Copied

If this is a deliberate thing, I need to understand how is that going to work out guys... I've like a million components now that need to be updated, NOT just the shadow, but the actual size of the background in it.

I cannot use the general component transform for that, as the rest of the components inside of it need to maintain their positions, is just the background that needs to change. So If I modify the actual background, it just gets clipped, I need to unmerge that component and recreate it as a new master for it to get a new size. Same as with the shadows. Is there a workaround this? Like, why doesn't the master updates his size every time it gets changed? why does it has to be forcedly maintained?

2019-05-16_19-44-15.gif

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
Reply
Loading...
May 16, 2019 0
New Here ,
May 20, 2019

Copy link to clipboard

Copied

I do not understand why that 'deliberate' decision was made. I truly think that you should not clip overflowing elements. There are many cases you can use this function. One quick example I can think of is backdrop of a modal. Please reconsider this decision.

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
Reply
Loading...
May 20, 2019 2
Adobe Community Professional ,
May 15, 2019

Copy link to clipboard

Copied

Similarly, if you want to add shadow to a component, you can't, because the bounding box will clip the shadow

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
Reply
Loading...
May 15, 2019 1
Community Beginner ,
May 15, 2019

Copy link to clipboard

Copied

You just beat me to it

The steps to replicate the issue:

1. Create a box,

2. Convert it to a component,

3. Double click to edit the box

4. Add shadow to it

5. Deselect the whole component

The shadow DOES NOT show up at all because it's clipped by the component outline.

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
Reply
Loading...
May 15, 2019 1
Community Beginner ,
May 14, 2019

Copy link to clipboard

Copied

Same problem here. I will not be able to use components for site headers if the shadows are clipped from my components. An option to show shadows outside of the bounds would be very useful. I have also had to delete components because of the sizing issues when you delete a shadow and the sizing does not adjust.

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
Reply
Loading...
May 14, 2019 1
Adobe Employee ,
May 14, 2019

Copy link to clipboard

Copied

Thank you, everyone for your feedback. Please post your suggestion on Adobe XD Feedback : Feature Requests & Bugs

Meanwhile, the team is investigating changes to this feature similar to the suggestions here.

Thanks,

Preran

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
Reply
Loading...
May 14, 2019 0
Community Beginner ,
May 15, 2019

Copy link to clipboard

Copied

Dear Preran, could you please provide a quick (video) tutorial (from one of your XD Evangelists) which covers the differences between symbols and components? This is a huge change in regards to layout alignments and XD handling. Even the editing of Master Components behave strange, because with former Symbols, everything was simply some sort of a "Master Component", and in addition, I was able to edit it inside of nested symbols (in my case: up to three to 5 levels deep). Now, when I'm trying to edit Master Components, strangely, they pop up somewhere outside lost in space. As mentioned, I shouldn't have saved my current Design System with Adobe XD 19 as I can't go back to XD 18 ... which is frustrating. So I'm kind of blocked to continue working on my current Design System with XD 19, and, I am forced to write posts into this Adobe Forum, which shouldn't be part of my business.

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
Reply
Loading...
May 15, 2019 0
New Here ,
Jun 20, 2019

Copy link to clipboard

Copied

I agree. This is horrible when aligning my navigation bar components that use shadows.

It would be great if you could find away to still show the shadow outside the bounding box while the dimensions still stay the same as it was before the April Release.

This is causing havoc with the large amounts of components/designs that I need to update and/or create.

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
Reply
Loading...
Jun 20, 2019 0
Community Beginner ,
May 15, 2019

Copy link to clipboard

Copied

One more note on the topic.

When you export via "Share for development" option, you can select the actual object (and that's good) but still get a bogus group where the shadow is/was:

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
Reply
Loading...
May 15, 2019 0
Community Beginner ,
May 15, 2019

Copy link to clipboard

Copied

Dear Radekj, thank you for your addition. In this current company, we are not allowed to use any cloud functionalities, so, I can't verify your steps, but I bet, this wouldn't solve anything for the moment. So for now, I have to solve the issues in my current Design System that have been caused by the Adobe XD 19 update. What a funny fun!

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
Reply
Loading...
May 15, 2019 0
New Here ,
May 20, 2019

Copy link to clipboard

Copied

This just make the component basically unusable, I have absolutely no idea at all how to change the size of the "master" component as I intend.

And when using a component with shadow, I have to measure the margin every time and some times still cannot align them correctly.

Can someone give an explanation about the benefit of having “explicit bounds”? because honestly, I see none at all.

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
Reply
Loading...
May 20, 2019 4
Community Beginner ,
May 21, 2019

Copy link to clipboard

Copied

So the current build now seems to include shadows in the size of the component. Please give us an option to ignore shadow sizes while still being able to see them. This is how objects work in html. Why would this be any different?

None of my components snap to the grid or guides properly now. This is unusable.

Solution: Just give us a option that says "Ignore shadows" when I select a component with a shadow. Done!

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
Reply
Loading...
May 21, 2019 3