Skip to our site navigation Skip to the content

Responsive Web Design


Episode 14: Celebrity Cruises

To reduce management costs and maintain a more consistent presence across platforms, Tina Alexander rolled out a responsive web redesign for Celebrity Cruises that works together with their app strategy to take advantage of a 3× increase in traffic from mobile devices.

We had to say “what’s the best way to get the biggest bang for our buck?” A framework of responsive web gives you the opportunity to respond more quickly to device changes, to make sure our content is updated across all platforms.

If you’d like, you can download this episode’s audio file. Additionally, you can follow us on iTunes, on Google Play Music, or subscribe to our RSS feed.

Buy The Books

Everything you need to go responsive, in four short books. Save 15% on all four!

Work With Us

If you’re grappling with some of the responsive design challenges discussed on the show, Karen and Ethan offer a workshop on responsive design. Why not bring it to your company?

Contact Us!

Subscribe Now

Want the latest episodes? Fire up your favorite podcasting app, and subscribe to the podcast via RSS, Google Play Music, or on iTunes.



This Week’s Guest

Tina Alexander

Principal, Digital Faire

Tina is a digital strategist, product evangelist, and innovation enthusiast. She previously served as the Associate Vice President of Digital and Web Marketing for Celebrity Cruises, where she was responsible for growing digital revenue and delivering engaging experiences across all digital platforms. Prior to moving to Miami, Tina held product management leadership positions at The Wall Street Journal, Time Magazine, and Amazon.com. She graduated from Columbia University, and earned her MBA at Duke University.


Episode Transcript

Ed Note:

This interview was previously recorded when Tina Alexander was working for Celebrity Cruises; she is no longer in that role.

Karen:

Hi. This is a Responsive Web Design podcast where we interview the people who make responsive designs happen. I’m your host, Karen McGrane.

Ethan:

And I’m your other host, Ethan Marcotte.

Karen:

This week I personally could not be more excited to have Tina Alexander [formerly] of Celebrity Cruises with us. Hi, Tina.

Tina:

Hi. How are you?

Karen:

Great. I’m so happy you’re here. But before we get started, let me say a few words about our sponsor, Campaign Monitor. If you’re like most people, you open your email on your mobile device. If you know anything about responsive design, you know that making emails look great on all of the different devices and screen sizes that people might want to use, is really hard. Fortunately, there’s Campaign Monitor. They have a great new email builder called Canvas, that lets you make responsive emails in a snap. There’s an easy to use, drag-and-drop email crearotr, and so everything just works! Your images are sized correctly, your typography is the right size. Now, you can even try out the Campaign Monitor Canvas without having a Campaign Monitor account. Just go to campaignmonitor.com/templates and try out their fantastic tool that enables you to create emails that work right, for everyone.

Tina, maybe you could just start off by introducing yourself and tell everybody what your role is at Celebrity.

Tina:

I [was previously] the head of digital and web marketing here at Celebrity Cruises, so mostly looking at our website, but then also looking at some of our digital traffic drivers and, of course, our mobile products.

Karen:

Tina, you and I met a while back when you were working on a responsive redesign of Time.com. Can you just say briefly a few words about that?

Tina:

That was a fantastic project. It’s funny because it feels like so long ago and yet it was only maybe two-ish years ago. It was an opportunity for us at Time where we had a growing audience on mobile and again, surprised at how the stats had really skyrocketed since that release in terms of penetration for media sites. That was a very exciting project for us. We struggled with a lot of issues about performance and image loading, and how to responsively generate ads through multiple networks. It was a very fun, challenging, and somewhat introductory experience with responsive web design.

We came upon this huge nugget of information that about fifty percent of people start planning their vacations on their mobile phones.

Karen:

I think that’s one of the reasons I was so excited to have you come on. You’re one of the few people that I know in the industry that’s actually led multiple responsive redesigns across multiple products or companies. Can you talk a little bit now about what you’re doing at Celebrity with responsive design?

Tina:

