22 Replies
Daniel Nyakana

Hey David, 

I figured out a work around where you can actually use high res images without quality loss. 

I will also test out SVG's to see if there is a noticeable difference.

I wrote a post on this, here is a copy:

For all those experiencing this problem I found a straight forward workaround that's very easy and will give you 100% full quality image resolution without any loss at all. 

Whether you save for scorm or tin can or web the zipped files that are produced contain:

If saved for scorm a folder named:  scormcontent > assets 

In this folder are all the images you used in your course simply find the image that was loosing quality and replace it with the original image - be sure to name it with the same name as the one your replacing. Simple as that.

If save for web, go into: content > assets 

In this folder pretty much do the same as the above direction.

 

Quick update to the above post: 

Make sure to use a (.jpg) extension for the new image which you paste in the folder. This is the extension that gets written in the final files. If you use an image that happens to be a (.png) for example it won't take it and the image will look broken or missing even though you named it the exact name and that's because in the code RISE writes a (.jpg) extension. 

 

Hack #101 from Daniel - more hacks to come :)

Reach out to me if you need any help. 

Daniel

https://community.articulate.com/discussions/rise/poor-image-quality-when-uploading-an-image-with-rise?page=3#reply-534999 

David Tait

Thanks Daniel, that's a handy trick to keep up my sleeve if needs be.

I usually try to avoid post-publish mods where I can as it's more likely I'll introduce an error in to my work this way and it makes updates to content more long-winded. I guess there's a filesize consideration here too. 

David Kettle

I've managed to fix this for my workflow. I was saving svg file out of Adobe Illustrator and having the same problem with the SVG showing fine in an image with text, but shrinking to nothing when clicked on instead of zooming in.

Turning off the responsive option when saving the file worked to fix this, so the SVG would zoom to it's original/edited size.

The only real change I can see in the svg code in the file is it added id and width and height attributes in pixels to the svg tag.

Code which didn't work:

<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 1000 500" style="enable-background:new 0 0 1000 500;" xml:space="preserve">

Code which does work:

<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="1000px" height="500px" viewBox="0 0 1000 500" style="enable-background:new 0 0 1000 500;" xml:space="preserve">

I've attached a couple of SVGs which demonstrate this.