Eberhard Manufacturing, a leader in access hardware, revamped its site in 2020 for a better UX and streamlined eCommerce experience.
Introduction:
Established in 1877, Eberhard Manufacturing is a leader in access and security hardware engineering. In mid-2020, the company set out to revamp its website to align with new business standards. Leveraging best eCommerce UX practices, we successfully launched the redesigned Eberhard.com.
Overview
Timeline: October 2020 – October 2021
Industry: Access & Security Hardware
Client: Eberhard Manufacturing
Role: UI/UX Designer
Team: Archana Tarle & Dyviani (Developers), Diane Sierra (Project Manager)
The project involved building a new website from the ground up using Brambaly, Eberhard’s existing CMS. Key goals included:
Enhancing site appeal through an intuitive product page layout categorized by industries.
Ensuring all products are easily searchable and filterable.
Providing a seamless browsing and purchasing experience.
Migrating all existing products to the new platform.
Implementing key features like product comparison, sorting by industry, and a product search quiz to enhance sales and marketing.
This case study focuses on Frontend Store and Shop by Industry as the core deliverables.
Research & Discovery
Understanding E-commerce Challenges
According to BigCommerce, global eCommerce sales are expected to reach $6.4 trillion by 2024. The COVID-19 pandemic accelerated digital transformation, intensifying market competition. Challenges for eCommerce businesses include:
Increased Competition – Differentiating the brand through value propositions and user experience.
Omnichannel Experience – Ensuring a seamless transition from storefront to social media and other platforms.
Customer Experience – Addressing issues like cart abandonment due to shipping costs (18%) and complicated checkout processes (21%).
Competitive Analysis
Eberhard’s competitors include Southco and Austin Hardware, with Emka and Dirak serving as indirect competitors in the European market. A thorough audit helped identify competitor strengths, weaknesses, and opportunities to refine Eberhard’s digital experience.
Frontend Store Redesign
Challenge #1: Improving Product Discoverability
Eberhard’s extensive product line required an intuitive navigation system that allowed users to quickly find what they needed without friction. Our goals:
Clearly communicate Eberhard’s brand and offerings on the homepage.
Implement multiple paths for product discovery (categories, search, industry-specific sorting).
Solution: F-Shaped Reading Pattern & Mega Menus
Following Jakob Nielsen’s F-Pattern research, we structured the website to capture user attention effectively:
Header Navigation: Showcased Eberhard’s key product categories for quick access.
Mega Menus: Expanded navigation for a clearer, more efficient browsing experience.
Breadcrumbs: Improved site navigation and SEO performance.
F-Pattern Design: Ensures important information is placed where users naturally look
Mega Menu: Helps organize extensive product categories and industries
Breadcrumbs: Improve navigation and SEO
Search Enhancements: Supports filtering by product category, material, and brand
Challenge #2: Enhancing Product Pages
Product pages are critical in driving purchase decisions. According to NNG, must-have elements include:
Descriptive product name and details
High-resolution, zoomable images
Pricing information
Clear "Add to Cart" functionality
Advanced product filters
Solution: Enhanced Search & Filtering
We implemented a built-in search tool powered by Brambaly’s CMS, allowing customers to search by:
Material & Brand (Zinc Die Cast, Brass, Seasamee, etc.)
Shop by Industry
Eberhard provides hardware solutions for various industries, including Automotive, Medical, Storage, and Enterprise IT. Shop by Industry enabled users to filter products by specific applications, making navigation more intuitive.
A content management system was developed to allow Eberhard’s admin team to tag and update products dynamically. This provided:
Flexible product categorization
Efficient inventory management
User-friendly backend interface
Back-end Control
Conclusion
The Eberhard website redesign successfully tackled key eCommerce challenges, improving product discovery, navigation, and customer experience. By leveraging UX best practices and a robust CMS, we created a modern, accessible, and conversion-focused digital platform that positions Eberhard for continued success.
Key Takeaways
Implemented UX best practices led to a user-friendly eCommerce experience
Enhanced navigation, filtering, and search functionalities improved product discovery
The revamped website successfully aligned with Eberhard’s digital transformation goals