I think it’s an interesting proposition for us because one of the things that we struggle with and purchase that we have at Celebrity Cruises is how people use their mobile devices. Media was pretty obvious: people consume news in terms of day-parting on different devices. But for us we’re really trying to understand “how does a large purchase get researched, planned, and analyzed?” We did a bunch of research and actually—I should say—we looked at a lot of secondary research from other companies that do a ton of work in the travel space about how folks are planning their vacations. We came upon this huge nugget of information that about fifty percent of people start planning their vacations on their mobile phones. That blew me away, because I thought, sometimes you’re talking between $5,000 and $10,000 for these seven, fourteen, twenty-one day cruises that are oftentimes momentous experiences for people: weddings or anniversaries. It just didn’t seem intuitive that someone would use a phone.

I think the key change over the last few years is the percentage of people who are opening their emails on their mobile phones.

I think we’ve really had a lot of learnings in terms of the roles of different devices. So we decided to start moving more of our website into responsive web. One, because we knew the site itself needed renovation. We hadn’t updated our homepage in a couple years and it’s about time for a refresh. And we also are continually updating our promotions. Cruise is a very promotions-based business and so we always had to be fresh and deliver something unique and innovative.

I think the key change over the last few years is the percentage of people who are opening their emails on their mobile phones. Some of the basics we looked at were promotional landing pages. When we updated our homepage we responsively redesigned that. We also looked at a key area for decision-making for vacations which is destinations. We decided that as we added in modularized content, UGC [user generated content], and other cool factors, let’s make sure it’s optimized across all devices. Essentially, we’ve been trying to integrate our overall digital updates with a more contemporary framework.

I think the easiest thing was really looking at some of the multiple-platform maintenance that takes place in a world where you don’t have responsive web design. We think about how we optimize our resources and we usually don’t have enough people. This has been true of everywhere I’ve worked.

Ethan:

Tina, can you tell me a little bit about how you actually convinced your stakeholders and some of the executive folks on your end about how to go responsive? Were there any concerns or questions that you had to field at that point?

Tina:

It’s interesting because there’s a project that we partnered with our sibling brand Royal, and I had to be a little bit more convincing for folks on that side of our business because they hadn’t done a responsive redesign. I, of course, had the advantage of working on Time.com and being able to parlay some very positive success metrics in showing how responsive web really made a difference in terms of user consumption. On the Royal side we definitely had some positive and mutually enriching conversations about how people actually purchase cruises. Part of that was about the whole e-commerce experience. I know the jury is still out in some areas in terms of transactional sites versus informational sites, but essentially going through, give me some success stories, identifying some of the pain points and risks.

Reducing the management costs and maintaining a more consistent presence was perhaps the most winning point I’d say that we made in some of the discussions.

I think the easiest thing was really looking at some of the multiple-platform maintenance that takes place in a world where you don’t have responsive web design. I think every company, and of course every brand within our larger company here at Royal Caribbean, we think about how we optimize our resources and we usually don’t have enough people. This has been true of everywhere I’ve worked. To make sure your mobile site is properly updated, make sure your desktop is properly updated and then of course, looking at the growing trends within consumer usage we had to say “what’s the best way to get the biggest bang for our buck?” A framework of responsive web—while it has been evolving certainly since it first came out—gives you the opportunity to respond more quickly to device changes, to make sure our content is updated across all platforms. I think just reducing the management costs and maintaining a more consistent presence was perhaps the most winning point I’d say that we made in some of the discussions.

Responsive web, we thought mostly about some more marketing efforts, we thought about the new users coming to our site. Essentially responsive web is for our users across all platforms.

Karen:

Can you talk a little bit about how your responsive web strategy fits in across all the other touchpoints that you might need to reach? I noticed that you just launched a new tablet app, for example.

Tina:

Certainly. It’s interesting. I believe in a potpourri of digital tools. While I definitely have points of view about different approaches, I think we’ve transcended the days of app versus mobile web, when that became more of the Pepsi/Coca Cola kind of discussion. From my point of view we have to always, as marketers, as product developers, product managers, have to think through how do we meet our user needs across different devices. We here at Celebrity skew slightly older, not a too-dissimilar audience than what we had at Time, but we have an affluent set of educated people who over-index in tablets, who have not as heavy mobile usage but definitely folks who are in different stages of life and who have different engagement with their products and shopping for them.

