29 Mar
Nested Tabs

Oceania Nested Tabs

This is an Interactive Deck Plan (IDP) for Oceania Cruises. The original design was made in flash. Most of their clients have migrated to mobile devices such as smart phones and tablets. We needed to create an Interactive Deck Plan outside of flash as well as cross browser compatibility.

The IDP had to have specific functionalities. We had to be able to click on a section of the larger map and the tab on the bottom would show that section. It would have to highlight the name and the section at the same time.

dragsection

The IDP would also have to be draggable, both the large and small map. We needed to show the entire deck so that the visitor would see a full and a zoomed version of the deck at the same time.

One of the challenges was that there were 6 ships with multiple decks. This many pictures loaded at the same time would slow down the IDP’s loading in the browser. This was avoided because 2 of the ships had the same design. We optimized every image so as to fully take advantage of every byte.

We