Ecommerce Website for Global Hardware Manufacturer


Project Info

Our client is a global leader specializing in the design, manufacture and distribution of functional hardware, office and healthcare ergonomics and storage-related components for original equipment manufacturers, specialty distributors, hardware chains and major home centers. They design and manufacture precision, Euro-style and utility slide systems; wall-attached shelving for commercial, home and garage applications; kitchen, closet and bath storage; office and healthcare ergonomics products and specialty hardware. They offer these products under several well-known brand names. The company has a complex channel network which includes OEM manufacturers, distributors, consumer retail stores, as well as online via their own website.  They wanted a new website with the following features:

  • A modern look and feel
  • A responsive web design that will function well on desktop, tablet, and mobile phone browsers
  • An information architecture which will communicate their value proposition clearly to their various channels
  • A way for their visitors to quickly find product information that is relevant to them
  • A way for visitors to quickly find product support materials such as catalogs, video, sell sheets, CAD drawings and other media
  • A great ecommerce experience which will enable buyers to browse and search their product lines and drive online purchases
  • Ability for their product teams to be able to easily manage product data and for their marketing teams to manage marketing-related content

The Solution

Outright built the website using the Drupal 7 content management system (CMS).   Outright utilized the Bootstrap framework to create a series of responsive web page templates.  The ecommerce portion of the website utilizes the Ubercart ecommerce plugin for Drupal. The website utilizes a number of Drupal modules (both custom coded modules as well as contributed modules) to meet the various functional requirements of the website.

Outright worked with the client’s internal stakeholders to create an information architecture that supported the various user personas from across the company’s various audiences.  Outright then created wire frames to help define and refine the user experience (UX), information structure, functionality, user workflows, and calls to action.  Outright worked with the client’s creative agency during the strategy portion and the build-out of the UI design.

The site contains the typical corporate information components such as company profile, executive bios, press releases, and job postings, but also is designed to reach audiences based upon the mission the visitor and the information that they are seeking.  For example, the site contains major navigation for areas based on product line (“closet hardware”, “garage organization”, etc.), solutions by industry (“healthcare”, “automotive”), and by the various major brands that the company owns. 

The site also contains “self-identifying” navigation which enables users to learn about the company based upon their role (e.g. “Retailer”, “OEM”, “Distributor”, etc.).  These sections allow visitors to the site to quickly learn about the client’s value proposition specific to their role and enable access to related materials.

Website Information Architecture:

navigation_example_edit1.png

Outright created a document “Resource Library” which enables site visitors to quickly find support- and sales-related documentation and media (sales sheets, installation instructions, 3-D CAD drawings, videos, etc.).  Visitors to the site can search using keyword, media type, category, product, and SKU to quickly get to the relevant documents.

Resource Library to Quickly Access Media:

resource_library_edit1.png

Outright built a large eCommerce store within the site which contained multiple product families, each with metadata that is specific to the particular product family.  There is a one-to-many relationship between products and SKUs.  Faceted search is employed to enable users to filter search results based upon product attribute (such as the weight capacity of a shelf or the finish or a product).  Visitors can add product to their shopping carts, view shipping calculations, check out and pay with secure payment methods, and receive email updates regarding the status of their purchased items.

Product Search Results with Faceted Filters:

product_facet_search_edit1.png

 

Product Detail Page:

product1_edit1.png

 

The website also uses roles and permissions capabilities to enable different stakeholders at the client to be able to control different sections of the website.  For example marketing personnel can edit the marketing-related content on the site, product managers can manage the content related to product data, and customer service representatives can manage the processing orders.

Outright assisted in the deployment of the website within the client's hosting environment and continues to provide post-launch support for the website.

Categories

  • Web Application Development
  • Web Design
  • UI/UX Design
  • Responsive Design
  • Drupal Development
  • Content Management System (CMS)
  • eCommerce
  • HTML5 & CSS3

Related Projects