The Problem —
As the industry leader, Clam recognized their e-commerce site was falling behind. Frequent functionality issues were leading to order errors, and the outdated design no longer matched their forward-thinking brand. They needed a complete overhaul to deliver a seamless, modern user experience.
What I Did —
Working with Clam’s leadership, I shaped the site’s visual direction, focusing on community and inclusivity to move beyond their "Big Blue" perception. I designed wireframes, reusable components, and interactive features while coordinating with the dev team to keep the project on track.
Building through research —
By conducting stakeholder meetings, user interviews, and market research, we uncovered important business objectives and user challenges. These findings were shared with Clam's team through detailed customer journeys, user personas, and SEO-driven insights.
Balancing our findings with the project’s timeline and budget, we focused on the following goals:
• Restructure products for easy navigation, ordering, and purchasing
• Promote inclusivity through imagery and tone-of-voice
• Simplify the UI while ensuring the brand stands out in the market
• Enhance mobile user experience
Brand Audit —
With time being a critical factor, I balanced involvement in ongoing research with compiling Clam’s brand elements, website design, and competitor analysis. This helped identify key opportunities for differentiation in the market. I developed a moodboard showcasing various styles for key components, which I presented to the Clam leadership team to gather feedback and align on the design direction.
User Flow & Information Architecture —
Using research insights, I collaborated with the content writer to structure the site, define product categories, and design page templates. Multiple rounds of meetings with Clam’s leadership team ensured every detail was refined and both teams were fully aligned.
Wireframes & Templates —
Using the moodboard as a guide, I developed mid-fi wireframes that set the foundation for the homepage UI and overall brand appearance. As I worked through additional page templates, I focused on reusable components to streamline development, ensuring consistency and alignment with Clam's refreshed brand vision.
Navigation —
To minimize navigation overload, I implemented a step-by-step slide-out menu, simplifying the user’s path through the site. This approach not only organized content into more digestible sections but also enhanced the overall user experience by reducing clutter. It seamlessly transitioned into mobile design, offering a smooth and intuitive browsing experience across all devices.
Shopping Experience —
Streamlining the shopping process with simplified filter options on category pages, allowing users to compare multiple products and add items to a "Wish List" for future purchases.
To cater to Clam’s diverse product range, we developed four variations of the product page:
• Simple
• Configurable with dropdown selectors
• Configurable with button selectors
• Grouped products with an "Add to Cart" option for multiple items at once.
Final Product —
The final design of Clam Outdoors’ website introduced a modern, user-friendly interface that simplifies navigation and streamlines the shopping experience. Lifestyle photography and a refreshed aesthetic reinforce their focus on community, helping to push the brand forward while staying true to its core values.