Dealing with image quality in Storyline 360 when imported from file

Hello,

When I import image in Storyline (Insert -> Picture from file) -- the Storyline automatically expands the image on the full slide width. Thus, I cannot avoid adjusting image size.
So it does not matter how good quality the source image is, and how accurate the size - if I know Storyline slide proportions in pixels I can create an image with 96dpi of the needed pixel size, but it will still be rescaled by Storyline when importing. This behavior contradicts what I have read in the user manual on image quality in Storyline 360:

"Start with high quality images and videos that are already properly sized for your course. Scaling media up or down in your course can cause blurriness, especially if your images and videos have text." https://articulate.com/support/article/Storyline-360-Best-Practices-for-High-Quality-Images-and-Videos

I also saw another thread on the topic with no solution here: https://community.articulate.com/discussions/articulate-storyline/hi-res-photos-being-converted-to-low-res-in-storyline


What would be the workaround then?
Many thanks!

36 Replies
Quinn Kampschroer

Here's how you do it, though it doesn't work for Flash-only courses:

1. Insert your image into your slide (as large as you want/need).  Don't worry about the quality now.

2. Publish your course.

3. Open your course files folder and go into the 'mobile' folder.

4. You'll find your project images stored here.

5. Copy your high-quality image (from your computer) to this folder, but use the image title Storyline gave your (now) low-quality image (a long string of alphanumeric characters).  Essentially, you're replacing the low-quality file in the 'mobile' folder with your high-quality image but using the low-quality title so that Storyline can find your high-quality file.

And you're done!  

It's been tested with Edge, IE and Chrome.  I'm sure it'll work with everything else.

Irina Poloubessov

Hey there,

I have downloaded Storyline 360 updates from 29.1 , and again the image (now in the SL editor), inserted from "Picture from File" is very, very destroyed.

I have prepared an image in Photoshop: 720px x 540 px, resolution 96 dpi.
This is the exact slide resolution and size of the Storyline slide.
Why then is the image destroyed?

I greyed-out certain pars of the descrete content but you can see the fragments.

I have locked aspect ration in size and position of the inserted image, and nevertheless it did not help to preserve its quality.

What would then be the required size and resolution of the Photoshop image to avoid this difficult Storyline behavior?

Attached: my player settings, original image from Photoshop, and how it is viewed in player and editor, as well as the .story file.

Please help!
Thank you very much!

Irina Poloubessov

Unfortunately the Storyline 360 again ruins images (in Chrome, in Explorer, in Player).

I submitted my file to the support, who checked that I haven't resized the imported image, haven't rotated it or scaled, it is 1:1 scaled.

But support could not help - 

This is what they sent me as what they see -- blurred, low quality.

https://sharing.articulate.team/o0uQnY7Z

And attached is the snapshot from the editor -(original-crop.gif) - we need to maintain the same sharpness when rendering.

I am following the practices from the https://articulate.com/support/article/Storyline-360-Best-Practices-for-High-Quality-Images-and-Videos.

I remember there was a patch to the Storyline 360 that if you insert a GIF image, it will not ruin it, but with updates it somehow is again destroyed.

Please help!

David Crocker

@Irina This is also been a constant problem for us for a long time. 

@Quinn we should not need to do this, Storyline should not destroy our images. We are constantly having to use workarounds for one thing or another. I want to be able to publish my course and not have to fiddle in the file system afterwards. Is this too much to ask?

@Articulate As much as I appreciate new features being added to storyline. It would be great if you would concentrate on fixing the bugs in the system. Just read the forum fix what needs to be fixed ...Please!

Irina Poloubessov

Hi David,

I also notice that this is kind of a floating bug - I republished today and it was satisfactory. However a few days ago it was super blurry (no changes to the image, no rescale, 1:1 insertion). Not sure if the updates is causing it or some inner Storyline handling issues.

Irina Poloubessov


Dear Alyssa,

Following the investigation with Support, one of the reasons for a bad image quality when embedding Storyline into the Rise SL component was found, and I got a reply:

"
Although the image is not scaled in Storyline 360, the image quality is degraded when inserting the Storyline 360 to Rise 360. [...]

I will submit a feature request to our product team on your behalf regarding this matter.
"

In the Storyline image must be inserted in a way it fits the 1:1 size and not be rescaled in the editor. Meaning, I am obliged to prepare the image to fit the desired proportions in the size of 720x540 px and can't make it bigger.
However Rise allows embedding a SL component in Medium and Large formats (which is a very desired and much needed format for us that we use extensively!). And the image quality of SL components in medium and large format is very bad, as scaling occurs, but is not backed up with the resolution of embedded images, which size must be smaller in order not to be rescaled by SL in the editor. From how the image looks, it implies that even if I embed GIF image, SL will convert it into JPEG with familiar artifacts of image quality under 60.

I very much appreciate the proactive feature request from the support. I would like to make sure, though, that this feature request is not lost and reflects the amount of affected users (we might be many). So instead of duplicating similar feature requests with independent struggling users, can we maybe vote for this feature that Storyline finds a way to ensure original image quality for Medium and Large formats in Rise and in general, like embedding a player to fit full-size of a browser and not only keep the quality with the smallest size of a player?

The current destroying of the images compromises so much the professional of looks of our courses and damages the trust of our customers. I think this feature request should be highly prioritized, and voting for it would probably reflect the real acute need.

Thank you very much for the possibility to share our concerns with you!

Irina Poloubessov

Dear Lauern,

This would be great. Meanwhile there is a struggle to use the very native Storyline features as well, such as arrow lines. They are also rendered very blurry, which makes our work really difficult with Storyline.

I have submitted the bug to the support, but you can see here how it looks. Even before the embedding into Rise. There is a major issue with the Storyline image quality!

I really hope the Articulate can fix it in the nearest future, this makes our courses look frustrating, inspite all the really great features of Storyline and its very comfortable user experience.

Vincent Scoma

Hi Irina, 

Thank you for letting us know and submitting a bug report! I do see that we have an active report with a dashed or custom arrows appearing blurry. I am adding your comments to our report so we can continue to provide updates to this thread! 

In the meantime, a workaround for this is to use block arrows instead of line arrows:

We will be sure to reach back out as soon as we have more details to share!