Skip to main content
InVision Support Home Page
InVision ambassador ambassador
Chris Randalls
Chris Randalls Updated
Answered

Vectors Behaving Badly in Studio

So I'm trying to copy and paste some vector artwork, logos, into Studio and am running into issues. Upon pasting, Studio seems to develop a mind of it's own in terms of how it interprets the vector data and things come out looking super wonky.

 

The top image is what happens when copy/pasting from Illustrator where the bottom is from Sketch - top is pretty obviously wrong, bottom is closer to normal but has some weird things happening in and around the middle of the F, O, and N. It's not just this logo, either, it's happening with a few other logos (but not all) that I'm working with.

 

I looked at your Studio "getting started" article on the subject of importing content and saw toward that bottom that it recommends saving vector artwork from other apps as an SVG and importing that file. The problem with this "solution" is that I can't import SVGs into Studio via the "Image" tool... they are greyed out in the import dialog box.

 

Any thoughts?

 

Edit*

I tried importing using the File>Import option and get similar results as the Illustrator image posted above.

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.

10

comments

Sort by

official comment

Stephanie Shaw
InVision ambassador Stephanie Shaw , ambassador

Hi everyone!

My name is Stephanie, and I’m a product manager on the Studio team. I want to thank you first for your ongoing feedback on our SVG import experience and second for your continued patience as we worked to solidify this feature-set. SVG import is such a critical piece of the design workflow, and we are really excited to now have made tremendous strides in this area. Over the last few releases (release notes here), we’ve added new SVG features such as the ability to import text, added support for many additional SVG filters, and fixed countless bugs.

The SVG import experience should now feel solid, and we truly couldn’t have resolved these major pain points without the voices of you all and the rest of the community. Please give SVG import another try, and I’d love to hear any additional feedback or questions you may have!

All the best,

Stephanie and the Studio team
Product Manager, Studio

Shaina Torgerson
InVision ambassador Shaina Torgerson , ambassador

Hi Chris,

So sorry to hear that you're running into this issue while testing out Studio. We hope that you've had a great experience with Studio so far!

This something I would like our Support team to take a closer look at. I will open a ticket on your behalf with our Support team so that they can gather more details from you. Please look for a message from them soon.

Have a great day,

Shaina

0
ASHISH MOHAN
InVision ambassador ASHISH MOHAN , ambassador

It sucks that even basic thing like opening or copy pasting svg format is difficult to do and you label it as most powerful software. I would rate it below both XD and sketch. Maybe you guys should had worked more on rectifying and improving it than wasting money on marketing and releasing it soon to keep up with the hype. Even sketch files are messed up on opening. I know your just a moderator but forward this to your UX team. Thanks

0
Shaina Torgerson
InVision ambassador Shaina Torgerson , ambassador Edited

Hi Ashish,

Sorry to hear that you're running into these issues. I understand how frustrating it is to wait for fixes and feature requests to go live in this Early Access phase of Studio. However, we greatly value the feedback we have been receiving from all Studio Early Access users, and our Support, Product and Engineering teams are all working hard to improve Studio each day.

We’re constantly working on improvements, and we greatly value opinions like yours because it helps InVision create a product that truly is the most powerful software out there. Part of my job is to take important threads from Community to meetings with relevant Product Managers to discuss the struggles our customers are having. I will be sure to raise your concerns and request in my next meeting with the Studio Product Manager. I’m also opening a ticket on your behalf so that you can stay up to date on the status of this feature request. Please look for a message from our Support team soon.

We agree that using InVision Studio should be seamless and enjoyable, and we are constantly working to break down barriers in design. Hearing from customers like you is what helps make InVision products better each day. Thank you for providing your feedback on this issue.

Have a great day,

Shaina

0
Edwin Delgado
InVision ambassador Edwin Delgado , ambassador Edited


