Two separate websites, a shop (not on Shopify) and a CRM-built educational site, put together by inexperienced builders. Inconsistent hierarchy, fonts and colors, a fragmented shopping experience, and a mega menu no one could navigate. A 30-year benchmark brand still only reaching the customers who already knew it.
Results
- Websites — 2 → 1
- Clicks to any product — 2–3
- Ways to shop the menu — 4
- New page types — 10
- Platform — CRM → Shopify
STEP 01
Consolidate the two sites into one
Dynamat lived on two websites: one only for sales, the other only for education. Both ran on CRM platforms, not Shopify. Our team merged both into a single Shopify store, so any customer can move from learning to buying without hitting a wall between them.
Visual reference: new hero on a billboard in a station, a person walking past
STEP 02
Fix the foundation
Weak platforms and builders without design expertise left shaky foundations: poor hierarchy, type that changed from page to page, and colors that drifted off-brand. Starting from their brand guidelines, we restructured how content is presented, brought in their two typefaces, and refined the palette, so everything speaks the same language.
Visual reference: foundations: type & color
STEP 03
Rebuild the mega menu around how people actually search
The old mega menu wasn't built for conversion. Products were hard to find, and it ignored the different kinds of customers walking in.
The new menu lets people shop by intent: by application, by the benefit they want, by where the product goes, or by a kit made for their car.
Whether someone wants less noise, heat, or vibration, or already knows the exact product line and quantity, they get there in 2–3 clicks.
Visual reference: mega menu
STEP 04
Turn a thin hero page into a dense, conversion-ready homepage
The old homepage was product-line banners and an Instagram feed. It read more like a blog than a store.
The new hero is a collage that opens the five places Dynamat is used (Automotive, Audio, Marine, Industrial, and Home) next to proof of the brand's standing.
Below it: what Dynamat is for newcomers, shopping by benefit, best-seller carousels, a guide to choosing by level of impact, the product calculator, reviews, where to buy, and bundles.
Education and ecommerce in one place, guiding people from understanding to checkout.
Visual reference: homepage
STEP 05
Rebuild the product page for AOV
Before, their product page was a description, an add-to-cart, and sometimes a frequently-bought-together.
The new page leads with name, reviews, color per product type, an overview, and content and application laid out cleanly, with a condensed image gallery on the side.
Then: reviews, bundles, related products, how to apply products, FAQs, frequently bought together, and a subscription callout. Each block is there to raise average order value for that type of customer.
Visual reference: product page
STEP 06
Add the pages they never had
A filterable collection (by application or benefit, sorted by feature or price), a dealer locator by ZIP or application, and a calculator that tells you how much you need per vehicle and offers add-ons to complete the kit.
A manuals repository filtered by car, video tutorials, a proper About Us, a Process page, a UGC review collage, and a contact form routed by department (sales, technical, international).
Blog posts now carry product sections that link back to product pages, closing the selling loop.
Visual reference: collection, locator & calculator · manuals, about, process & blog