What is RCI?

RCI is a timeshare exchange company with over 4,300 affiliated resorts in 110 countries. It functions as a member-based exchange marketplace, where timeshare owners can deposit their timeshares and exchange them for others.

My Role

My role with RCI was UI/UX designer. I worked within a team of 3 total designers, 2 data strategists, and rotating teams of engineers. I collaborated on all designs with the team and was responsible for crafting the final designs that were handed off to the engineers.

While at RCI I took on two major projects, as well as many other smaller projects that are not showcased here. These two projects were the creation of a new digital style guide and a redesign of the resort search experience.

Digital Style Guide

Overview

When I joined RCI the only style guide that was in place was an out-dated marketing style guide from over 10 years ago. This, along with the fact that there was never an in-house product design team lead to many errors and inconsistencies within the product.

Goals

1

Create consistency

Too many different colors were being used in the wrong situations. Similar experiences across the product should be designed with each other in mind.
2

Create rules

Create a simple, logical & scalable set of rules on how to use colors and typography within the product.
3

Growth

New styles should not restrict imagination and should facilitate product growth.

Old Palette and Typography

The original color palette contained 9 different colors with no defined set of rules. Shades, tints, typography and the use of icons were all used haphazardly with no clear system in place. The result was many different variations of the same color used throughout the product in places where the color should be consistent. The combination of all these inconsistencies created a very difficult user experience.

Result

Color

The solution consisted of a color palette that maintained the original 9 colors but was expanded in a manner to create a workable system.

Typography

Proxima Nova was kept as the primary typeface but the text styles were designed to be more responsive to varying devices and to be more adaptive to new UI components.

Grid and Growth

In order to grow a system of rules was put in place. Colored typography must meet the WCAG 2.0 contrast standards. Buttons and icons must also follow these contrast guidelines. Design of componets should adapt around an 8px grid with consistent 8, 16, 24, 48, 64 pixel spacing.

Search

Overview

When RCI was created, it began as a mailed direct-to-member catalog. Up until 2018 the web search experience was not much different than how it began over 40 years ago. Redesigning search was long overdue.

Goals

1

Simplicity

The amount of information on the page was overwhelming, unorganized and confusing. Both the search process and amount of information on the page needed to be reduced.
2

Reduced cognitive load

Help the users find what they are looking for and prevent them from abandoning search and calling the call center.
3

Be visual

Location was the most important factor for members when determining where to travel but no solution to this existed. Creating an interactive map to showcase the area could be beneficial.

Before

Simplicity

Filters were placed in multiple locations, alerts and fees were always being thrown in your face and the data on the search cards were put together with no clear hierarchy in place.

Reduced cognitive load

Keeping track of your search process was a huge problem. Members would frequently call the call center to help them find what they want.

Be Visual

No good solution existed for our users need to view and search resorts with an interactive map.

After

Simplicity

The old filter design created a lot of clutter that interfered with the search cards. Moving all of the filters to the one location in the nav bar helped to simplify the search experience. 

Reduced cognitive load

Often times different filters and search parameters would go unnoticed and would be hard to find. The single line of filters in the nav bar creates one point of reference during the search experience. When something is selected it will change colors and be accessible throughout the entire search process. 

Be Visual

The creation of an interactive map proved highly successful. The map allows users to directly scan the shoreline for beach resorts or scan major cities for resorts nearby. Location was our member’s most important requirement for booking vacations. We needed to give them a way to search with location first. 

Before

On the left, you will see the original search cards. These cards contained a lot of important information but were put together haphazardly. The resort ID number is located inside of the resort name which makes it hard to find, the location is styled the same way as the resort name, causing them to blend together.

After

On the right, you will see the redesigned search cards. The largest improvement with these designs was pulling the location out from below the resort name and calling it our in all uppercase at the very top of the cards. Members often would search solely on location, making this a necessary feature that received a lot of positive feedback.

Other improvements can be seen in the display of the price. By making the prices uniquely different from the other data within the card, we were able to reduce the cognitive load of the user by making it easier for them to scan down the page. 

Leave a Reply