This happens to me all the time. Doesn't matter where I import it from. Happens with all my svg icons. They were created in Illustrator, and some in Sketch, others downloaded. Doesn't seem to matter, they simply don't render properly.

1
Shaina Torgerson
InVision ambassador Shaina Torgerson , ambassador

Hi Edwin,

I'm sorry to hear about the trouble you're experiencing with Studio. I definitely understand that experiencing issues like this is not ideal when testing out new beta programs. We are gathering feedback and troubleshooting issues however to get everything up and running smoothly for the public release.

That being said, I'd like to look into the trouble you're having specifically. Would you mind providing the following information for us?

     1. What exactly are you experiencing when opening or copy/pasting svg format?
     2. What are you seeing wrong when opening your Sketch file in Studio?
         (If you can provide any other screenshots of the above two questions, that would be helpful as well)
     3. Can you please send a screenshot of the About This Mac overview? (click the Apple icon > About This Mac)
     4. What version of Studio are you using?

This information will help our team troubleshoot to find out what might be going on. I look forward to hearing back from you!

Thanks,

Shaina

-1
Lala Galindo
InVision ambassador Lala Galindo , ambassador

Hi Edwin!

What exactly is not rendering properly?

Look forward to hearing back and helping out!

Lala

 

 

0
Edwin Delgado
InVision ambassador Edwin Delgado , ambassador

Thank you for response!

Actually, all SVG's have problems. They do render, but rounded corners don't (from what I can tell). They're either cut, or distorted. I've had our company logo even render with the same problems as the same first example given.

     1. Things don't render.
     2. I don't use Sketch. Everything was done in illustrator or downloaded ones from the internet.
     3. 


     4. What version of Studio are you using?


Hope this helps make the product better. Great job so far :)

0
Shaina Torgerson
InVision ambassador Shaina Torgerson , ambassador Edited

Hi Edwin,

Thank you very much for providing that detailed information. As a first step, can you please visit https://projects.invisionapp.com/studio/releases/ and download the latest version of Studio (0.90.50)? With the latest version downloaded, please reinstall Studio and let me know if the problem persists.

I look forward to hearing if this has helped resolve your problem or not. Thank you very much for the kind words about Studio. We are happy to hear that you're enjoying it!

Have a great day,

Shaina

0
Chase Palmer
InVision ambassador Chase Palmer , ambassador

Hi, Shaina!

Just wanted to jump in here and say I have a ticket open that confirms these problems. Had a tier II tech look at it and he confirmed that all SVG's are manifesting oddly / not working. I have the latest version of studio, as well as High Sierra and these problems still persist. 

Best,

Chase

0
Shaina Torgerson
InVision ambassador Shaina Torgerson , ambassador

Hi Chase,

Thank you very much for reaching out here is Community as well! I appreciate you notifying me of the discoveries you have made with our Support team, and happy to hear that they have been able to assist you. I will be sure to keep an eye on your ticket.

As for Edwin, I will absolutely send him to Support if he is also encountering these issues after updating to the latest version of Studio.

Have a great day,

Shaina

0
Edwin Delgado
InVision ambassador Edwin Delgado , ambassador

