Blurry Notes text in the player - Storyline 2

FIXED! On 5/5/2016, Articulate Storyline 2 Update 8 was released, which essentially fixed this issue. You can download the latest version of Storyline 2 at this link. New issues:

  • If your Notes tab in the player is first or the only tab, the slide title may run into the Notes text. This can be fixed by either adding a line/paragraph break at the beginning of the notes on each slide (approx. 2-3 sec. per slide to fix) or by moving the Notes tab so that it's not first. 
  • Also the dividing line between the slide title and notes in the Notes tab may cut through the title. This line can be "removed" by modifying the Player Colors>Transcript>div element to match the background color (Menu>bg)

My team is experiencing the following problem with all projects in Articulate Storyline 2. In the Player, the Menu text is crisp and clear, but the Notes text is noticeably blurry. The low text quality looks like the anti-aliasing is out of control. This phenomenon occurs in projects that are upgraded from Storyline 1 and in projects that are newly created in Storyline 2. 

To demonstrate the issue more clearly, I created a project in Storyline 1 with identical slides that have a different 12-pt font in the Notes area. As you can see in this demo, the Menu and Notes text are both equally crisp and clear. I then opened that same exact project in Storyline 2, which automatically upgraded it. As you can see in this demo, the Notes text in the published output is noticeably blurry / fuzzy. I have also attached both Storyline project files in a zip archive.

Other things I've tried that had no effect:

  • Updating Storyline 2 - We're running the latest version that was released on Oct. 3, 2014.
  • Changing the player display properties to be resize the browser to the optimal size and to lock the player at the optimal size.
  • Using the Clear Formatting icon
  • Trying larger and smaller font sizes.

I'm getting push-back from clients about this noticeable difference in the published output, so any help to get this resolved will be helpful.

124 Replies
Robert Lengacher

Lora - Since notes are rendered as rasterized images, there is no (and apparently will not be a)   solution in a future update. The only way to get 100% control over the rendering of the captions would be to manually build a notes/captions area on each slide that the user can toggle. 

Udi Gilboa

Articulate are expected to fix this in SL2. They can keep the rasterized images option but can add the previous capability and let the user choose how they want to implement the Notes. This is pure software development and definitely can be done.

As mentioned in this blog, the whole community is frustrated, leaving Articulate, migrating to other products of competitors.

Kuriko A

Hi Brian.

On 10 February 2016, I wrote a post explaining why it's unacceptable for Articulate to have left this bug unresolved for 16 months (...and counting) . You replied that you have escalated the issue internally. I was pleased to hear that it's now an escalated issue which should hopefully be addressed promptly. 

Therefore, can you please provide us with an update on what progress has been made since your latest post? The users in this thread are clearly losing faith in the Articulate product and support, so it would really lift our spirits if you could give us some evidence that what you said on 11 February 2016 was actually true.

Thank you.

Brian Gil

Hi Kuriko,

Since my last post we have spent considerable time evaluating our options. We’ve concluded that the solution is not as straightforward as one would hope. Specifically, reverting back to using HTML text rather than rendering the notes as an image would eliminate the highlighting and strikethrough formatting options. Removing features is not something we take lightly since we’ll undoubtedly disappoint customers utilizing them now. An alternative is to render slides containing those formats as images, which in turn would result in blurry text, but only for that subset.

Our next step is to evaluate the two approaches with a broad segment of our user base. Once we settle on the ideal compromise we will ship an update to Storyline 2 with that change. The timeline is dependent on how quickly we can garner user feedback on the proposed change, but rest assured that we’ll push through that process as efficiently as possible.

Thank you for your patience and understanding.

Brian

chiefy .

Interestingly, adding highlighting and strikethrough to HTML is relatively easy. Obviously in a product like Storyline, which builds the content dynamically, there could be issues with getting this to work properly and consistently. Below are a couple of examples of how this works!

 To highlight an entire line to text, you have to make it display inline... which isn't ideal.

h1 {
display:inline;
background-color:green;
color:#fff;
}

http://jsfiddle.net/J7VBV/

If you only want to highlight part of a sentence, then you can simply use the <span> element for your highlighted text.

span.green {
background-color:green;
}

Strikethrough text is as quick as changing the text-decoration, again, can be done using a span!

span.strikethrough{
    text-decoration: line-through;
}

 

Leslie McKerchie

Hi all,

I wanted to provide an update here, as Storyline 2 Update 8 was just released, and included a number of fixes which you can see in the release notes available here. The item you all may be particularly interested in is how it improved the quality of notes text in published output. You can download the latest update here, and after downloading and installing the latest update you’ll want to republish any existing content to ensure that the updates and fixes are applied.

Let us know if you have any questions, either here or by reaching out to our Support Engineers directly.

Ashley Terwilliger-Pollard

Thanks Carla for that catch - and it's something our team is taking a look at right now so we'll let you know once we have additional information in regards to that.  So far, it looks like it’s only happening when the Notes tab is either the first tab, or the only tab in the side panel. Workarounds include making it not the first tab, or changing the color of that line to match the background color.  I know that's not ideal - so we'll keep you posted on any other additional information.

Robert Lengacher

Just updated and republished a project after the update. The notes text is now crystal clear. Thanks so much to the customer service and development team at Articulate for getting this done!

The issue with the line and the title is present, but that's certainly not a deal breaker. I'll update the original post in a few minutes.

Robert Lengacher

The easiest fix for Carla's issue with the title running into the notes text is to simply hit enter/return before the first line in the Notes to create an extra line/paragraph break.

That and changing the color of that dividing line creates a nice solution. The drawback is that each slide would need to be edited, but this solution takes only about 2-3 seconds per slide (just did a whole project in less than a minute). It also won't look horrible even if they do fix that issue.

Ashley Terwilliger-Pollard

Hi all,

We just released Update 9 that included the following fixes:

  • Fixed issue where slide titles would overlap the separator line at the top of the notes tab in Flash output
  • Fixed issue where you couldn't change your quiz responses before submitting them in HTML5 output
  • Fixed issue where you couldn't select an answer choice in HTML5 output after seeing an "Invalid Answer" notification
  • Fixed issue where the Submit button was missing when revisiting a question slide in HTML5 output

You can download and install the update here.