Iman Shams
Iman Shams

Club Sportiva

Club Sportiva

Creating and imagining a responsive set of flows for Club Sportiva's website. Designing responsive components for the user to book/reserve on the landing page. This redesign seeks to solve usability issues - including an aged website design/brand identity and evolving Club Sportiva's overall identity for a new look!

Club Sportiva Case Study

Creating and imagining a responsive set of flows for Club Sportiva's website.

Designing responsive components for the user to book/reserve on the landing page. This redesign seeks to solve usability issues - including an aged website design/brand identity and evolving Club Sportiva's overall identity for a new look!

‍

Problem Statement

Club Sportiva's current website and logo have various visual identities and usability issues that form an inefficient online experience for their long-term customers and core digital flow users. The company's luxury Car Rental Service is their top priority, and their current website does not allow users to view pricing or availability for most rentals. In addition, the existing site’s content is not clear in terms of prioritized layout and site navigationβ€”making UI choices hard for the user to determine.

‍

UX Research Methods

Comparative and Competitive research to observe how competitors offer luxury rental car services.

Customer Interviews to learn how users interact with their preferred online rental car companies.

Usability Tests to observe present pain points within club sportiva's current digital experience.

‍
‍

‍

Initial Research

I initiated my re-design with synthesized research on how travelers currently go through their car rental booking process via competitive analysis and usability testing of the existing site. The goal is to observe Club Sportiva's user booking experience through a customer lens to re-imagine their website in a visually compelling & usable way, best for travelers.

Competitive Analysis:

Direct industry-leading competitors analyzed for their app's available features, usability, and user accessibility.

‍

‍

Customers are attracted to exotic car rentals for a variety of motivations; I observed two different ways for a company to organize content:

Not being able to view price/availability without human/ai contact. The user can select the vehicle but is left with a CTA requesting for them to inquire, and a representative from the rental company would "reach out soon".

Transparent pricing/booking process, in which the user's booking process is designed within a module on the home screen for a swift booking process.

‍

‍

User Interviews and Usability Testing

Testing Objectives:

Understand user's Habits, Frustrations, and Motivations to develop a preferred persona(s).

Understand user insights to re-format the site for a more fluid user experience and luxury aesthetic.

After the 8+ user interviews and usability tests, I began to identify user patterns and designed an affinity map to show users' current key takeaways, surprises, key quotes, and pain points using the current website - Open Affinity Map

‍

Usability Insights

‍

Vehicle features/amenities are expected to be on clear display. All four participants noted this as the first thing they were looking for while renting a vehicle - Features on the vehicle like numbers of seats, gas mileage, etc., are also essential.

Participants two and three both stated rental companies need a filter/sort feature; options like manual transmission or convertible will allow club sportiva to give their users the option to make their renting process more personable.

‍

Define

‍

Understanding the User(s)

Based on my product goals and MVP, I concentrated on two immediate users of the rental car experience - Jason the Traveler and Alex the Enthusiast. I portrayed these two personas with paired empathy maps based on prioritized needs and pain points uncovered from my research.

‍

Design

Sitemap, User Flow, & Responsive Wireframes - foundational process to develop high fidelity deliverables.

Sitemap

Re-designing the structure of the website - Designing a streamlined user experience for the core digital user flow, including searching, booking, and online check-in experiences ( click on photo to open sitemap )

‍

User Flow

Main Persona Task: Jason plans to book an exotic vehicle for a business conference in two months.

Wireframes

Mobile Wireframes developed from revised layout sketches and research. Each page is specifically designed for simplicity. Minimal type usage is paired with large display images for ease of use/accessibility.

‍

Branding/UI

Re-creating the brand:

Based on the MVP, I re-branded club sportiva with a more modern interpretation in mind. A minimal, grand take was chosen for the new identity to highlight the vehicles/experiences presented on the website and in person.

‍

High Fidelity Design (Desktop)

‍

A modern, luxury design style was adapted for Club Sportiva's new website.

Flow One of Two - Rent a Car w/ checkout process.

‍

Flow Two of Two - Book the NorCal Sprint.

‍

‍

MVP Solution (Responsive)

Prior to the re-design, the mobile experience was not developed. Therefore, in designing the new site, I focused on crucial updated features with the project's MVP in mind - A responsive site that does not force users to download or install anything for ease of use.

A Clean, organized design handoff.

Lastly, a streamlined mobile user experience for an existing driving tour intended for core digital user flow, searching, booking, and online check-in experiences.

‍

‍

Testing My Re-Design

Objectives

    • Test the site's initial design's usability/standard user flow: Searching + Booking.
    • Test the quality of the site concerning competition design.
    • Test if interactive actions are usable and MVPs are resolved.
    • Observe sections of the design that create confusion - Can users find the item(s) and reserve efficiently?

Affinity Map

Overall feedback was positive, with a 100% success rate on all user tasks performed - Open Affinity Map:

Priority Revisions

After assessing the pain points and new design opportunities discussed with my participants, the second iteration of the prototype includes the following changes:

Revised Prototype

Click on photo to try prototype

‍

Conclusion

The prototype's final design was a great success because I allowed the MVP to inform which aspects I should prioritize for the website to offer a more intuitive experience. The result was satisfying as users found it helpful and calming to interact with the updated rental car website. All participants expressed that the streamlined process of adding the booking module to the beginning of the site allows for more straightforward navigation around the website - Now club sportiva can take advantage of the streamlined module to allow users an efficient premium experience.

Since this project was created within a 4-week sprint, there are a few things I would consider developing if time and resources were allowed:

    • Interviewing and collecting more insights from a larger audience
    • More rounds of user interviews as perspectives and usability tests to accommodate.
    • Expand on luxury design opportunities creating a more premium experience.
    • Design more responsive pages to test more of the different flows and experiences of the brand.
Follow up on Behance to view the prototype
Iman Shams Personal Portolio