Forum Discussion
Blurry Images in Preview and Published
I've noticed this for awhile, all of my images I insert into this Storyline 3 course appear quite blurry everywhere - on the Storyline development screens, when previewed and when published (either as HTML5 or Flash).
The images are all smaller than the maximum size, they are at 100% scaling, have no effects applied to them. My Publish settings is set to 100% quality. I've tried bitmaps, pngs, jpgs, all identical blurry results.
I've searched these forums and seen a couple other threads on it , but never found a solution or real explanation for it. I can't send this course over to my client - it's embarrassingly bad.
Thanks, Stian for sharing that here. I know that this issue must be incredibly frustrating and our team has your examples that you shared with Gerald to use as we continue investigating this. We'll let you know as soon as we can on it.
Also, the Modern player is a Storyline 360 feature (but if you're using Storyline 3 it does not apply).
- GaryOvergaard1Community Member
Hi Ashley,
Sorry for the delayed reply. Had to put my videographer hat on for a few weeks and am just getting back in here today. Let me try to answer as many of your questions as I can.
When I first posted here, I had only tried opening an existing Storyline 2 piece in 360 and trying it out in Preview. I had not yet tried to see if a published piece would also be blurry because frankly, just blurry in Preview was enough of a showstopper for me, and decided to just continue my project in Storyline 2. Having said that, I just tried opening that same piece in 360 again and publishing it this time. When playing back in both IE 11 and in Chrome, it displays the same amount of blurriness in Publish as I see in Preview. My scaling is at 100%. I never use anything other than that.
The level of blurriness that I see is not so much it's hard to read the text. It's a certain amount of softness to it that is similar to if you have ever changed the display resolution on your laptop's graphics adapter to something other than it's recommended setting. The result is certainly usable but not very pleasing to the eye. Definitely not crisp like in Storyline 2. And BTW, it is both images and text exhibiting that softness, although it is predictably more obvious on the text.I would attach a capture of my preview to this message, but the piece I am working on is company confidential. Perhaps I can create a general example slide later to share. That test may also answer your question about upgraded vs new files as well. So far I have only tried the upgraded file and not a new one.
Thanks....Gary
Hi Gary,
Thanks for offering to create an example file--that would be really helpful! That way we can compare what you're seeing in Edit mode to what you're seeing in Preview and after publishing. We'll be here when you're ready to share it!
- StianLarsenCommunity Member
I did some more comparisons, and at least at my end I see what the issue is. But I have no way to fix it, as it's not a fault at my end.
When using screen-grab, and grabbing what I see at 100% in production, and compare it to preview, I see a 10% reduction in preview-size. This is why its getting blurry. It seems to be previewing in 90%, not 100%. Though, there is no setting to controll this.
I notice the exact same difference when I open a published course in Internet Explorer, and in Google Chrome. The Chrome version is 10% smaller, and thus blurry. I also notice the Chrome version have a thicker frame around the content, which might be the reason why the content scales down 10% to make room for this extra thick player-border.
I think this might be the issue. Gary, can you confirm if you have the same problem by using screen-grab and overlay/compare production and preview, to see if you're also seeing the 10% reduction in preview?
- StianLarsenCommunity Member
When inspecting the published code in Google Chrome, I notic there is scaling going on I have no idea why? See image. This scaling is not applied when running through Internet Explorer, and that's why it's not blurry in IE.
When removing all scaling being done, it displays fine, with normal thicknes border and no blurry view. So my issue is related to these parameters being applied during publish and probably during preview aswell.
Thanks for sharing that additional information, Stian. I see that Gerald added it to our documentation of the issue so we can keep working with our engineers on it.
- GaryOvergaard1Community Member
Stian,
I definitely see the difference in the captures you just shared. I'm afraid that I cannot duplicate that scaling behavior on my end, at least on any of my published projects. In the project preview however, that window is definitely smaller than the published pieces running in both Chrome and in IE 11.
The text in this preview is definitely softer than in the published pieces. Plus the Storyline 360 preview text is definitely softer compared to the Storyline 2 preview text. That kind of annoys me when authoring but I can live with it as long as I know the published output will look OK.
One thing to be aware of is that on most of my projects the Story Size is 2047 x 1536. We do this because we author primarily for the iPad retina display and playback in AMP. I'm not sure if that large of a story size factors into the preview issue. But as I mentioned before, it was not an issue in Storyline 2.
- AnikaGlischinskCommunity Member
Hi all. I am also still having issues with the pictures showing blurry in the preview and published. I'm working in SL360 and am the problem shows up for all player options. I also updated the picture setting when publishing. Any idea how to fix it??
Thank you
- AnikaGlischinskCommunity Member
FYI - I have opened a case for this. :)
Hi Anika!
Thanks for sharing your files with us. My colleague Christopher is already testing what you've shared, so you should hear back from him soon!
- TeoKarCommunity Member
I am having the same issue. There is no way I c an make pictures look normal. The weird part is whenever I use the same pictures at random other projects they work normally.
Hello Teo,
Thanks for chiming in and letting us know that this has been an issue for you as well.
Are you experiencing an issue with a particular image and a particular project? It sounds like you may have been able to use the image in another project successfully?
We do have some best practices for working with images if you'd like to check it out here.
If you are only experiencing the issue in a specific project file and cannot replicate in another, I'd import the file into a new one and proceed.
If you need us to take a look at anything, please feel free to share the image file for us to take a look.