Blurry text in non-responsive projects. - Variable Hack tried - Captivate

[lostnath-PARL]

Hi! Hopefully someone can help with this. I got this issue where text is blurry on my slides. I've tried the variable hack and it solved the blurriness but now my text won't align correctly and the font size is wrong on render. Does anyone know a solution? Thank you!

[mark@headTrix]

I had text issues in the past, so just wanted to follow here to learn the solution.

I havent come across the blurriness issue.... what happens and what is the "Variable Hack"

Cheers in Advance!
Mark

[lostnath-PARL]

Hi Mark!

The "Variable Hack" is adding an empty variable at the end of each text layer to force Captivate to render the text at run time which makes the text sharp.

But when the projects renders the text is smaller than the 16px set in Captivate and the text auto-align to the top. Sometimes the text layers get like 3-5 empty text lines or it auto-align to the bottom can't tell which one is happening but this is how it feels. Everything looks fine in Captivate.

lostnath-PARL

[mark@headTrix]

Interesting trick... although I guess the text should be clear on its own. Especially since its HTML and should remain as text. It is a bit bizarre.

Although one thing to keep in mind is that when you preview in a browser, it might not be 100% (Command + 0 or Ctrol +0 will show you Actual size.)

But sounds like the trick isnt working so well since it brings upon other issues. I guess its a 2 step trick... and we are waiting to learn the 2nd step! Thanks for the little lesson!

Hope you get this figured out

cheers,
Mark

[Stagprime]

When you say  "at the end of each text layer"  what do you mean by layer?

I would make a simple, one letter variable, like  t  so that I can place it where I need to. Be sure to leave the default value as blank.

I typically place all my text within a smartShape.

At the end of my text I would simply type out  $$t$$  to employ the hack.

The hack need only be applied once per object containing text.

I have not experienced what you're describing above.

[lostnath-PARL]

I'm coming from the Adobe Suite and pretty new to Captivate, I'm used to saying layer by I meant Text Caption. I'm using xx for the variable maybe that's too long for Captivate. I will try t and report back!

lostnath-PARL

[lostnath-PARL]

Smaller variable has the same issue. I think there something wrong with the variables....

[RodWard]

Did you create the User Variable in your Captivate project file first before trying to use it?

If you want to be sure that the variable is working, just create the User Variable and then insert it via the special icon  button in the Properties tab.

Then you can insert any variable shown available in the Insert Variable dialog.

Surrounding the name of a User Variable with $$ characters at either end is a shortcut method of inserting the variable but it doesn't give you control over the Maximum Length parameter.  So although quicker to insert, there are downsides to using that method.  And you still need to create the variable before you try to use it.

[lostnath-PARL]

Yes, I did create the variable before. And I tried inserting the variable via the special icon and it's the same issue. There might be something wrong with my fonts?

lostnath-PARL

[Lilybiri]

Name of the variable has no importance at all. Since I always create a bunch of variables using a shared action, an empty variable is labeled 'v_null' for me because that is the name I used in any blog post where I needed an empty variable. The workflow with such an empty variable will convert the text container to dynamic text in a non-responsive project. That is needed to force the rendering on runtime, whereas a static text will be converted to a static image. Such a conversion allowed to create the possibility to use any font (in the SWF time) without need to embed the font. However you better use only websafe of Adobe fonts. The Adobe fonts library is big enough to find a font which is so close to the system font you want to use, that you don't need the text-image conversion anymore. That is already fully the case for responsive projects, but badly not yet for non-responsive project in the present version. More about fonts:

http://blog.lilybiri.com/fonts-in-captivate

I fully understand you talk about 'layers' because the Timeline shows each item as a layer, and doubles as a layer panel as known commonly in Photoshop, Illustrator...

The issue may however be with the fact that you are using the 'OLD' text captions. Captivate has a lot of rather outdated objects which date from its very first version(s) but have alternatives which are much more flexible and customisable. A text caption is defined by 2 files (have a look at the Gallery\Captions in the installation folder to see what I mean. The file with the extension fcm defines the margins etc and cannot be customized fully in Captivate. However any 'shape' (object which appeared with version 6) can also be a text container. Such a shape is fully customisable in Captivate's object style: font, colors (font, stroke, fill), margins, spacing... Did you try to use the empty variable workflow with shapes as text container?

Know also that if you try the suggestion to increase the project resolution/size, that this has consequences for the size of the published output.  That was not mentioned. Check the estimated output file size using the button in the Project Info panel (to be opened from the Window menu).

[lostnath-PARL]

I've tried the shapes with the empty variable and still the same issue, unfortunately.

[Lilybiri]

Which font did you use? Was it a websafe or Adobe font?

[lostnath-PARL]

I'm using Martel and Roboto connected to google fonts via JS.

[Lilybiri]

Roboto is also in the Adobe fonts library. It is possible that your complicated workflow is at the origin of your issues. As you have read from others in this thread, the variable workflow works flawless since many years. AFAIK you didn't yet mention anything about your using JS with Google fonts.

[lostnath-PARL]

I also tried to remove the link to Google Fonts and I have the same issue.

[Paul Wilson CTDP]

I used to use the Google Fonts trick to setup loading of web fonts at the start of a project but now that Adobe offers web fonts I don't do this any longer. The workflow for Adobe Fonts is better (no javascript code required).

[Paul Wilson CTDP]

Another solution is to rescale your project to a higher resolution. For example, if you are using the default of 1024 x 627, try bumping up the resolution to 1470 x 900 or perhaps even higher such as 1770 x 1084. You can do this from the Modify dropdown menu and select rescale project. Make sure you maintain the aspect ratio. When you publish select HTML Scaling so the project will scale down to fit your browser.