Hi,
I have created a self-contained multiple scene (30+) app using Hype and am testing the PhoneGap app at the moment. It’s basically an interactive book with music, sound effects and some scenes have simple animations.
My question is how best to speed up the loading time and interaction performance as it’s less than perfect. I’ve done the usual of shrinking files sizes of all resources and taking off pre-load images for a few of the larger images (repeated backgrounds for instance).
On opening the app on iPad it takes about 10 second of white screen (after the splash screen) to load and swiping left and right is a little jumpy and the buttons aren’t always as responsive as I’d like.
Should I look to swap png files I’ve used for maybe svg files?
Should I restructure somehow?
Cut the book in half? - Is it possible to break the book in half but still keep it as a single download and see performance increases or would two separate apps be the only way?
Re-write as a native app?
The overall files size is just under 50mb.
Any help would be gratefully appreciated.
Dan
It sounds like you’ve already taken most of the important steps we recommend to reduce load times.
Changing from PNG to SVG may or may not help. SVGs can often reduce performance because their rendering can be more complex then simple pixel pushing, so that is usually dependent on the images themselves.
To offer more specific advice, we’d need to see the project itself. It is likely that the number of scenes, especially if they have a lot of elements, could be the major culprit in load times. You could potentially break up the scenes to separate Hype documents. But without seeing the document that advice could be wrong!
Hi Jonathan,
Daniel at Tumult is currently looking at the project which is great, I’m currently combining the scenes into single scenes with slightly more elements as there is repetition of backgrounds and symbols in quite a few of the ‘pages’ as I hope this will greatly lighten the load. Once I’ve done the modifications I’ll then try it again, fingers crossed this does the job.
As to creating several Hype documents, I’m not quite sure how I would do this for an ‘app’ output, would there be several HTML files in the output and how would they run sequentially?
Thanks
Dan
Yes, there would end up being several different HTML files. The easiest way to output in this manner is to use the File > Advanced Export… and you could set it up to export scenes individually.
Doing it this way doesn’t provide the linkage between them though. To do that, you’d want actions to use a Go to URL… and have the URL be the name of the .html file for the scene that was exported (usually the scene name). If you want them to play sequentially, you’d make a timeline action at the end that would do the Go to URL call, just as you would a Jump to Scene call.
And I could then export everything to PhoneGap Build to create the multi platform app as I have been doing with the one HTML file which I simply rename ‘index.html’?
Thanks
Dan
I’m not really familiar with PhoneGap Build, but I’d guess if you still have an entry point index.html for the first scene it would work correctly.
Perfect, I’ll look into it, it should be straightforward I’d imagine.
Thanks again
Dan
How did this work out?
Hi,
I didn’t link to any external html files as that stopped me from releasing the app as a child friendly one which as an app to help young kids learn the drum kit was fairly important. Combining scenes by rather than using separate “pages of the book” I merely changed the relevant components of the pages so you loaded the backdrop image and music files once but the words and smaller pictures/icons loaded up later in the timeline. I can then call up the pages by assigning goto frame buttons rather than load next page. This helps the performance a lot.
Unfortunately it suffers issues with audio issues still. Essentially I have a page of say 4 notes which are also buttons with the sounds attached so you can press “play” and the line of music plays as the notes are triggered in the timeline but each note can be pressed and the sound is also triggered. The issue is, if you don’t press the notes and trigger the sound first, the sound won’t play in the timeline, the timeline plays but just no sound happens, very annoying.
Hope that helps?