Articulate Storyline - Blurry Exported Bitmaps...

Sep 27, 2012

John Moore
By John Moore

I've been capturing simulations as interactive videos and bitmaps.  I've noticed that once I output 

the content (Flash and/or HTML5) that sceen captures are blurry. The Flash blurry output does not

concern me since I'm targeting HTML5 at this point, the Flash Player has always blurred bitmaps.

Steve won that battle.

I've done some inital testing, see image below. I went into the output\story_content directory

and opened some bitmaps in Photoshop.  I mocked up a  "slightly sharper" version of a Storyline

exported bitmap.  The Storyline exported bitmap was 796 px. X 498 px.

I opened file 6Oc03OJt48n_DX1592_DY1592.jpg (old exported bitmap) and used the same size

but created a sharper image. But once I ran that section of the module (HTML5) with the new

bitmap, that new bitmap was still blurry.  Anywhere (code-wise) I need to look to re-size or fix this

via (CSS, HTML or JavaScript) code, or in the Storyline IDE (image, video properties, etc...).

The replacement bitmap is sharper than the original Storyline exported bitmap. It just seems 

as if the HTML5 Storyline output or GUI is using the bitmap in such a way that the bitmap 

becomes blurry.

I know (here) that the NEW does not "look" to much sharper than the OLD  here (above), but the .psd file and

the final Photoshop NEW exported bitmap is slightly sharper.

John

5 Replies
Paul Knights
over 11 years ago12/13/12 at 8:12 am (UTC)

I have the same problem.

Have been exporting jpegs out from photoshop but when Storyline publishes these files seem to be downgraded with extra compression...especially some difficult colours like red and green. Outputted files from psd are absolutely fine.

ps - Flash had a toggle option to so users could 'Allow smoothing' (useful to stop jaggies on rotates and tweens) as well as allowing the user to control compression output values.

Peter Anderson
over 11 years ago12/14/12 at 7:28 am (UTC)

Oh, cool! Glad to hear it, Paul, and thanks for checking back in. Just want to share the below in case someone else encounters the same thing:

The Properties section of the Publish window allows you to make any last-minute changes to your course player, or to change the compression settings Storyline uses when publishing. 

  1. The Player field shows the name of the player that Storyline will use when you publish. (The player is the interface that users see when they view your course, and it can include things like player controls, resources, a glossary, a menu, and other features.) Click the player name if you'd like to make some final adjustments to your player or switch to a different player. If you need help choosing your player settings, see the tutorials on Customizing the Storyline Player.
  2. The Quality field allows you to control the compression settings Storyline uses for any audio, video, and pictures you've added to your course. The settings here default to whatever you used the last time you published a Storyline project. To change the quality settings, click the blue text and change any of the fields as noted below; then click OK.
    • Choose Standard if you want to use the default settings. If you mark this option, the values on the window revert back to their defaults (video quality of 5, audio bitrate of 48kbps, and image quality of 80%).
    • Choose Custom if you want to define your own quality settings. Then click and drag the slider on any of the three values to change the compression. Using higher values means higher-quality output, but also larger file sizes (which means longer download times). Lower values mean smaller file sizes and faster download times, but the visual and audio quality will be lower as well.

This discussion is closed. You can start a new discussion or contact Articulate Support.