James Avery: Transforming a Heritage Jeweler's Omni-Channel Digital Experience
Led the UX strategy and design for key aspects of James Avery's digital transformation, focusing on enhancing product discovery, streamlining customization, and modernizing the eCommerce experience on Salesforce Commerce Cloud.
Skills:Interaction Design, Design Systems, Prototyping, E-commerce Optimization, Front-End Web Design
The Challenge
James Avery, a beloved heritage brand, was constrained by its aging homegrown eCommerce platform. This legacy system hindered product discovery, offered a dated user experience, and couldn't adequately support the complex online customization and engraving crucial to their products. This impacted user satisfaction and limited conversion potential.
The Goal
To strategically migrate platform capabilities to Salesforce SFCC, redesign web experiences, and overhaul the jewelry personalization tool. The aim was to deliver a modern, intuitive digital experience reflecting the brand's quality, significantly simplifying the customization process, boosting overall eCommerce performance, while creating a delightful and confident shopping experience for customers.
My Role & Approach
As the design lead, I spearheaded the UX strategy and interaction/UI design for critical transformation initiatives. My approach involved:
- Synthesizing user research and business requirements to define clear design goals.
- Focusing on simplifying complex processes like customization and engraving.
- Enhancing visual storytelling to better showcase product details and brand heritage.
- Ensuring design feasibility and consistency within the SFCC ecosystem through close collaboration with technical partners.
Deep Dive: Reimagining Product Customization Tool
The Problem
The existing online customization and engraving process was unintuitive, lacked effective visualization of the final product, and resulted in significant user drop-off and frustration before purchase.
My Process
- User Flow & Heuristic Analysis
- Competitive Benchmarking (Jewelry & other customization sites)
- Iterative Wireframing & Prototyping (Low to High Fidelity)
- Usability Testing on key interaction patterns
The Solution
I designed a new, streamlined multi-step customization tool integrated directly within the Product Detail Page. Key improvements included clearer visualization of options, step-by-step guidance, real-time previews where technically feasible, transparent cost breakdowns, and robust handling of diverse product/engraving rules, creating a more intuitive, transparent, and trustworthy personalization process for the user.
Before
Constrained by a form-based structure, the original engraving process suffered from poor visualization and a confusing workflow, creating user friction and hindering confident personalization.
After
Implementing a visually-driven, guided approach, the redesigned customization tool simplified complex choices through interactive previews, directly addressing usability challenges and enhancing the overall personalization experience.
Elevating the Product Detail Page
The Problem
The legacy PDP layout failed to effectively showcase intricate product details, related items, and the crucial customization options. Poor information hierarchy and an outdated visual design hindered user engagement and made comparing intricate product details challenging.
The Solution
I redesigned the PDP with a mobile-first approach—reflecting dominant user Browse behavior—focusing on improved visual hierarchy through larger imagery and clearer typography. Information architecture was revised for better scannability, allowing users to quickly grasp key details and feel more confident in their selections.
The new design seamlessly integrated the customization tool and incorporated enhanced cross-sell/upsell modules tailored for SFCC capabilities.
Design System & SFCC Considerations
A key challenge was implementing a modern design vision within the constraints and capabilities of the Salesforce Commerce Cloud platform. To ensure consistency and feasibility, I collaborated closely with developers, contributed to component design within a shared library, and rigorously advocated for accessibility (ADA) standards throughout the implementation process.
Extending the Experience: Omni-Channel Email Journeys
To ensure a seamless omni-channel experience and reinforce the brand narrative established on the site, the digital transformation extended beyond the website into critical customer communications. I led the creative direction, redesign, and front-end coding for a suite of essential customer journey email templates (including order confirmations, shipping notifications, browse abandonment, and promotional campaigns).
Focusing on enhanced brand storytelling and strategic alignment with the updated site design and visual identity, these new, responsive templates aimed to enrich the post-purchase experience, nurture customer relationships through relevant content, and drive engagement across multiple touchpoints.
Before
Limited by text-heavy layouts and dated styling, the original emails lacked the necessary visual hierarchy, brand personality, and engaging design required for clear communication and a cohesive omni-channel customer journey.
After
The redesigned email templates introduced a clean, modern aesthetic with strong visual hierarchy, utilizing icons and product imagery within responsive layouts to significantly improve clarity, brand consistency, and the cohesiveness of the omni-channel customer journey.
Outcomes & Impact
The launch of the redesigned customization tool and complete web redesign marked a significant step in James Avery's digital transformation:
- Successfully migrated key customer-facing experiences from a restrictive homegrown system to a modern, scalable SFCC architecture.
- Ensured technical quality by directly coding the front-end for key redesigned experiences (like email templates and UI components), significantly improving ADA compliance and foundational SEO performance.
- Streamlined the path to purchase for personalized items, reducing friction identified in user testing.
- Received positive user feedback on the clarity and ease-of-use of the new customization interface.
- Established a scalable design framework for key eCommerce flows within the SFCC platform.
- Successfully modernized core elements of the digital presence, better reflecting the James Avery brand quality and craftsmanship online.
Reflection
This project underscored the importance of balancing deep respect for brand heritage with the demands of modern digital user expectations. Simplifying the inherent complexity of jewelry customization within the specific constraints of the SFCC platform required deep collaboration, iterative problem-solving, and iterative design, ultimately demonstrating how user-centered improvements can elevate a brand's entire digital commerce experience and drive significant business value even within complex technical migrations.