Celebrity Cruises

Responsive development

Front-end development

Trevan worked with Celebrity Cruises at a previous company to launch a brand new responsive redesign. We were excited to play a part in the redesign of the new Celebrity Cruises responsive website. Our task in the project was to deliver the responsive front-end code and assets for Celebrity’s home page and Destinations pages. We were provided design mockups, wireframes and specifications by Celebrity and used them for reference as we developed the front-end markup, styles and scripts from scratch.

We worked with Celebrity in an agile manner that allowed us to drop code to them at the end of each sprint via GitHub. Since Celebrity’s technology department was integrating our front-end with their custom back-end application, we were able to work in our preferred local environment using Grunt for task running, Bower for dependency management, JSHint and JSBeautify for assurance, our own custom continuous deployment system, and more.

Some of the highlighted pieces of UI development we provided were the “inspiration board”, map and custom port selection integration. Using some custom JavaScript, we wired up the integrations between the map (built and designed using Mapbox) and the port selection dropdowns to update the content accordingly. Touch support was also very important for this project, so we spent a lot of time ensuring the sliders and other UI components were developed with a mobile first methodology.

View live site

Synchronization of the custom map, options and display feed

Showcasing the cruise destination selection on a mobile device

A piece of content shown depending on what the user selected as their destination

User generated and related content shown based upon a user's inputted destination preference

We catered heavily to the mobile experience, ensuring for quick and easily accessible actions

Selecting a cruise destination on any device is a pleasure for the user