I manually updated Studio (it wasn't working through check updates) and tried SVGs. I would say it's a huge improvement. Most of the svgs open, but there is always two or three that are off occasionally but I can't replicate it. I copy-pasted on the canvas, so I'll post any update as I keep importing more svgs. Thanks for the assistance!

0
Shaina Torgerson
InVision ambassador Shaina Torgerson , ambassador

Hi Edwin,

So happy to hear that updating your Studio version helped solve the issue for you. If you continue to encounter issues with SVGs, please let me know and I would be happy to open a ticket for you.

Thanks,

Shaina

0
Saul
InVision ambassador Saul , ambassador

Hi Guys. 

I'm also having a similar problem with SVG files. 

I'm using svg files from https://feathericons.com/

Some of them import and appear as vectors, and some do not. 

The "plus-circle" icon is a good example and also the "plus" icon. 

The circle will import, but not the plus part in the middle. 

When I try the "plus" icon alone I get nothing at all. 

What would you recommend?

 

0
Shaina Torgerson
InVision ambassador Shaina Torgerson , ambassador

Hi Saul,

So sorry to hear that you're running into a similar issue. As a first step to troubleshoot, can you please provide the following information?:

     1. Can you please send a screenshot of the About This Mac overview? (click the Apple icon > About This Mac)
     2. What version of Studio are you using?

Look forward to hearing from you,

Shaina

0
Saul
InVision ambassador Saul , ambassador

 

Hi Shaina. 

I've attached a screengrab of the version I'm using. 

 

0
Shaina Torgerson
InVision ambassador Shaina Torgerson , ambassador

Hi Saul,

Thank you very much for providing that information. Unfortunately, we have noticed others encountering issues on slightly older Macs. Since you are on the latest version of Studio, I would like for our Support team to take a closer look at this.

I will open a ticket on your behalf with our Support team. Please look for a message from them soon.

Best,

Shaina

0
Alla Proskuryakova
InVision ambassador Alla Proskuryakova , ambassador

Hello,

I'm also having issues with some svg file imports, primarily those that have a lot of details or some sort of a circular object within them. I just installed Studio and I believe it's the latest version. Here's the info on my Mac - MacBook Pro (Retina, 15-inch, Mid 2015). For now I'm just saving all my svg icons as hi-res pngs, so I can continue working on my designs. Please let me know if this is still solved on a case-by-case basis or if you're planning to roll out a global update to solve this issue. 

Thanks!
Alla

 

 

0
Shaina Torgerson
InVision ambassador Shaina Torgerson , ambassador

Hi Alla,

I'm sorry to hear that you're also encountering this issue as I'm sure this has been disruptive to your workflow. 

I can confirm that this is a known issue that our Engineering team is currently investigating. I will also open a ticket on your behalf with our Support team so that they can gather more information from you. Please look for a message from them soon

In the meantime, as a temporary workaround, one option is to import the files as PNG/JPG files. I know that this is not ideal since you're working with SVG files from feathericons (and it will take extra steps to convert format), but I didn't want to leave you without any alternatives. 

We appreciate you patience, and hope that you are enjoying Studio so far!

Cheers,

Shaina

0
Shaina Torgerson
InVision ambassador Shaina Torgerson , ambassador Edited

UPDATE

Hey all! Just wanted to let you all know that we have an effort underway to improve SVG import. It would be very helpful if you could add any SVGs you've tried to import in the past that haven't worked or looked wrong after import to the tickets opened on your behalf, or by opening a new ticket with our Support team. We need all the SVGs we can get for testing. Thank you!

0
Abhishek Sharma
InVision ambassador Abhishek Sharma , ambassador

Any update on the issue?

I'm still unable to copy n paste vectors from Illustrator. Pasted vector is named as 'pasted image' is rasterised object.

0
Shaina Torgerson
InVision ambassador Shaina Torgerson , ambassador

Hi Abhishek,

It looks like this relates to an issue that our Engineering team is investigating where copy-pasting from Adobe Illustrator doesn't always match the original source design. I apologize for the impact that this has on your workflow.

I will open a ticket on your behalf with our Support team so that they can gather all necessary information, and keep you in the loop with any updates on this issue. Please look for a message from our Support team soon.

Thanks for your patience and understanding,

Shaina

0
Tracy Sommers
InVision ambassador Tracy Sommers , ambassador

Hello,

Was is the current status on this issue? I too cannot import or copy-paste a vector file into studio without it converting to a "pasted image". And sometimes the image will be different than the original design.

And to understand correctly for studio, to import a vector file, you can copy-paste directly from a vector app, or use the the + image from the studio's ui menu?

Thank you, Tracy

I am operating with latest studio version, under mac retina OSX 10.13.6

1
Shaina Torgerson
InVision ambassador Shaina Torgerson , ambassador

Hi Tracy,

Thanks for reaching out to us about this. I'm really sorry to hear you're experiencing these issues and want to apologize for any inconvenience this may be causing you. Let's see how I can help!

To get a better idea of why you are having these troubles, could you provide the following information: 

     1. Could you please provide a screenshot of your About My Mac "Overview" screen? Click the Apple icon > About This Mac
     2. Could you provide a screenshot or screencast showing what’s going wrong?
     3. Could you please send a copy of the affected Studio file?
     4. What version of Studio are you using? InVision Studio > About InVision Studio

Once I have these details, we will be better suited to determine what might be going on here. 

In the meantime, as a temporary workaround, one option is to import the files as PNG/JPG files. I know that this is not ideal since you're working with SVG files from feathericons (and it will take extra steps to convert format), but we don't want to leave you without any alternatives. 

Look forward to hearing from you,

Shaina

0
Hanna Ahvensalmi
InVision ambassador Hanna Ahvensalmi , ambassador

Hi Shaina,

I've also had issues with SVG files, either copying a shape from illustrator or importing a svg file. I think it has something to do with curves because the problem appears only on rounded shapes with smooth anchor points. Sometimes Studio doesn't understand that rounded shape or smooth corner and it cuts the vector as you can see from my example. Sometimes I've been able to join the anchors in Studio to create the curve and fix the shape but sometimes it doesn't work as in the example heart icon.

I've attached the preferences of my mac and screenshot what's happening. I'm using InVision Studio Version 1.17.0. I can also send you the studio file if needed.

1
Shaina Torgerson
InVision ambassador Shaina Torgerson , ambassador

Thank you very much for taking the time to provide those details, Hanna! At this point, I would like to have our Support team take a closer look.

I will open a ticket on your behalf with our Support team requesting your Studio file, as you mentioned above. Please keep an eye out for an email soon.

Best,

Shaina

0
Ryan Davis
InVision ambassador Ryan Davis , ambassador

Also having this issue on shapes with rounded edges. Has there been any progress since the developers started looking at this nearly a year ago??

After Importing to Studio
Originals

0
Shaina Torgerson
InVision ambassador Shaina Torgerson , ambassador

Hi Ryan,

I can assure you that our team is continuing to work on a solution for this. I understand how frustrating it is to wait for a fix to an issue. The Engineering team is aware of the issue but we prioritize issues based on the scope and impact of the issue. For that reason, we don’t have an immediate fix available.

If you would like, I would be happy to open a ticket on your behalf with our Support team so that they can keep you in the loop on any updates to this issue. If this is something you'd like, can you please provide the following information that I can pass onto our Support team?:

  1. A screenshot of your "About this mac" overview
  2. The version of Studio that you're using

In the meantime, the only workaround we've found to work is first open those files in Sketch and then copy & paste them into Studio. I know this is far from ideal, but I wanted to make you aware of any temporary solutions. 

Hope this helps!

Look forward to hearing from you,

Shaina

0
Esther van der Molen
InVision ambassador Esther van der Molen , ambassador Edited

Hey, having the same issue here unfortunately. I'm using mac version 10.14.5 & InVision 1.18.0. I tried copying from illustrator, or dragging an svg file from my finder to invision. both have the same result.. 

0
Shaina Torgerson
InVision ambassador Shaina Torgerson , ambassador

Hi Esther,

I apologize for the frustration that this issue is causing for you. I appreciate you taking the time to provide all of the details you have above.

I'm happy to open a ticket on your behalf with our Support team so that they can take a closer look. Please keep an eye out for a message from one of our Support agents soon.

Thanks in advance for you patience,

Shaina

If anyone else is experiencing this issue, please contact our Support team directly here.

0

join the conversation

To comment, sign up or sign in.