The tablet apps were really a discovery tool. We have had pretty much a history in this industry of creating beautiful, rich, lush brochures and we wanted to be able to take that same imagery, that storybook/dreambook experience and translate it into an app. We did that relatively quickly at speed to market. It was leveraging Adobe DPS tool. We took our existing InDesign files and we translated those into apps based on specific destinations. That for us as a business was a very positive experience, it was very easy, it was cost-effective. Again, that’s focused on the planning process.

Whereas our Explorer app, which we’re in the process of updating, is a bit more transactional; it has a lot more data retrieval, looking up points, prices, integrating promotions so there’s a different kind of utility in that form. I think speed was certainly something that we looked at there.

Responsive web, we thought mostly about some more marketing efforts, we thought about the new users coming to our site. We wanted to make sure we were prepared to move more into the mobile advertising market and thinking about other kinds of trends for how people are actually engaging with content across all the different platforms that are out there. Essentially responsive web is for our users across all platforms. Mostly new users but I would say certainly for established past guests as well.

We actually spent a little bit more time than we hoped, but actually a very fruitful time, and it’s an educational process. So, talking with folks throughout the organization who not only would be involved with the initial launch of our responsive section of the site, but also the maintenance.

Ethan:

You mentioned process a couple times. How did you scope that first responsive project for Celebrity?

Tina:

It’s funny. I think the first response to the project was, we started off wanting it to be destinations. It’s interesting that you mentioned “scope” because destinations was not exactly a blue sky project, but it was certainly where folks’ imagination could run wild. We partnered with an agency called Code and Theory to think through the different design components, how to integrate some of the various vacation planning factors into the design. It was really pretty elaborate. In fact, we subsequently divided that release up into two phases. We had this big dream for destinations but we recognized it was complicated.

Meanwhile, homepage was something we needed to refresh so we essentially took internal resources and then partnered with a responsive coding company, called AppendTo and had them help our IT team understand how responsive works. Our IT team had, of course, done some readings but I think it’s not as easy to integrate backend with this new responsive framework without a few more learnings. So the smaller scoped home page, which is really beneficial for us as an organization, because we actually spent a little bit more time than we hoped, but actually a very fruitful time, and it’s an educational process. So, talking with folks throughout the organization who not only would be involved with the initial launch of our responsive section of the site, but also the maintenance. There’s just some key content and concepts that we had to really talk through and understanding with our CMS that we were also upgrading. How different components fit together. Talking through performance. So, I think there’s really a vital experience for our teams to understand the core components, and then we moved into the destinations really which was simply more complicated. We had a better understanding of what was needed and how responsive would work.

A person who’s just researching a cruise who’s never booked for us before may encounter our e-mails, or an ad. That person may come in to a responsive landing page, a responsive promotional page, may encounter our home page, and have one type of interaction with us, which we believe is more of a “getting to know you” phase.

Karen:

One of the debates that I always hear people going on about in the industry is What’s a mobile user? What’s a desktop user? And how might a mobile user be different? And while I think for many industries the needs of mobile and desktop users, I don’t think there’s really any difference between them. One of the industries where people do talk about specific mobile needs is the travel industry. Can you talk a little bit about how you discuss what a “mobile” user might need at Celebrity and how that fits into your responsive strategy?

Tina:

Yes. I think that’s really interesting because phones have become so much more sophisticated and there’s much more than you can do on your phone. That what we used to think of as being the kind of core needs for the on-the-go person, that you will, has been changing. So, I think looking at quick facts and information is something that we used to think is the main point of mobile.

We’re really taking some time to think about our loyalty club. So, we have cruisers who come back again and again and again because they love the experience, and thinking through how can we create mobile as point of connection. More the traditional “how do we take the brand everywhere?” with our core users. We’re thinking about how they act and how to really deepen the relationship with our brand. Sometimes it is transactional and that could be looking up your points because we have a Captain’s Club point system that you can understand how many points there are for specific cruises. Other parts of it are looking up itineraries, sailings, destinations.

I think we’re still seeing it as transactional, but it’s really about the relationship that we’re having. We’re looking at the mobile app based world as that stronger, tighter relationship with our target users. We’re also seeing the apps as an opportunity to upgrade the experience. A person who’s just researching a cruise who’s never booked for us before may encounter our e-mails, or an ad. That person may come in to a responsive landing page, a responsive promotional page, may encounter our home page, and have one type of interaction with us, which we believe is more of a “getting to know you” phase and sometimes we use the metaphor of dating.

