Eberhard - An eCommerce Site Case Study

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)
  • CMS Platform: Brambaly CMS

Project Scope

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:

  1. Increased Competition – Differentiating the brand through value propositions and user experience.
  2. Omnichannel Experience – Ensuring a seamless transition from storefront to social media and other platforms.
  3. 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:

  • Product Category (Handles, Latches, Electro-Mechanical, etc.)
  • Product Number (e.g., LNL-77E-6772-93)
  • 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.

Live demo: https://www.eberhard.com/IndustryPages

Back-End Management

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
No items found.

Other projects