rectangle background SUP baby blue.png

I SUP Sarasota

I SUP Sarasota

I SUP Sarasota desktop mocks largest.png
 

UX research & Product Design Case Study

 
 

Background 

"SUP" is an acronym for Stand Up Paddleboard. It's a recreational sport. I SUP Sarasota is a company that rents SUP equipment as well as offers guided eco tours on SUPs. They are a full service mobile SUP company that services Sarasota County in Florida. With their help you can explore the preserves and beaches in the Gulf of Mexico.

 
 
 

My Role

User research, information architecture, user experience design, interaction design, wireframes, responsive design, logo design, brand development, visual design, responsive user interface design, usability testing and test interpretation.

 
 
 

Project Scope

  • Redesign the company logo 

  • Develop the company brand

  • Create a website that is responsive across desktop, tablet and mobile platforms

  •  Website features: 

    • Make a reservation to rent SUP equipment

    • Schedule a guided SUP eco tour

    • Learn about the company

    • Read customer reviews

    • Read frequently asked questions

    • Learn about SUPing as a recreational sport

    • Contact the company

    • Provide links to the company's social media accounts

    • Join the mailing list

 
 
 

Tools 

Sketch, Adobe Photoshop, InVision, Google Slides, Trello, Slack, Skype and Pinterest.

 
 
 

Motivation

Growing up in Florida, being in the water has been an intrinsic part of my life. I enjoy surfing, kayaking and stand up paddleboarding. Wanting to flex my branding, ux, web and logo design muscles, I found a stand up paddleboarding company in need of a digital makeover. Being familiar with and having a passion for their sport, I was excited to work with the client, I SUP Sarasota.

 
 

 

research > strategy > Design > test

 

 
 

UX Research

Methodologies

  • Secondary Research

    Researched: adventure education; outdoor recreation statistics; the health fitness revolution; the physiological, musculoskeletal,  psychological benefits of SUPing; the history of stand up paddleboarding. 

  • Competitor Analysis

    Analyzed competitor websites for information hierarchy, site flow, navigation and user interface design. Noted design trends. Identified innovative and stunning solutions. Noted the existing website's pain points as well as what I found desirable.

  • Primary Research

I created a survey to gather quantitative data. The survey was completed by 14 stand up paddleboarders. I conducted personal interviews with the Company owner and his customers.

 
Owner quote for research.png
Customer quotes.png
 

The interviews and survey informed my decision to include the pro's of renting vs. taking a tour on the new website.

 
 

 

The motivations for and benefits of SUPing peaked my interest. Including them on the website is educational and helps sales.

motivations and benefits.png
 
 

During competitor analysis I realized all of the SUP rental companies in the area offer their rentals for either four or eight hours, including I SUP Sarasota. In other cities around the country businesses also offer a two hour rental. My survey showed that the demand is actually highest for a two hour rental. I recommended that I SUP Sarasota offer this, to differentiate themselves from their local market and increase sales.

How many hours would you like to rent a Stand Up Paddleboard for?

 
 
 
 

Strategy 

Personas

My research identified two main customers for I SUP Sarasota, the local and the tourist. I created two user personas; realistic representations of the Companys' clientele. 

 
 
 

Sitemap

A core part of UX design is determining a website's information architectutre and navigation. I created a sitemap to show the organization of the websites pages, categories and content. 

 
 
 
 
 

User Flow

The user flow illustrates the path my two personas take through the website in order to complete the primary task of booking a reservation. It is a technical diagram which is focused on decisions, actions, navigation and flow.

 
 
 
 
 
 

Design

Wireframes

I made wireframes, the architectural blueprint of my website's design, to show the information hierarchy and lay out the elements of each page.  I made a prototype with the wireframes which I tested repeatedly to confirm that my developing design was well organized. 

 
 
 

Branding Elements

Color palette, typography, logo, wordmark, watermark, shapes and a repeat pattern were created to rebrand I SUP Sarasota. I sourced and curated the photos used throughout the site.

 
 
 
 
 

UI Kit

I created an assortment of graphic files including user interface and user interaction design components as well as patterns.

 
 
 
 
 

User Interface

I implemented my branding, user interface and user interaction elements throughout the wireframes, turning them into high fidelity designs.

 
 
 
 

TEST

Affinity Map

I tested a prototype of the website with potential users. Audio recordings and notes of the test sessions were taken for documentation. The affinity map visualizes the feedback from those sessions. It helped me prioritize which aspects of my design to redress. I repeatedly returned to my designs and made improvements, catering to the user needs. 

 
 
 
 
 

Prototype

I applied the changes from the affinity map to the designs and final prototype. A prototype is an interactive mock-up of a digital product. It allows users to navigate from webpage to webpage and use a limited amount of functionality. Going through the prototype gives you a tour of the website. 

Click on the blue hot spots to move forward through the prototype. 

 
 
 
 

Next Steps

Since the Company has many returning customers, creating a registration and login page for the website would be a logical enhancement. Also allowing users to save their credit card information and see their purchase history would increase the UX for repeat customers. 

 
 
 

more case studies

Women Who Ride: a motorcycle app

Women Who Ride: a motorcycle app

Bandsintown: additional features to an established mobile app

Bandsintown: additional features to an established mobile app

Contact me to see my most recent work.