44 Replies
Ben McKenna

Unfortunately I don't believe Storyline currently supports importing vector images. It's bizarre given how the shapes created within Storyline 360 are .svgs.

Saying that, someone did post a neat trick on these forums a while back on how you can import custom shapes from Illustrator into Storyline using your clipboard. I can't find the post now, so I'll try my best to explain it:

  1. Open Illustrator
  2. Copy your graphic/object to your clipboard
  3. Open one of your slides in Storyline, then paste from your clipboard
    (The pasted image might look pixelated and ugly at this point)
  4. Right click the pasted picture > Ungroup
    (Even though it may look like a normal picture in Storyline, it actually allows you to do this for some reason)
  5. Storyline will ungroup the components of the image into freeform shapes and empty images. Simply delete the objects you don't need, and keep the freeform shape/s that you want.

It's not a perfect solution because it doesn't seem to handle complex graphics very well. But I think it's the best solution until we get official support for vector graphics.

Diarmaid Collins

Hi Ed. Just chucking my tuppence in, for what it is worth, but the key to getting crisp WMF files imported into Storyline is to blow them up HUGE in whatever vector programme you create the files in, first, before exporting. I generally create my files at 100% and before exporting, blow up to 500% - this results in super crisp images at no extra file size, really flat graphic (no gradients).

Crystal Horn

Hey there, Mark.  While you're right, we don't currently support importing SVG files, we do allow you to add EMF and WMF files as pictures.

There's a lot of complexity in supporting the full EMF spec, which we aren't currently doing. Many EMF vectors will work fine, but some may look weird or cause Storyline to behave strangely when they're ungrouped.

Are you having any issues with these file types in Storyline?  If so, let me know specifically what you're importing and what's happening.  I'll be glad to help!

Geneviève Jacques

That trick did it for me! Thank you! :D

It's just really damning that we then need to apply the math Rule of three on every object to have the perfect proportion ratio between every illustrations. I would have much prefer to create my illustrations with the right size from the start. Oh well!

Diarmaid Collins

Hi Mark. Apologies for butting in, but if I could be so bold and make a few suggestions? I find that the simpler the illustration the better the import. Once a gradient is introduced into a WMF graphic it seems to behave like a bitmap when imported.

If I was to import that image you have there, I would recreate the background pie chart stuff as shapes within Storyline itself - relatively easy and straightforward.

I'd then import each of the characters individually having removed any gradient from each image. Being honest, there isn't really much need for gradients when the overall look/feel of the image is flat.

Maybe try that and see if you get a better result?

Diarmaid Collins

Hi Mark. Not sure what you mean. Your issue is that the imported EMF file seems to rasterise and produce jagged edges (poor resolution).

This has happened to me in the past and my solution was to simplify my original vector graphic (basically removing gradients/drop-shadows/etc). What this seemed to do was allow Storyline to treat my WMF (try that format as opposed to EMF) as an actual vector image and imported crisp, clean graphic shapes.

BUT, only after I blew the artwork to 400/500% before importing. For some reason, the geometry of the WMF/EMF format creates a whole bunch more extra 'nodes' in artwork. It only looks good when blown up huge then exported.

This is why your artwork looks jagged and rasterised when imported. The bigger the artwork the more nodes the smoother the graphic. The images below show a simple 50px circle illustrator file, followed by 100% scale WMF (note the jagged geometry), a 200% WMF file (loads of nodes) and a 500% WMF (tons of extra nodes).

Original Illustrator Vector artwork (4 nodes)Smaller WMF circle 50px = less nodesWMF reimported toIllustrator showing loads of nodesWMF artwork increased to 500%

However, if one's artwork contains any degree of complexity such as gradients/drop shadows, the the mechanics/benefits of the WMF/EMF file format are basically null and void. One is better off treating the artwork as a PNG/JPEG/Bitmap file.

Anyway, that's just my experience with the issue. I thought that might help.

Mark DiGiacomo

I appreciate your effort, D, but despite my understanding of resolution dynamics, the issue here is that SL is not treating an EMF as a vector object. It has rasterized it and badly. So a jpeg/png gets the job done at high res, sure, but that's not the aim of this thread. If you're overcompensating (your image) to the degree you state in order to get the EMF to work, it's because it's just rasterized and you're making it huge to 'deal' with the poor compression. 

Diarmaid Collins

Hi Mark. No worries. Obviously the real issue here is that while Articulate state that EMF/WMF file importation is supported it very clearly isn't. Crystal basically makes that point in her post above.

My point (coming from a print/publishing background), and this holds true for innumerable programmes out there, not necessarily just Storyline, is that vector graphics that incorporate things such as drop shadows or gradients often encounter rendering issues when imported into assorted programmes - admittedly not as much nowadays, but still frequently enough. Believe it or not, I don't think I ever got a custom WMF file to render correctly into any Word document I had the misfortune to design/build/edit.

So, obviously the question in this case is how to try and make the WMF/EMF file format work as much as possible within Storyline, and the workarounds are kind of outlined above. It's not perfect, flawless or effortless, but it does work if one follows the basic steps.

Those steps do produce a crisp scalable graphic that Storyline recognises as a distinct shape (not just a rasterised rectangle).

The file is not rasterised. It is an actual shape. 

Geneviève Jacques

Ok so finally. It does the trick when importing the file, but when publishing. Yeeeeesh. (And there's no gradiant in my .EMF files.)

I really feel that EPS and EMF is not supported as announced.

Meanwhile, I'll continue building my course with EMF and hope that when we'll publish it, the problem will be solved in an update...!

Leslie McKerchie

Hello everyone,

I wanted to pop in to let you know that there was an enhancement included in the latest update to Storyline 360 that you may be interested in:

Enhanced: SVG images on PowerPoint slides import into Storyline 360 as native shapes. You can customize their fill colors, line styles, and shape effects. Details here.

Just launch the Articulate 360 desktop app on your computer and click the Update button for Storyline 360. Details here.

Please let us know if you have any questions, either here or by reaching out to our Support Engineers directly.

Diarmaid Collins

Hi Leslie. That's rather gratifying, being honest!

It would be even more awesome if we were able to import SVGs directly, like images, etc, due to the workaround of having to import an SVG into Powerpoint, save, then import the PP file into a scene, just to get the icon/shape.

But, it does work and has opened up a rather nice route to getting beautiful vector objects into Storyline.

ray laurencelle

Hmm...  I have a PowerPoint with imported SVG images originally created in Illustrator.  PowerPoint treats them as shapes allowing me to change color and outlines, etc. When I imported the PPT into the latest version of Storyline they were converted into pictures.  I have to say these complaints about Storyline not supporting vector goes back many years.  I would also include the problem with text being poorly rasterized when animation is applied. Storyline is a good authoring tool but it would be truly awesome if it would fix these issues.