Red 360 Panoramas - behind the scenes
The Red 360˚ Panoramas iPad App is a journal of my travels throughout the world and a showcase of the 360˚ panorama and still photography I shoot while on these travels. The app also provides a platform to use and demonstrate a selection of the features found within the Oomph publishing platform used to create the app.
The Russian Far East issue, shown above, highlights 11 locations, from Korsakov in Sakhalin Island, to Broutana Bay in the Kuril Islands and Paratunka in the Kamchatka Peninsula. The cover image features the black lava sand beach and volcanic plug on the island of Matua.
Oomph features used throughout the app include, Animations, Tap to Reveal, Page Links, Full Screen Video, HTML Overlays, Audio, Action Hotspots, In-page Slideshows, Page Swaps and Apple Maps. The following images highlight how the features are implemented.
Tap to Reveal
A hotspot, when tapped, can hide all of the layers in a section revealing the background layer. Another tap anywhere on the image will restore the layers.
Page Links
Hotspots can be placed over navigational elements and provide direct links to other sections within the issue. In this case, each of the titles; Introduction, Index of Locations, How to Use This App and The Photographer have hotspots that contain the name or location of the target section.
Conversely each target section has another set of navigation elements and hotpots that direct the user to the other sections.
Fullscreen Video
The Introduction section prompts the user to rotate the iPad to view the video by Pieter de Vries. When the user rotates the iPad the video automatically plays. There is also a link that loads an external website.
HTML Overlays
HTML Overlays provide the ability to extend the platform by allowing HTML/Javascript files to be integrated into the layer system of a section. In the case of Red 360, HTML panoramas are created in external applications that generate all the required code and are then simply integrated into the appropriate section of the app by placing the generated files into the section folder.
Audio
Several of the sections contain audio recorded at the location. These sections display and audio button in the bottom navigation bar that plays an .mp3 file when tapped. Initiating the play action also reveals the "pause" button.
Action Hotspots
A lot of the interactivity used within my applications is managed by Action Hotspots. For example, when the user navigates to a page containing a 360˚ Panorama the initial view is of the panorama. The bottom navigation bar contains a button labelled "More Information" and this button has an action hotspot attached to it that, when tapped, triggers two actions within the section. First, it actions a panel to slide up in front of the panorama, that panel contains an In-page slideshow, a description of the location and several new icons. Secondly, the button changes from "More Information" to "Back to Panorama" which when tapped will reverse the action.
In-page Slideshow
The In-page slideshow displays a number of still images taken at the location. To see the images the user swipes left or right to reveal a new image. The slideshow content in this example is a single multi-page PDF, created from a 6 page InDesign file. Oomph recognises the single pdf as being 6 individual pages and displays them as individual images. Slideshows can be comprised of a range of disparate files including, video, HTML, png, jpg or PDF.
Page Swaps
Page swaps is one of the frequently used features within Oomph to create the feeling of depth within an issue. Essentially page swaps are multi-page pdf files that only display one page at a time and can reveal alternate pages when referenced by a hotspot. In this case two pdf are used, layer 1 for the text, content and video and layer 2 for the buttons to select each different page.
