Scubaba.com redesign

At Scubaba.com, a startup transforming the reservation process for divers and dive shops, I collaborated with a small team to elevate the brand aesthetics and user experience. I designed and developed the front-end framework and component library to support the fast-paced and engaging brand.

After overhauling the entire website, we saw increased engagement in dive guides, blog comments and shares by over 30%. Dive shops signing up increased by 10% and dive reservations increased by 15%.

Scubaba cover

Search results

Divers wanted more search options and the ability to see locations near their travel destinations. We ran A/B testing with divers to understand how they would want to search. We learned they wanted more visuals, a easier way to filter by dates, and a larger map view. We learned dive shops wanted to showcase their logo and reviews on the search page.

I enhanced the search page by visually emphasizing dive shops, liveaboards, and dive sites. I added a large interactive map, essential filter options, and emphasized pictures to improve the overall user experience.

Old vs new search results

Making a reservation

Streamlining the reservation process was crucial. Each listing offered various options such as dive packages, single dives, certifications, and equipment. We ran A/B testing with divers to understand how they would want to choose their dive packages. We learned they wanted a tabbed structure with each package displayed rather than in an accordion. We learned they also wanted to see their cart updated in real time as they added packages to their cart. We learned dive shops preferred the tab interface in order to give the diver everything that was offered without scrolling down the page for a long time.

I established an improved visual hierarchy and designed a streamlined approach for divers to add everything they needed, along with a real-time detailed view of their cart. This enhanced the user experience and increased reservations by 15%.

Old vs new reservations

Scubaba.com’s design system

During the overhaul of scubaba.com, I created an updated UI and front-end including colors, typography, icons, components and patterns.

Dive shop profile

Divers struggled to find where to make reservations, view pictures, and understand full reviews. I improved the listing page by highlighting the reservation feature, providing more available pictures, and emphasizing total and individual reviews.

Old vs new listing

More redesigned pages

After overhauling the entire website, we saw increased engagement in dive guides, blog comments and shares, reservations, and the number of dive shops signing up.

Dive shop
Dive site
Map view
Previous
Previous

NFG UI design system

Next
Next

Network for Good refresh