App made with Hype (and not only)

(Freelancer) #1

Hi to everyone

I’ve released a free app for Android ( soon available also for iPad) made with Hype (XDK > android & Cordova/Xcode >IOS)
I used also some other things like some 3d panoramas and so on.
This is our first project made in HTML5/CSS, normally we work on IOS only.

Available in Google Play in English and Italian, about 45mb ( less in IOS version)


VR Panoramas in Hype
Introducing HypeDocks, a new resource :smile:
Welcome on board! Please introduce yourself 🖐
(Greg) #2

Looks great, well done.

(kerguelen) #3

Looks gorgeous !
How do you implement the 360° panorama and the 3D object manipulating tool ?

(Freelancer) #4


This is not true 3D inside the document, this is a kind of interactive sprite.
I’ve made the model in 3D with several renders ( one for each position/rotation).
in the Hype project I used a widget to import the sequence, about 750kb only.

All panoramas are made with dedicated software, all imported via widget.
I worked a lot to find the right way to optimize all panoramas. Now every panorama is stored in a single Hype project in order to avoid “memory warning” in old devices.


Indeed this looks great!
I tried it on a Nexus 7.
The panoramas impressed very much! Could you elaborate a bit more about the ‘dedicated’ software and widgets?
Looking forward to the iOS version!

(Freelancer) #6

I used Panotour Pro to build all panoramas but I’m not sure to suggest this (very expensive) software. I’ve lost about “400%” of my time to avoid bugs and fix limitations of this software in order to use the output in a Hype/app project. Probably is better Pano2VR by
If you’ve planned panos in hype project ( expecially if you need a offline app) go to Pano2VR

NOTE: you must turn OFF ( on load the pano) any animation / rotation / event to avoid “memory warning” and crashes.

I’ve imported all external resources ( any external js) in the index of the panorama and then I’ve stored all datas in a folder in the same level of the hype resources folder ( in www).

"index_pano1.html "via URL to import the pano in the widget HTML ( in this case offline)

The IOS version is “in waiting for review” :smile:


Much appreciated!
Thank you very much for sharing your workflow on this. I do have some Panoramic experience and hopefully be able to implement it in a Hype document or app.
Thanks again and good luck with your app!

(kerguelen) #8

Thanks for these precisions !
You did a nice job here indeed

(Freelancer) #9

Thanks a lot guys

another important thing: all panos are made both for HTM5 and flash.
The flash verison is better than the HTML5 version, however you can’t add a flash projector in IOS and we decided to use the HTML only.

in this URL , in the first panorama, you can see the enriched flash version ( multiresolution version) with some effects like flare and dynamic audio with fade/in/out. A part the full screen option ( all hype/panos fit to any device) we can’t add these features.

question: on the web is available a good flash projector (offline) for the Android version?


Box hover Effect - 4 BOX ( squared and rounded shapes )
(Freelancer) #10

@Olav @kerguelen @gasspence
IOS / iPad version available here:

360 degrees Video player
(thejoepeach) #11

amazing dude… your books looks so great… i will share with one client that are looking for something just like this…

Thanks for sharing…


Wow, amazing demo.

I am new to Hype (or indeed to any software like this!). Could you explain how you did the jigsaw on your video and what would I need to do to achieve something similar?

Thanks for sharing

(Freelancer) #13

Hi @Jilo in this App I developed a simplified version based on this template in jQuery.
The game was embedded through the HTML widget element.

more methods
jigsaw puzzle
Javascript Callback/hypeDocument Javascript Callback/hypeDocument variable control from inner HTML