Forum Discussion
SVG File Issues
I'm having trouble incorporating .svg files to my storyline file. When I add the .svg files (Picture 1), the color and fill is perfect on the screen. When I preview/publish the file, the fill seem...
I'm also having problems with SVGs. There seems to be a difference in the results you get when you Save as SVG versus use the Asset Exporter to create SVGs (seems to cause problems). I haven't figured this out yet. I hope some other users can offer tips.
Shows properly in Storyline GUI and in Preview:
- outgoingEmailBkgdOnly.svg, when viewed alone, Save as SVG from Illustrator
- bkgd.svg, when viewed alone, Asset Export from Illustrator
- envTrail.svg, Asset Export from Illustrator, together with Rectangle 1 (motion path with fade in is okay too)
- envOnly.svg, Asset Export from Illustrator, together with Rectangle 1
- saveAsEnvOnly.svg, Save as SVG from Illustrator
- svgTest1.mp4: When envOnly.svg and bkgd.svg are visible
- UI view is fine—full color
- Timeline play and Peview slide—everything changes to grays
- svgTest2.mp4: When I use envOnly.svg, envTrail.svg and bkgd.svg
- UI view if fine—full color
- Timeline play and Peview slide—everything changes to grays and part of the envTrail.svg changes the appearance of the envOnly.svg despite being below it in the stacking order.
- svgTest3.mp4: When envOnly.svg, envTrail.svg and outgoingEmailBkgdOnly.svg are visible
- UI view is fine— full color and stacking looks great before playing.
- Timeline play and Peview slide— fades on envelope and envTrail are okay and so is the motion path on the envelope, but part of the envTrail.svg changes the appearance of both the envOnly.svg and outgoingEmailBkgdOnly.svg.
- svgTest4.mp4: When saveAsEnvOnly.svg, envTrail.svg and outgoingEmailBkgdOnly.svg are visible
- UI view is fine—full color and stacking looks great before playing.
- Timeline play and Peview slide—fades on envelope and envTrail are okay and so is the motion path on the envelope, but the laptop monitor has been changed to white!
- svgWithPngTest5.mp4: When envOnly.png, envTrail.svg and outgoingEmailBkgdOnly.svg are visible
- UI view is fine—full color and stacking looks great before playing.
- Timeline play and Peview slide—everything looks and tests great, but I cannot accurately test this for the types of colorblind. I prefer to use only SVGs!
Zipped file contains short MP4s of the results of the above tests and a PNG of the Settings used to Save As from Illustrator.
Thanks!
Hi Maura!
One thing we discovered while tinkering with the svgs is that we had to export twice. For some reason, the first time we exported from Illustrator, it pulled in the images fine but distorted on preview/publish like my screenshots above. My co-worker, on a whim, exported the image again (she opened the previously exported svg and chose to export again) and for some reason, it fixed the image and brought in everything.
I don't know if it will work in your situation, but it's worth a shot. I also came across numerous help requests that mentioned things becoming grey-scaled when using svgs. Because it was not my issue, I didn't pay them much attention, but definitely worth a google to see if their fixes help yours!
Are you creating your images using Illustrator? If so, are using Asset Export or Save as SVG?
I've searched throughout the forum using Google and haven't been able to find the posts related to gray SVGs. Any tips?
Sorry for the delay; yes we use illustrator, but I don't have a license so I have to ask my co-worker. She used both asset export and save as and got the same result. I did not create my own image in this instance though. I used an .eps file from getty images and converted it to svg.
I don't remember any exact searches that I did, but I recall many instances on adobe's support site for things such as "fills in black" or "image turns grey/white" etc. Sorry I can't be of more assistance with that.
