The UX Transformation of Byron Bay Candles
Vita Addelia
Like this project
Posted Apr 3, 2025
For Byron Bay Candles, I combined research-driven UX design with scalable development to craft a site that enhances the customer journey and drives conversions.
Warm Experiences: The UX Transformation of Byron Bay Candles
Deliverables
User research and insights report
Wireframes and high-fidelity prototypes
Responsive website design optimized for mobile, tablet, and desktop
Usability testing and post-launch support
Timeline
2024
About the Client
Introducing Byron Bay Candles is an Australian brand specializing in eco-friendly, hand-poured candles made with natural waxes and essential oils. Their audience includes environmentally conscious shoppers, home decor lovers, and gift buyers seeking premium, sustainable products.
What Problem Needed Solving?
Key Pain Points
Poor Usability Scores: The homepage and navigation scored -10.4/100 on desktop and 2.3/100 on mobile in a UX review.
Search Failures: On-site search scored -10.4/100 on desktop and -8.5/100 on mobile, frustrating users trying to find products.
Navigation Issues: Users struggled to browse categories, leading to drop-offs.
Business Goals
Redesign: Create a more intuitive and engaging experience.
Fix Navigation: Make categories easier to browse.
Improve Search: Enhance search accuracy to help users find products quickly.
Optimize for Mobile: Ensure a seamless experience across devices.
Core Principles
Designed to create an intuitive, efficient, and accessible user experience by simplifying navigation, enhancing product discovery, and optimizing search functionality.
How Research Guided Decisions
Product Filters vs. Categories
Users had to navigate through overly specific categories, making it harder to see a complete range of products.
Solution: Use Both Filters and Categories
Categories: Group candles into high-level categories to help users navigate distinct product types.
Filters: Within each category, use filters for shared attributes to allow users to narrow down their options further. “Scented Candles” category. Filters for “Scent Family,” “Size,” and “Attribute” within that category.
Benefit: Users can easily browse distinct product types through categories, while filters allow them to refine their choices quickly. This combination enhances product discovery without overwhelming users.
Why It Works:
Categories help organize the site and make it easier for users to find the general product type they're looking for.
Filters allow users to dive deeper into specific attributes without losing sight of the full range of products.
This hybrid approach gives users more control over their shopping experience, improving navigation and product discoverability.
Courtesy Navigation: Keeping It Clear and Functional
Sitewide courtesy navigation (e.g., “Sign In,” “Contact,” “Help”) was mixed with the main product navigation. This cluttered the interface and made it harder for users to focus on browsing products.
Solution: Separate Courtesy Navigation from Main Navigation
Desktop Implementation:
Grouped courtesy links (e.g., “Sign In,” “Track Order,” “Contact Us”) into distinct sections.
Used visual separators, dropdown menus, or placement in a header bar to ensure these links didn’t compete with product categories.
Mobile Implementation:
Added clear visual separation between courtesy links and product categories using white space, lines, icons, or different background colors.
Ensured courtesy links were easily accessible but not in the way of product browsing.
Why It Works:
This separation reduces distractions and keeps the main navigation focused on products, which improves the browsing experience.
Courtesy navigation remains easy to find, ensuring users can still access account or support features without disrupting their shopping flow.
Search Results Visibility: Making Results Easy to Spot
The total number of search results was difficult to see due to small font size and lack of visual emphasis. Users struggled to gauge how many products matched their query, impacting their browsing efficiency.
Solution: Enhanced Visibility
Increased Font Size & Contrast: Made the result count larger and used a more noticeable color for emphasis.
Added White Space: Separated the result count from other elements to reduce visual clutter.
Positioning for Clarity: Placed the result count near the search bar or at the top of the product list for immediate visibility.
Why It Works:
Helps users quickly understand search scope and refine queries if needed.
Reduces frustration by providing clear feedback on search performance.
Search Autocomplete: Enhancing Search Usability
Limited or no query suggestions made it harder for users to find products efficiently. Users had to type full queries manually, increasing the chance of errors or missed results.
Solution: Implemented Autocomplete for Search Queries
Product and Category Suggestions: Displayed relevant product names and categories as users typed.
Error Prevention: Included misspelling corrections and alternative suggestions.
Exploration & Guidance: Suggested popular searches, product categories, and related keywords to help users discover more options.
Why It Works:
Speeds up the search process by reducing manual input.
Helps users find relevant products faster, even with incomplete or misspelled queries.
Encourages product discovery, leading to better engagement and conversions.
Closing Thoughts
At Byron Bay Candles, our goal is to create a seamless and enjoyable shopping experience for our customers. By refining our navigation, search, and filtering systems, we’ve made it easier than ever to discover the perfect candle, whether they’re looking for a specific scent or exploring something new.
These improvements enhance usability and reflect our commitment to making online shopping as warm and inviting as our candles. With a more intuitive experience, we’re excited to help customers find what they love with ease and confidence.