We’d see that people who are in our apps are in a little bit more of a committed relationship with us. We can see how we can first entice our potential guest with the responsive web—and of course desktop ways that we’re communicating with them. Then once they book a cruise with us, then there’s an opportunity to download our core apps. So, even within our app strategy we have the destination-based page apps, the tablet apps we did with Adobe—which we believe were probably for… I wouldn’t say the older crowd, but for folks who do want that lean-back kind of experience and who are more used to the traditional brochures. I think for a slightly different audience we have the responsive as an introduction and then the apps are how we go from just dating, I guess, to in a relationship.

We definitely have a new paradigm, I think, with more modular content. Which was something we wanted to do, I would say, for quite some time, but had to make some system upgrades to make that possible. So with the modularized content allowed us to tell our story in a slightly different way.

Ethan:

I’d be really curious to hear if you guys had an existing design framework or visual language and if so, when you started working on your first responsive projects if you had to modify that in any way? Or if you were starting from scratch?

Tina:

Well, we definitely have a new paradigm, I think, with more modular content. Which was something we wanted to do, I would say, for quite some time, but had to make some system upgrades to make that possible. So with the modularized content allowed us to tell our story in a slightly different way. We had brand guidelines and that kind of good stuff prior to responsive, but how do we chunk content? Even from our promotional pages, how do we lay out information in a way that we can easily shift amongst devices? So I think we took more of that. And then we had the fluid grid we thought about our content in a bit more a boxed manner in terms of components, and I think that’s been important for us as well as we’ve all been more traditional from brand design, to that more engaging digital experience.

I know especially with the mantra of mobile first there’s this idea of distilling content to this core atomic state. I think at the end of the day there’s always been a hierarchy of information, what we’re trying to communicate, what’s the main call to action, what’s the main information point?

Karen:

Talk to me a little bit about how that modular, component-based approach helped you prioritize or choreograph what appears on each screen or at each breakpoint. I think one of the things that I’ve heard from many people as we’ve done these interviews is the challenges that people have in figuring out how to prioritize different elements on each screen. So how did that work for you?

Tina:

That’s interesting. I know especially with the mantra of mobile first there’s this idea of distilling content to this core atomic state. I think at the end of the day there’s always been a hierarchy of information, what we’re trying to communicate, what’s the main call to action, what’s the main information point? And that basic structure for any page whether it’s modular or not I think needs to be persistent. It’s again: what are you trying to communicate? And so from a scoping perspective, if things are modularized, yeah if you understand one module requires more work than the other because there are several different types of technology or different integration points, I mean just from a level of effort point of view, then it’s easy from a scoping and prioritization perspective. But at the end of the day, we’re talking the same basic principles of: I think the design, what are the key information points, the key takeaways, that you’re trying to provide on this page?

Ethan:

I’d be interested to hear a little bit, Tina, as you guys have been doing more of this modular, multi-screen work, if your design process has changed much internally. Have the applications and tools your designer are using changed significantly in recent months?

Tina:

Not really, I’d say, because we have been using agencies pretty significantly, so we have worked with Code and Theory on the actual design and creation of our destination sections. Homepage, we were able to work with AppendTo to kind of rethink the IA and how the homepage should function. So I think our internal designers haven’t been as exposed to it, and I think on our promotional pages, which we do more in-house, those are fairly basic. We are putting together a responsive design training session, and just to clarify, our experience here at Celebrity with responsive is new. Our homepage launched in February, and destinations in May, and so now we’re just starting into July, so we only have maybe six months under out belt of actually putting responsive code into production. So expect as we continue to evolve the site, we will have more experiences with new and different tools.

The only new and different tools for us were, I guess your standard collaboration tools. So from Version One and have been different kind of repositories for collaboration. I don’t think they’re necessarily unique to responsive. I know there are frameworks and the project that we partnered on with our sibling brand Royal Caribbean International, we used a specific framework with a different agency, so I think that is a point of view too. We chose a company that was really focused on performance, mostly page speed, and had a custom framework, and so we needed to train the supporting crew here on our staff as well as some other staff augmentation services that we use to ensure they understand the way our core agency AppendTo had put together the framework for responsive. So I think that’s the key piece for us is understanding how the libraries are functioning and just different ways to integrate the code.

