Project Overview- A rental company needed branding and a strong online presence.
Design Problem- Customers had no way to reserve equipment.
The Goal- Create an engaging, user-friendly website with a live availability calendar and secure payment options.
Result- The new website, branding, and catchy name are primed to excite paddlers and drive business growth.
Role- Lead Designer
Status- Concept Work
Timeline- 8 weeks
The UX design process: research, ideate, prototype, test, iterate… wash and repeat.
User Interviews- Subjects viewed paddling as a relaxing escape, but frustrations finding rentals led them to choose other activities.
Empathy Maps– Data was organized to visualize user experiences and identify pain points.
Fictional personas- Represent key user groups.
Branding & Naming- A memorable name and strong visual brand was vital to create an instant connection with adventure-seeking clientele.
Site Map- Strong information architecture ensured frictionless navigation. This was updated as the design evolved.
Low-Fidelity, Mobile-first Wireframes- Hand-drawn sketches rapidly explored dozens of design options. Initial focus was on the 85% of users who book rentals on their phones.
Responsive Design: Flexible layouts ensured a consistent experience across desktop, tablet, and mobile.
Mid-Fidelity Wireframes- Digital wireframes focus on layout, usability, and functionality.
Mid-fi wireframe tablet Figma prototype.
Prototypes in Figma– Clickable mock-ups simulate flow, enabling hands-on testing and stakeholder feedback.
Usability Study- Tablet format was selected for this research to enable seamless interaction while uncovering insights and opportunities for improvement.
Design System– A cohesive framework with consistent components reinforces the brand.
Accessibility– WebAIM guidelines ensure contrast and font choices enhance readability.
High-Fidelity Mockups & Prototype- Detailed designs aligned with branding and accessibility standards.
High-fidelity mobile Figma prototype.
Key screens- This desktop view highlights the consistence of design across platforms.
Light/Dark Mode Design-Adjusted colors and contrast for readability accessibility and brand consistency.