April 14, 2016 at 11:00 pm #310368
I think I have a solution to minimize the flashing to white that we get when navigating to another page in a Lectora title, however, I need a good example to test my idea, therefore, if you find the page flashing annoying and you are happy to share a small title with the community please send me a message and I will provide an upload link.
With your title I will first prove that I have a solution and then create Shared Content for all to see so please ensure you are happy to share with all:-)
Regards, PeterApril 15, 2016 at 4:13 am #310377
All of these samples have flashing, you could use one of those: http://trivantis.com/e-learning-course-samplesApril 15, 2016 at 6:21 am #310397
Thanks for you reply, however, I did use “Top 5 Beaches Course” as my first test but I could not see any significant flashing, it was there but most of the community would not see it as a big deal. I do know that this is a big ask but if you know that one of these is really bad then I will use that one. If not then I will try them all – thanks.
Regards, PeterApril 15, 2016 at 7:40 am #310407
Try this. It’s the last year’s LUC app (except I disabled device scaling). Looking forward to see what you have achieved.
Attachments:April 15, 2016 at 4:25 pm #310504
You just found the flaw in my solution, the title must have a background image and all pages must be the same size as the background image.
That said, I used the Let’s Cook and made some changes like removing the intro flash file as it just takes time to load and play, also, I changed the background so it was one image and not made up from multiple bits. When testing the links below keep in mind that I have not made changes to any of the popups and they maybe larger the the main pages.
I have placed the published files in two separate folders so there’s no need to clear the cache between the one that flashes and the one that has minimal flashing. Please do try the flashing one first so you can clearly see the flashing, then try the other.
This is achieved by creating a new index.html file that will open the title in an iFrame, the following is the index.html file for the minimal flashing:
<div class=”content” align=”center”>
<iframe width=”1009″ height=”662″ frameborder=”0″ scrolling=”no” src=”intro.html” name=”contentframe”></iframe>
When I published I set the first page name to intro.html and the index.html is an attachment and is in the extern folder.
Lastly, I have not tested this with responsive design in Lectora 16, so all of the above maybe moot??
Please note that no cooks were harmed in these examples 🙂
Regards, PeterApril 15, 2016 at 11:39 pm #310523
Math NotermansMember119 pts@mnotermans5114
Hi Peter, for me when checking the 2 versions..they actually do look identical. Both have no ( or almost none ) flashing when going to the next page. ( Windows 10 in Firefox )
What i do notice a lot though are not optimized pngs. What i mean is, they are big in kb, and thus you see the image build. This can be tackled by reducing the filesize of images. For jpegs you have to use your design tools to get an optimal image. Weighing size and quality. For pngs there is a free photoshop plug called SuperPNG ( http://www.fnordware.com/superpng/ ) that greatly reduces sizes of any png maintaining optimal quality. It works great, i reduced pngs from 200kb to 40kb with it loosing no visible quality at all.
MathApril 16, 2016 at 12:20 am #310524April 17, 2016 at 7:26 am #310556
So do I understand correctly that you wrapped the whole course into an extra frame and added the background image of the course to it?April 17, 2016 at 1:35 pm #310567
Yes, that’s correct, the course is wrapped. If we select the “Include Title Manager Frame” when publishing we get the same thing (the course is wrapped) and that would be a good place to insert this background image.
It does not stop the actual flashing, however, instead of seeing blank white nothingness we see the background image in the main page – the wrapper.
Also, if the background image includes the images of the background objects like menu, back, next, TOC, etc then when we navigate it just looks like all of the current page objects are cleared and the new page objects are shown.
As I said in my first sentence: “I have a solution to minimize the flashing”, I’m not sure if we could ever eliminate it with the current method of navigation.
Regards, PeterApril 28, 2016 at 10:26 am #312049
Ian RossMember1 pt@iross7469
I am thinking more about this, and with Lectora 16, I do not believe that this solution will work with he Mobile view, due to different backgrounds etc. We were surprised when we developed our first custom app at the flashing, our customer was not happy at all. We are also a Storyline shop and if I look at HTML5 output from Storyline this “flashing” issue does not exist. I do realize that there are a lot of other issues with the HTML5 output from storyline, we rally thought that the new features in lectora 16, with the responsive Web development, would throw lectora as a main tool for our courseware development. This “flashing” is a show stopper for us and I do not think we will continue with anymore development for custom courseware using Lectora, unless specifically requested by a client. Back to Bootstrap for mobile development.April 29, 2016 at 5:49 pm #312357
I’m really sorry to hear that you are not going to continue development with Lectora. I too have a customer that will not accept the flashing issue and whilst this solution does not fix the problem it does reduce it to an acceptable level. That said, I have not given up on a solution so I would request and with respect ask that you take a look at this post from time to time, say fortnightly as I do have a lot of plates spinning at this time. I will also have all my customers upgraded to version 16 by mid next month.
Best regards, PeterApril 29, 2016 at 5:59 pm #312358
You must be logged in to reply to this topic.