One concern that we had in terms of our modular framework was crawlability from search engines, thinking about visual content versus text content, some of the tagging. I think our ability to be found in search became a concern for us in terms of content that we’d chosen to present.

Karen:

One of the things I’ve heard other organizations say is that the responsive process really put a tight spotlight on the content that they were creating and some of the messages that they wanted to deliver, and it really called into focus places where the content wasn’t doing its job. Did you make changes to your content as part of this responsive design?

Tina:

We definitely did. I think because these projects were on sections of our site that we knew needed a refresh, there was not as much of a pressure from responsive to change the content, as much as it was to think through what types of content were really going to drive conversion. We really wanted to get more into the content testing category, we want to do some content mapping for our users, do more A/B testing and segmentation to understand what content resonates the most with our users. I don’t think it was responsive so much that it drove those discussions. I think that one concern that we had in terms of our modular framework was crawlability from search engines, thinking about visual content versus text content, some of the tagging. We discovered that some of the ways that we were designing visually were not as search friendly from a JavaScript perspective and we looked to understand the delicacies of all this. I think our ability to be found in search became a concern for us in terms of content that we’d chosen to present in our destination section.

Karen:

Tell me, especially because you were working with outside agencies, as your marketing or your editorial team was making changes to the content, how did you ensure that your internal teams that were working on the content and the external teams that were doing the design and development, how’d you make sure that they worked together?

Tina:

Some very good project management. I think that was part of the issue with sizing of images. We’d also brought together content types from different parts of our organization. Just some of the basic issues: for example, we have shore excursions at each of our ports and we have over 360 ports of call. Each year our ships are going all over the world. We have one team that creates assets for these experiences all over the world, whether it be scuba diving or whether it be taking hikes, or snorkeling, or visiting with glaciers, all kinds of different things that we do. So we have one set of teams internally that captures those assets and we have another set of teams internally that actually delivers our brand assets and we’re also getting UGC from our ratings and reviews platforms. We had to think about pulling together all this content in a way that was going to be properly resized, properly weighted for our different modules that were going to be in destinations. I think that was something that we really had to look at very carefully from a creative side to make sure there was consistency in what we were displaying.

Ethan:

Can you tell me a little bit about how you reviewed the work in progress with the rest of the organization internally? Did you do anything different when you were doing more responsive work?

Tina:

Well, our team is somewhat self-contained so we definitely have really rich conversations with folks on the brand side, talking through how the design supports our brand position of “modern luxury.” I think part of that discussion was managed earlier on in the process. Then we had teams here internally, with the digital teams, so the content team, the creative team, the product team, would review iteratively with our IT team, with the agency, the creative agency, and the responsive coding agency. I guess we try to follow an agile process but we didn’t have a very vertical approval process, which I guess we were blessed with, because once the initial concept was approved we were able to move forward relatively easily.

We would really rely on testing tools and patterns as the best determinant for what should go where. So click-through rate in a module for us is really the most important driver. I think it’s much more about the analytics, and that’s where we were able to determine the best place for the content.

Karen:

Was it different presenting to stakeholders for reviews? Did you run into issues where people were questioning the priority of information on the page or where their “thing” was going to appear?

Tina:

I think that was a key difference from working in media, where we were very focused on the content and the way that I think as a brand, we do have a lot of examination of, but it’s more for tone, voice and not as much for conversion. The digital team focuses on the path to conversion: did we connect each port to an itinerary page, which is the first step to getting you into the booking funnel. So I think the process was a little bit different in terms of the goals of it, unlike when working for places like Time where you have these super-sophisticated editors and their job was to deliver the most amazing, compelling story, that were accurate and represented the news.

I think that was a very different experience here because there is a hierarchy of information from a storytelling, journalistic perspective that we didn’t struggle with as much here, because we would really rely on testing tools and patterns as the best determinant for what should go where. So click through rate in a module for us is really the most important driver. Is destinations pushing more people to book? What’s the exit rate? I think it’s much more about the analytics, and that’s where we were able to determine the best place for the content. We’ll continue to play with that formula. We’re just getting baseline data now and we’ll continue to move that forward.

