Matthew Pierce

Streamlining the Digital Presence for Canada's Largest Mineral Processing Equipment Supplier

The Challenge

Sepro Mineral Systems is the largest supplier of mineral processing equipment in Canada.

With a complex digital presence spread across six connected websites, Sepro needed to streamline its online footprint to improve user experience and centralize its product offerings.

The Sepro marketing team brought me in to help consolidate these websites while maintaining clarity for their global audience.
Internal survey feedback showed that the existing websites made finding information more slow and cumbersome.

Solution

The broad network spanning six connected websites would be consolidated into two streamlined platforms.

The primary website, www.seprosystems.com, became a one-stop shop for all mineral processing, aggregates, and mixing and pumping offerings from the Sepro product family. The secondary website, labs.seprosystems.com, was created to highlight Sepro Labs' testing services and expertise.
From information architecture design to wireframes and high-fidelity prototypes

Process

To ensure a seamless consolidation and design, the project followed a detailed process:

  1. Internal and customer surveys
  2. Stakeholder interviews
  3. Information Architecture Design
  4. Marketing collateral and assets repository creation
  5. Wire-framing and low-fidelity prototyping
  6. High-fidelity mock-ups and prototyping
  7. Content collection document design
  8. Custom WordPress theme and plugin development
  9. Internal QA testing
  10. Post-launch stakeholder feedback surveys
  11. Ongoing improvements through post-launch agile development
An auto-playing video blends into the hero banner to show off Sepro's latest tech.

Website Redesign & Key Features

The previous Sepro network of websites emphasized branding with navigation points like ‘knowledge’, ‘experience’, and ‘innovation.’

While effective for introducing new users to the company, this made it harder for existing customers to quickly access product information and resources.

Taking inspiration from leading eCommerce giants, the new website’s navigation places search front and center, enabling customers to quickly find what they need.

Search results are filterable by content type, including Articles, Brochures, Case Studies, Products, Technical Papers, and Videos.
Product categories appear on the right as users hover over items in the product list.

Mega-menu Navigation

The ‘Products’ link in the primary navigation expands to reveal a mega-menu highlighting Sepro’s premier offerings.
A block-based page builder helps the marketing team create any page without worrying about code or design.

Modular Product Pages

Built with WordPress Gutenberg Blocks, product pages offer flexibility for the marketing team to customize layouts.

An expansive product information page made with the block-based page builder

Product Page Features

Key elements include jump-to links for detailed content, video browsers, downloadable resources, and compact contact forms synced with their CRM.
The video browser displays related videos on a single screen
Easily search and filter any key documents

Interactive Resource Browser

To improve accessibility to Sepro’s resources, we created a custom interactive Resources Browser. With asynchronous filters and sorting, users can quickly discover documents related to Sepro’s product categories without reloading pages.

Custom Post Types were created for Articles, Brochures, Case Studies, Technical Papers, and Videos, each with custom taxonomies to enhance discoverability across the site.
Quickly find your closest Sepro representative

Global Representative Finder

To help customers find the right point of contact, we built an interactive map using Mapbox, which automatically detects the user’s location and highlights their nearest Sepro representative.
Mobile navigation without compromise

Mobile-First Design

Despite complex navigation needs, the site is fully mobile-friendly. The desktop navigation seamlessly translates to mobile without the need for hamburger menus or a deprioritization of important elements.
By combining multiple customer touchpoints into one streamlined website, the new Sepro site experienced a large increase in website visitors (above). This allowed the business to keep their entire user base informed about new products and help facilitate cross-selling between industry segments.

The Results

By consolidating Sepro's websites into two modular platforms, we were able to create a more efficient, user-friendly experience. The new structure allows users to find relevant product and resource information more easily while empowering Sepro’s marketing team to build customized landing pages on the fly without third-party tools.
“Matthew is dependable, responsive, and easy to work with. Above all, he delivers a quality product that goes above and beyond expectations. Matthew will go out of his way to understand your users’ pain points and provide a solution that looks great while helping to drive business results.”
— Christopher Lam, Marketing Strategist, Sepro Systems

Mobile-first and completely responsive.

Developed for phones without compromise, and expand elegantly for larger screen sizes.

Easy to edit using WordPress

Tailor-made WordPress Gutenberg blocks empower Sepro's marketing team.

Custom-built for performance and flexibility.

The custom WordPress theme and plugins streamline communication for Sepro's vast offerings
© 2024 | Designed and Developed by Matthew Pierce