Sorry, the InVision Help Center does not support Internet Explorer. Please download Microsoft Edge or another modern browser.


InVision ambassador ambassador
Darran Morris

Artboards not exportable as assets in Sketch is a blocker

I cannot export any of my assets for my existing project Sketch files using Craft to InVision cloud. I always make assets exportable at the symbol Artboard level. Removing the ability to make artboards exportable to InVision means I will have to use another product to deliver assets for my clients. 

I thought this problem may have just been mine, but I read in this Knowledge Base article How do I enable asset download for layers within a symbol in Craft Sync?, 

From the article: "Currently, marking an entire artboard for export in Sketch will not generate assets in InVision Cloud (even if you re-sync the artboard)"

Exporting the symbol artboards allows me to maintain a standard size for all of my assets (for example, 24px x 24px icons) and this now seems impossible. 

  1. If I create a rectangle with no fill colour, Sketch exports the icon with just the visible portion (now my 24px square icon is 22px x 17px)
  2. Even if I create a slice, then InVision exports the asset including any backgrounds underneath the instance of the symbol (now my icon has part of a photo in the background instead of being transparent). 

Apart from these problems, retrofitting thousands of symbols in my past Sketch files to group elements, name those groups appropriately would be a huge time consuming (and loss-making) action. 

This post is associated with a known feature request: [[problemTicketSubject]]. Let our Product team know that you’re interested in this feature.

Sign in to add your vote

Thanks for taking the time to share your feedback about making our product better. We’ve let our Product team know that you’re interested in this feature so they can factor that into their product strategy.

comments

sort by

official comment

Laura Cunha
InVision ambassador Laura Cunha, InVision Employee , ambassador Edited
Comment actions Permalink

Hi Darran,

Thank you for taking the time to share your thoughts here in Community!

You’re spot on that marking an artboard as exportable will not generate assets. To have your assets visible in Inspect, you will indeed have to mark each individual layer/group as exportable within Sketch. The ability to create assets from exportable artboards is a potential feature request our Product team is currently monitoring interest levels for. I will go ahead and add your vote for this feature. Please keep an eye out for an email from our team formalising this vote!

As for the workarounds you’ve explored, unfortunately it does seem that you’re running into a couple of known limitations in the product:

  • Transparent layers used as padding are cropped out in the exported assets.
    This is based on how Sketch handles transparency when exporting directly from Sketch. The transparency in the layer group is identically cropped if you export the asset directly from Sketch rather than exporting from Inspect.
    That said, if the group is converted to a symbol and the export is set on the "Symbols" page, the expected dimensions (including the transparent area) will show in the generated assets.
  • Slices in Sketch marked for export include a background.
    At the moment, you’re also right to note that when setting a slice for export from within Sketch, the asset that is generated within Inspect includes the background colour, even when the option to include the background colour is disabled.

Our Product and Engineering teams have evaluated these two limitations based on factors including severity, impact, scale, and frequency. Given the cost required to address this bug, we have decided to allocate our resources to addressing other issues with a greater impact on our customers, and don't intend to fix these issues at this time. We’ll continue to monitor the prevalence and severity of this issue, and we will revisit this decision if the circumstances change.

These decisions are never easy to make, and I understand it may be frustrating to hear that we are not planning on fixing these issues at this time. We do our best to focus our resources where they'll have the greatest impact for the most customers, and we believe it’s important to be transparent when we’ve determined that a particular issue won’t be fixed for the time being.

Please let me know if you have any other questions!

Best,
Laura


Alex
InVision ambassador Alex , ambassador Edited
Comment actions Permalink

Hi Laura,

Like Darran, this is a huge functionality I'm lacking. I'm very curious to know how other designers address this issue when needing to export icons with transparent bounding boxes. 

Can you provide more information about the following sentence, possibly even a screenshot or two? I'm having a hard time understanding it.

"That said, if the group is converted to a symbol and the export is set on the "Symbols" page, the expected dimensions (including the transparent area) will show in the generated assets."

Thank you!
Alex

1

Shaina Torgerson
InVision ambassador Shaina Torgerson , ambassador
Comment actions Permalink

Hi Alex, 

Thanks for following up here. I'm happy to open a ticket on your behalf to add your support to the feature request mentioned above - to enable all artboard assets to be available for download within Inspect. Please keep an eye out for an email confirming that we're formally tracked your interest in this potential feature.

To clarify, here are some step-by-step instructions for the workaround Laura mentioned above. This will allow the background image to be exported from Inspect at full size: 

  1. In Sketch, convert the group into a symbol
  2. Export the symbol from the Symbols page
  3. Sync the symbol artboard
  4. In InVision Cloud, go to the symbol's screen and go to Inspect mode
  5. Download the asset. It should be the correct dimensions.

Please let me know if this makes more sense, or if you're still having issues given the steps above. 

Best,

Shaina

-1

Alex
InVision ambassador Alex , ambassador
Comment actions Permalink

Hi Shaina,

I'm still having trouble following these instructions. Is it possible to chat with someone about this?

Thanks,

Alex

0

Shaina Torgerson
InVision ambassador Shaina Torgerson , ambassador
Comment actions Permalink

Hi Alex,

I can absolutely connect you with somebody to talk about this more in detail. I will be opening a ticket on your behalf including the information here.

Please keep an eye out for an email from one of our Support agents soon. They will be able to shed some more light on this workaround and get you the details you're looking for. 

Thanks for your patience,

Shaina

0

Andrea Laas
InVision ambassador Andrea Laas , ambassador
Comment actions Permalink

Hi Shaina,

we are having the same issue and using workarounds is no solution for us. 

I checked older prototypes uploaded to Invision a year ago and it is possible to select the icon artboards and download them as svg. But it does not work in new prototyps with the same components.

We absolutely need this feature without having to rework every icon and every component we use. Please bring this feature back!

hanks,

Andrea

 

 

0

Emily Kirkman
InVision ambassador Emily Kirkman , ambassador Edited
Comment actions Permalink

Hi everyone 👋

I've encountered the problem Darren mentioned before and I've worked it out similarly to how Laura described it too. I'll just share my steps for the comparison and visuals :)

  • In Sketch, I set up an icon sized 20px x 20px and place it on a 32px x 32px Artboard and set this as a Symbol. I also use a transparent 32 x 32 mask.

 

  • This results in this type of upload to InVision with assets where I’ve lost my 32 x 32 dimension:

 

 

  • So, I set the group “Fill + Mask icon” as exportable in Sketch and now when I upload to InVision I have an asset set to 32px x 32px as I wanted:

 


If anyone else has different approaches, feel free to share! It helps to see!

Cheers!

Emily

0

join the conversation

to comment, sign up or sign in.