Ethan:

Tina, When you’re talking about measuring conversion paths, were stakeholders expecting to review some of these key workflows at different breakpoints? Was that part of the review conversation at all?

Tina:

No. I think our internal team, we have certain key KPIs. So the product owner for destinations knew that one of his main jobs was to drive traffic into the booking path. That’s a measure that we look at here for our team, and our team is ultimately responsible for the revenue coming from the website. It’s really our group’s KPIs and our responsibility. We definitely got feedback from people on our sales team, our upper management team, the brand team, we definitely wanted to get feedback on how we could make this destinations experience as best as possible, the tagging and analytics would be something that my team would really own.

Part of the fun of our project was not only rethinking the front end, we were also working simultaneously with our IT team to completely re-platform the site. So we were integrating the front end into componentized content on the back end that would presumably speed up page load.

Ethan:

That sounds great. One question that comes up is, you mentioned performance at the beginning of the interview, which is one of my favorite topics. Is that something that was really part of the conversation during some of your responsive redesigns? I’m just curious how Celebrity defined performance and how they continued to evaluate it during the design process.

Tina:

The direction that we gave to the agency was certainly that the site could certainly be no slower than it is in this non-responsive form. We were also putting together metrics for a new platform so part of the fun of our project was not only rethinking the front end, we were also working simultaneously with our IT team to completely re-platform the site. So we were integrating the front end into componentized content on the back end that would presumably speed up page load. There were two key success metrics: looking at the before and after, which is the front-end piece, and then looking at the impact of our back-end integration so that way we were powering the consumer experience. It was really a conversation with AppendTo and we’re just lucky because they have a strong expertise and we could trust their benchmarks. I saw the strong results they provided for us at Time but then I also know they work with a lot of other companies. So performance was something that we in many ways deferred to the experts.

We have about 3× increase in traffic coming to us from mobile devices. We think that as we continue to promote across devices, we expect that number to go up even higher.

Karen:

I love talking to organizations that do a lot of work in measuring conversions and tracking data that comes out of people’s usage of the tools. Can you talk about how you measure the success of this responsive design? Do you track leads or track conversions across mobile or desktop, or web versus app, for example?

Tina:

We’re really rethinking our mobile strategy and one of the key drivers, one of the key components is, perhaps not the sexiest, but perhaps is a course of interest for those of us here on this podcast, is how do we consistently track across devices? Looking for ways to follow that user from each path of the journey. We’re really hoping to drive more logins as a way for us to do this, to follow the user across devices, but that’s our bigger term thinking. For destinations specifically we do look at percentage of traffic coming in from different types of devices. We do know, for example, that when we started the project, we’re at currently, especially for homepage, which we monitor a little more closely, it’s a little cleaner, we have about 3× increase in traffic coming to us from mobile devices. We think that as we continue to promote across devices, through mobile advertising, through mobile PPC [pay per click], through just the way we’re presenting the links within emails, we expect that number to go up even higher. We’re definitely looking at percentage of traffic coming in from mobile. We’re not doing conversion by device just yet. We definitely want to get there. We’re basically taking baby steps right now though. Essentially is our redesign driving more bookings at the very high level and then how is it impacting traffic?

Karen:

This has been fantastic and so interesting to hear you talk about how you’re rolling out this strategy over time. I’m really going to look forward to seeing more of what you guys have in the future. Thanks for being on the show today.

Tina:

Great. Thanks for having me.

Ethan:

Thanks to everyone for listening to this episode of a responsive web design podcast.

Karen:

If your company wants to go responsive but you need help getting started, we offer a two-day onsite workshop to help you make it happen. We’re also planning to offer these workshops to the public, so please go to responsivewebdesign.com and let us know that you’re interested.

Ethan:

If you want even more from us, you can sign up for our newsletter, subscribe to this podcast, and read full transcripts of every podcast episode at responsivewebdesign.com.

Karen:

Thanks again to our sponsor, Campaign Monitor. Be sure to visit campaignmonitor.com and check out their email editor, Canvas. Thanks for listening, and we’ll be back next week.


Skip to our site navigation; skip to main content