Boat Dockter
Responsive Website Redesign
Project Overview
Boat Dockter is a boat rental service that struggled with high call volumes and low user trust due to an outdated website.
This project focused on a complete UI/UX overhaul to enable users to book rentals quickly and independently, even outside of business hours, ultimately freeing up staff and increasing conversion rates.
Role
UX/UI Designer
Timeline
1 month
Jump to Section
Empathize
Secondary Research
|
User Interviews
|
Competitive Analysis
How I discovered the problem
As someone who traveled to Texas’ Highland Lakes area recently and attempted to plan a boat rental but failed, because of online booking barriers, I felt this would be an interesting project.
Imagine it’s 100 degrees outside in the peak of a boiling Texas summer. You decide it’s time to hit the lake and spend some time on the water. You search up boat rentals in the Lake LBJ area. You select Boat Dockter because it’s one of the top results. This is the first thing you see:
Despite the strange appearance, you’re curious. You scroll down further:
Wanting to see more information, you hesitantly select the “book now” button, hoping it doesn’t go straight to the payment window!
By the time you reach the payment window, you’ve lost trust in the security of this website and aren’t interested in putting down your card information.
Because of these issues, what should have been a quick task turns into a 10-minute ordeal.
How the competition guides their users (and how Boat Dockter can do better)
Splash Boats
Home Page
Booking Window
Wave Chasers
Home Page
Booking Window
Boat Setter
Home Page
Booking Window
Boat Dockter offered the same fantastic services as their competitors,
but their digital presence was failing them.
To validate these concerns about the website,
I conducted User Interviews.
I interviewed 5 participants in various age groups with experience booking online, and asked them to complete these tasks:
Find out the cost of 22ft Bennington Twin per hour
Book a 22ft Bennington Twin for 4 hours with no adds ons
Interviewees were also asked to complete a survey about their experience with the website as a whole.
I used the System Usability Scale survey which measures perceived usability. The industry average is 68.
Boat Dockter’s current website was given an average rating of 32.5
These consistently low scores indicate major usability issues and confirm that users found the website confusing, inconsistent, and difficult to use.
Next, I needed to know what users thought about these walls of text ->
When reviewing the content-heavy pages, users reacted with comments like, “that’s too much” and and “I’m not reading all of that.”
This prompted us to explore how users determine what is necessary to read and how we might better understand what information they perceive as essential from their perspective.
I gave the users 40 cards, each one representing an idea from the website.
They were asked to organize the cards and label each group they made.
Afterwards, I asked for their overall thoughts on the website. Here’s some of what they had to say:
“There was a lot of text all over the place and it was too busy.”
“This website looks like a scam.”
“It looks like
a word document.”
“It was awful.”
“I said ‘ew’ when
I opened it.”
“It looks like a suspicious website.”
“The booking was difficult. You have to count out the hours.”
Define
Problem Statement
Two main issues stood out
While thinking through all the complaints mentioned directly by users (as well as issues found from secondary research and competitor analysis),
I noticed that all complaints fell into two camps:
Booking Process
- Booking window does not help users estimate pricing
- Booking flow makes it difficult to go back
- Checkout totals shown out of order
- No error handling or validation
- Two separate webpages create confusion
Shady Interface
- The design is unprofessional
- Looks suspicious
- Poor spacing and layout
- Outdated design
- Visually unappealing
Considering these priorities, we established the following problem statement:
How might we make booking a boat rental online feel
trustworthy and effortless?
Ideate
Feature List
|
Site Map
|
Task Flow
With the problem clearly defined, I began prioritizing.
What are the most critical elements to focus on?
Feature #1
Trustworthy: Establish credibility through a refreshed user interface.
Feature #2
Effortless: Create a smooth and intuitive booking process.
Drafting Feature 1 began with
Information Architecture.
Clear organization signals professionalism. Information Architecture is the foundation to credibility because it defines how information is structured, organized, and prioritized before any visual design is applied.
Old Site Map
New Site Map
Drafting Feature 2 revolved around simplifying the booking process.
To solve this, we designed a streamlined flow that guides users directly into a clear, asynchronous booking experience.
User Flow Diagram
Using insights from the card sorting exercise, we identified and prioritized the most important information users need to complete the booking process with confidence.
Prototype & Test
LofI Wireframes
|
Usability Testing
|
Iterations
With a new process designed, we needed to prototype each screen before creating the interface details.
The focus at this stage was purely on layout, information hierarchy, and task flow efficiency. These wireframes allowed us to test the new progressive layout early and observe whether users understood the flow without UI polish or visual cues.
To validate my changes to the design, I conducted Usability Testing.
I interviewed 5 participants in various age groups with experience booking online, and asked them to complete these tasks:
Find out the cost of 22ft Bennington Twin per hour
Book a 22ft Bennington Twin for 4 hours with no adds ons
After being given time to explore the website, interviewees were also asked to complete the usability survey again.
Participant scores before the redesign averaged at 32.5,
after the design the average score rose to 93!
Afterwards, I again asked for their overall thoughts on the website. Here’s some of what they had to say:
“It’s really easy.”
“I liked the photos and that the site has one header now.”
“Looks like how a website should!”
“It’s easier to find info and the text and contrast is easier on my eyes.”
“It’s pretty clean. I love the different varieties of blue.”
“100x better than original.”
“Booking was straightforward and fast.”
During usability testing users noted friction within the booking window, which was originally spread across three pages.
Based on this feedback, the flow was consolidated into a single page to reduce cognitive load and make the process feel faster and more intuitive.
Original
Draft
Final
Users also expressed a need for location context.
In response, visual cues such as a map or location imagery were added.
Original
Draft
Final
And now for the final result!
Final Design
High Fidelity Wireframes
|
Mockups
Good Usability = User Trust
The complete redesign of the Home Page and overall UI modernized the platform. By looking professional and current, we immediately alleviated user skepticism and increased perceived service reliability.
Effortless Booking, Anytime
We replaced the complex single-page process with a clean, five-step flow featuring a progressive indicator, allowing users to book a rental faster and with full confidence in their selection..
Fewer Calls, More Conversions
By making the online booking experience intuitive, we enabled customers to self-serve 24/7. This directly achieved the goal of the business: receive less calls by moving booking volume online.
Impact & Takeaways
Project Impact
The redesigned concept directly addressed the core usability challenges and was evaluated through structured user testing. When measured using the System Usability Scale (SUS), participants rated the new interface significantly higher than the previous experience, indicating a strong improvement in perceived usability.
The updated visual design also had a measurable impact on user trust. Participants consistently described the sleek, modern interface as more reliable and professional, reinforcing the idea that visual clarity plays a foundational role in perceived credibility.
Key Metrics
Usability Score Improvement
+60%
Trust Rating
100%
Task Completion Rate
100%
Task Time Reduction
-40%
Reflection
While user experience and visuals are not the same, a bit part of a user experience is dependant on trust. Many interviewees expressed that they would not rent a boat through this website because it was suspicious and they couldn’t trust it to process a card payment.
Additionally, information architecture plays a huge role in what users a willing to learn. Prior to the redesign users didn’t want to know anything extra about Boat Dockter but by making it a structured part of the booking process that only disclosed info as it was relevant to each booking situation, users were not bothered.
Key Lesson
“Trust is designed. Visual polish and strategic information disclosure work together to create confidence in digital experiences.”