Case Studies

Magento Ecommerce Website Development for Abcore

Charlie Scala

Project Summary

Abcore approached PINT seeking a new website with a modern, mobile-friendly design and improved ecommerce functionality. The website needed to support the 150,000 products with the ability to scale to be able to support an excess of 1 million products. Abcore also wanted to be able to easily upload and change products, which was a primary issue and the highest priority item to address in this website rebuilding project.

Client Overview

Abcore is a biotech company that provides custom polyclonal antibody services worldwide and represents small European biotech companies in North America. Antibody services are performed in Southern California at USDA licensed facilities. Headquartered in San Diego, Ca., Abcore is at the center of life science discovery and innovation.

Client: Abcore
Location: San Diego, CA
Industry: Biotechnology
PINT Services: Digital Consulting, Systems Integration, UX/UI, Information architecture, design, image research, front-end development, quality assurance, hosting
Technology: Magento

Laptop and mobile phone with the desktop and mobile versions of the Abcore site displayed.

Challenge

At the beginning of the project, Abcore approached PINT with the challenge of having hundreds of thousands of products and needing to be able to easily scale and increase the size of the product catalog by six times the existing size.

Additional functional requirements of the project included:

  • Improving the search functionality of the website
  • The ability to handle hundreds of categories
  • Products needed to have multiple images with auto-resizing capabilities and the ability to show original full resolution
  • Page names needed remain consistent with the current site for SEO purposes
  • Ability to process multiple shipping rates and proper tax rates for California
  • A menu type that included many links to categories - more than a simple drop down
  • Automatic ability to generate PDF data sheets from product data using a template
  • Support for online chat
  • “Multi-panel” services pages
  • Customer account storage where past purchases and invoices could be seen
  • Fluid check out process

Solution

Discovery

After nailing down the functional and technical requirements of the project, PINT’s solutions architect performed technical research to find the most suitable content management system and PINT’s information architect began constructing wireframes to demonstrate the functionality of the new website.

Magento was chosen as the content management system. The old site was built in Drupal which was not ideal. Magento was better suited to handle bulk product uploads, order, invoice, and shipping labels, tracking information for packages, and other features that were important to Abcore.

From a design and usability perspective, PINT created an experience that told a credible story for first-time visitors while maintaining intuitiveness and ease-of-use for existing customers.

Both the design and development decisions were made in collaboration with Abcore stakeholders. PINT held several interview sessions as part of the discovery process to learn about Abcore users and KPIs for the website.

User Experience & Design

From a usability and design perspective, the new site changed in many ways. A longer scrolling design was implemented allowing for a much more mobile-friendly experience.

To cater to returning visitors, search and products and services were featured prominently at the top of the page so that users could quickly access the information they were looking for and make purchases.

To ensure visitors have a good experience, the long scrolling effect enabled better storytelling with Abcore featuring key benefits, an informational video, and Abcore’s most popular products and services all through a fluid one-page experience that allows users to digest information at their own pace.

Other key changes included adding product category calls-to-action in the hero section and adding sections for featured product groups prominently.

Laptop mockup of an Abcore product page with the left-hand product filtering.

Ecommerce Development & Hosting

In the development phase of the project, PINT carefully considered the viability of Magento extensions to achieve a finished project that met all of the requirements. In cases where extensions were well documented, up-to-date, and well-supported by the Magento community, PINT tested and implemented these extensions in the new iteration of the website. In other cases where extensions could not be leveraged, PINT created custom code to support requirements of the new Abcore website.

Below are some of the main extensions used:

  • MAGMI was used to facilitate the process of importing the product catalog into the new website.
  • Solr was used for search as it allows for full-text search, attribute, relevant search, drop-down suggestions, real-time indexing and multilingual support.
  • Olark Chat was implemented to support Magento Live Chat.
  • One page checkout was used for a clear and easy checkout process

Some of the custom work required as part of the project included:

  • Building a data model to support data migration
  • Creating page templates for the home page, category landing pages, subcategory landing pages, product detail pages, cart pages, checkout pages, login/registration pages, and account pages
  • Integrating payment processing and shipping functionality

PINT also improved the Abcore dev ops and hosting infrastructure as part of this project. Gitlab was implemented as a source code repository.

This allowed some key benefits including:

  • Collaboration: multiple developers can work on the site at the same time without affecting each other’s work
  • Proper Version Control: All past versions and variants are stored automatically such that you can request any version at any time and have a complete snapshot of the project.
  • Documentation: A short description is required when new versions of the project are saved. Therefore, if it has been a while since the code has been touched or a new person is working on it, it is easier to know the change history of the site.

On the hosting side, a staging site was set up on a separate server to eliminate the possibility of changes on the staging site affecting the production site.

Results

Abcore now has a mobile-friendly, full-service Magento ecommerce site that provides a great user experience for its customers.

The optimized Abcore ecommerce site is fast (loads in 2 seconds), search engine friendly (over 60% of traffic from organic), and easy-to-navigate. Users are able to find what they’re looking for easily through the Solr site search or through the filtering on the products pages.

Plus, by implementing live chat, users are now able to get their questions answered quickly by the experts at Abcore.

Not only is the new ecommerce site better for users, it’s also easier for Abcore employees to use as they can take advantage of Magento’s bulk product uploads, orders, invoices, and shipping labels, and tracking information for packages.

If your ecommerce site isn’t making it easier to run your business, let us know. PINT will perform a technical discovery to figure out a plan of attack to get you on the right track.

Related Articles

Designing for Digital and Print

Having consistent messaging, look, and feel is essential to providing a seamless experience for users. Translating that across digital and print can be a challenge. ...

Rob McFarlane
By Rob McFarlane
Oct 29th, 2018

Tell us about your project

Please fill out your information and submit
X