One of our clients came up with an issue regarding the menu size of an eLearning course developed using Articulate Storyline. It is very small when viewed on iPad (Safari browser).
He asked us to increase the font size of the menu. But with the default features of storyline we cannot increase the size.
We tried and successfully came up with the solution that I would like to discuss here in the following steps.
Step 1:
First go to your published course. Click the mobile folder in your course output folder.
Step 2:
Right click player.css and open with a notepad or WordPad.
Step 3:
Here you will find the slidelist where you can increase the font size.
If you increase the font size, it will affect the height, so you need to adjust the height as well.
Step 4:
After increasing the font-size, click the story_html5.html in your published folder.
Step 5:
Check for the increased font size in your course.
Default font size:
Increased font-size:
These are the steps you need to follow to easily increase the font size of the menu of an elearning course in an iPad. Have anything to say, please do share!
Recent Comments
http://Muhammad%20Subhani
7/10/2014 at 4:28 amThanks for this post.
I am planning to create an atlas that would have an extensive menu with probably thousands of divisions and subdivisions. Menu, is therefore, a key element for my users. But I am having problem of the size of the menu with illegilibility that you addressed in this post.
My main target audience will be the tablet users as I could see an ongoing increase in this group.But at the same time I want the product that would have no problem for the desktop.
I am assuming that the font size “9px” and height”16px” are the default.
If yes,what did you increase the font size and the height up to?
Or one has to experiment?
If you provide me the exact numbers I would really appreciate.
Also what dimensions you use for the story size. was that the default 720×540(4:3) or something else. My goal is to maximize the experience for the tablets and specially iPad. The display dimensions for ipad 5 air are 2048×1536 pixels. So, do you think that I should start the project with 2048×1536 pixels(which has 4:3 ratio) and then change the font size and height that you mentioned or you have some other suggestion? I would still need the answer for the exact size and height used by you in your client’s project.
Thanks in advance for your help.
Regards
Muhammad Subhani