Vectore Graphics .svg

Feb 26, 2014

I have found a site that allows me to download graphics in vector format, .svg. The issue is that Storyline does not recognise the format.

Has anyone worked out how to use this format in Storyline?

14 Replies
Kyle Main

After 2 years of people asking about this and other staff saying this would be a cool future feature, I'm wondering what the progress is on adding static SVG files?

I'm using Static and Animated in Captivate, directly adding like you add images in Storyline.  I do not like Captivate 9, but it has had the static SVG ability for enough time with enough demand here that I want to know, because I'm with an Organization that is going to decide if switching to Storyline 2 is the better software over the current Adobe Captivate 9 that they are using.

 I've been forced to use Captivate and they are allowing direct import to the stage for SVG's,  and today I tested an Animated.svg created with Adobe Animate and exported with  an "Add-on" -  Very cool, but all browsers can not do the animated part (IE). Google Chrome and Firefox play the animation, while IE simply shows the first frame.  

Either way, Storyline is getting behind the competition on this.

I don't like Resonsive eLearning for the Majorirty of my projects, so I want to keep using Storyline over Captivate, but if IE could play the animated .SVG - it could be a game changer, and is just a mater of time.


- Kyle

Rachel Barnum

Hi Gonzalo,

For now, you could also start with a larger initial story size that adjusts down based on screen size. That way, rather than trying to take a smaller Story size and size it up (making it blurry), you're instead starting out at the large size and if the user needs to scale down, the screen retains clarity.

You can change the story size under the Design tab. You may choose to scale it to a common, but larger, resolution. You would also then need to scale up your font sizes, etc.

You can ensure the output is adjustable to screen size by going to Player->Other (it has a gear icon next to it) and change "Player size" to "Scale player to fill browser window"

Saral Sharma

I need to create a questionnaire to run on iphone 5 onwards to iphone 7. But I can not use SVG which means I have to make and maintain two versions of my questionnaire(to use @2x and @3x image formats), which is a pain. 

I have been using Articulate Storyline for last 3 years and recently start using 360, but got disappointed after finding that I can not use SVG in 360.

It will be helpful if Articulate team will include SVG into their future release or patch.

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.

Lauren Connelly

Hi everyone!

We just released Storyline 360 (Build 3.57.26407.0) today which includes the option to import scalable vector graphics (SVGs) to Storyline 360 so images stay sharp when learners zoom in and out.

Thank you to everyone who continued sharing how important this feature was in Storyline 360. Now all you need to do is update Storyline 360 in your Articulate 360 desktop app!

If you run into any issues, don't hesitate to reach out in this discussion or in a support case.

Access Pointe

I was so excited to update to the new version that recognizes SVGs. And now I'm very disappointed!! I've been using a workaround for years, that has been easy and looks excellent. I import the SVGs into a PPT, ungroup the image which turns it into a "microsoft office drawing object" then copy and paste into SL. Once in SL, I simply ungroup the EMF which turns into all of the individual parts of the image (as freeform shapes.) Now, I can recolor at will, and the images are sharp and clear. 

Now, with the new update, this doesn't work at all, and I cannot recolor any of my images inside SL. It's very frustrating. The image now comes in as an SVG, and I can see the individual parts, but they turn into PNGs, and the quality is terrible.

I have been in touch with support, and had to revert to the Sept. 26 version for now. I hope this can be resolved. I need to be able to have great quality images that I can recolor in SL. 

Example use case: I develop a module for client x, all branded and beautiful. Client y wants the same module, but branded for their company. I cannot recolor any images; costs me hours and hours of mindless work to recolor, reimport, resync, reanimate.