Website Rebuild for a Local Packaging Company

Lightning In a Bottle

As an existing maintenance partner, we discussed a rebuild with MJS Packaging for quite some time. Departing from Magento to move over to WooCommerce would allow for an easier architecture of their products, creating a straightforward view of what products are available for purchase vs. products that require a quote.

We seized the opportunity to enhance areas for optimized navigation, such as on-page category sub-navigations, a mega menu, and product organization. Bottled up with a fresh take on the 100+-year-old brand, the website is now brimming with vigor and a more friendly face.

A Breath of Fresh Air

With the legacy that MJS Packaging carries, the time arrived to give its brand a polish. Their goals included being friendly and accessible, so we incorporated circles into that amicable visage and updated fonts welcoming the user in. This look is apparent throughout the website, and the added greenery gives the website a life where there would otherwise be standalone bottles.

Proper Product Labeling

The product pages prompted a special concern since a robust mix of variations can get lost in the category page if only the product parent is listed. So, the individual product variations are rendered on category pages to allow for more specified browsing to see all available options. Still, each product is configurable to various SKUs on the product page.

Additionally, MJS Packaging provides quantity discount pricing; this was a vital addition on each page and includes how it sold, whether individually or by case. Although this information is only relevant for items available for purchase, exclusions within the product library were set up to render conditionally. Similarly, these products show the Add To Quote option, but only the ones with eCommerce functionality enabled will display the Add To Cart option.

Carving a clear path

Accessibility and navigability were vital for this build to ensure all users could painlessly sift through all product categories and options. We took steps to make it intuitive to browse, allowing the user to see everything at face value. To achieve this, we added navigation elements on the category page to visually drill down to the subcategories as well as a mega menu.

Mega Menu

With the sheer breadth of subcategories, we considered an improved way for users to browse the catalog that wasn’t tedious or overwhelming. We wanted all of the product types to be visible at a glance so it was clear The result was a clean mega menu, getting users exactly where they needed to go.