Guest Profile for OCEAN.com
Carnival Corporation // 2018

the projEct

The task was to redesign the Ocean.com Guest Profile for the desktop website. OCEAN is the parent company of all Carnival cruise lines. The Guest Profile allows the user to edit and view personal information, account information, existing and upcoming cruises, travel documents required for cruising (e.g. passport or birth certificate), payment methods, and profile pictures. The original designs were created solely for the Compass mobile app. This redesign was to include desktop and mobile site dimensions. The previous Ocean Profile design (designed by the lead partner at the time) used elements from the "bubble" design system and fit into the N/S/E/W interaction model (see Second Screen for N/S/E/W interaction model). It also contained entry points for multiple guests within travel parties.

Redesign Objectives:

  • Modularize "content buckets" to move away from the original bubble design.

  • Tailor profiles for individual guests and remove unnecessary content buckets for the next release.

  • Enhance scannability of guest information and facilitate easy editing of each section.

Notification Toast Design:

  • Designed notification toasts to alert guests of their OceanReady status, a branded experience collecting necessary guest information for cruises (Journeys).

  • Notification states included:

    1. Profile after sign-up.

    2. Guest submits certain information; has Journey.

    3. Guest completes OceanReady; has Journey.

    4. Profile with no information present.

Visual Treatment Revision:

  • Revised visual treatment, moving away from a blue ocean gradient.

  • Progressed toward a simple white treatment while adhering to OCEAN type and color standards.

TEAM

I collaborated with the Design Manager in creating the initial rough wireframes. The Design Manager and Design Project Manager determined the required "content buckets" necessary for the redesign. After the initial planning and wireframing stage, I was the primary designer.

CHALLENGES

Iterative Design Changes:

  • Multiple iterations conducted based on feedback from the Technical Project Manager (PM) and development team.

  • Adjustments made to the design to accommodate technical constraints and requirements.

Content Element Reduction:

  • Significant reduction of content elements from the initial design for the first release.

  • Required updates to interaction guides to reflect the changes for development teams.

Impact on Delivery:

  • Despite late feedback necessitating changes, the delivery timeline remained unaffected.

  • Successful implementation of design adjustments without compromising delivery deadlines.

RESEARCH AND PROCESS

1. Identify Area of Improvement:

  • Review the original design of the Guest Profile and identify scannability as a key area for improvement.

  • Note that the original content buckets lacked clarity in indicating the information they contained.

  • Recognize continuous scrolling as a pain point resulting from the bubble design system.

2. Conduct Research:

  • Research user profiles on commerce and travel websites, such as Amazon and Alaska Airlines, to observe how they organize sections of guest information.

  • Note the presence of easily interpreted naming conventions for grouping sections.

3. Assess Profile Requirements:

  • Recognize the potential for Ocean Profile sections to contain copious amounts of guest information, including Account Information, Personal Information, and Travel Documents.

  • Understand the unique nature of some information pertinent to the cruise industry.

4. Design Adjustments:

  • Retain the original structure in some flows and forms (e.g., Travel Documents) but introduce new UI elements to accommodate entry points and document submission.

  • Emphasize the need for clarity in displaying and interpreting guest information.

5. Prototype Development:

OUTCOME

Walking through the design with dev teams required creating an annotated document for all components of the Guest profile. These annotations included every interaction for each unique form component, button, link, and CTA. They also accounted for different states of the Guest Profile (e.g. OceanReady states) and captured the flows within each section. I received feedback through each iterative review with the technical PM and dev team, and made changes to reflect that. When the design was completed, redlines were exported via SketchMeasure and delivered to dev teams along with the annotated document.

Wireframes

Initial Concepts. Desktop wireframes demonstrating different approaches to modularize each content bucket, while surfacing information that describes each section.


Concepts

These designs display features and components (Choose Tagalong, Affinities, Shared Photos, etc.) that were removed for the final release. 

Sample of the Final Design. These screens demonstrate the various states in which a guest is OceanReady and their related annotations as showed in the annotated document. Due to development delivery constraints, three buckets of content (Personal Information, My Account, and My Trips) were the remaining components (My Trips links to a different experience outside of the Guest Profile). Click here to download the full annotated PDF.