Image via Richard Parr
I remember tricking out my ’71 Plymouth Barracuda back in the day — something my Toyota Prius-driving offspring won’t get to experience. I added a hood scoop (mainly decorative), big tires, aluminum rims, headers and racing shocks. The car turned heads, whether it was parked, cruising the boulevard or beating a Porsche off the line. The concept of tricking something out doesn’t only apply to automobiles, though; it can also apply to your Magento 2 store. Merchants can see tremendous gains by taking stock, out-of-the-box templates and customizing the front and back ends to support business goals. That’s “tricking out” your e-commerce experience.
Need some examples of merchants that have done this? Here are some compelling Magento clients that have implemented successful customizations, leading to increased conversions, improved customer experience and boosted profits.
Tricked Out Customer Experience: Real Street Performance
A merchant doesn’t get more “tricked out” than Real Street Performance, a business dedicated to turning customers’ cars into high-performance machines. The customizations on the Real Street site are quite extensive. Here’s a short list:
- Custom Item Cards. For each of its products, Real Street Performance built custom item cards to show customers the distinct specifications of each product below the thumbnail. Users can differentiate between products without having to activate a quick view or going to the product detail page. The item cards display product images, specifications, SKU number, price, product availability and “add to cart” functionality. This creates a simpler, speedier way for customers to find what they are looking for.
- The Package Builder. This feature on the Real Street Performance site serves as both a sales and educational tool. The Package Builder walks customers step by step through the highly complex process of selecting all the parts they need to build major car components. Customers can also enter a vehicle’s make, model and engine type to receive compatible parts and accessories. This tool accelerates the buying process, transforming a 30- to 60-minute process into a one- to two-minute interaction. Plus, this enhancement reduced calls to the support center, saving staffing costs.
- “Build Recipe” Feature. Real Street Performance designed a “build recipe” feature for its custom-built vehicles offering. Similar to how cookbook recipes are laid out, each “recipe” gives the customer a story, a list of auto parts for purchase, instructions, specifications, guides and more. The feature has been well received among car enthusiasts looking to build or modify custom vehicles.
Creating customized, interactive tools improved search functionality and enhanced the customer experience online. Real Street Performance tuned up their website and saw an immediate increase in sales.
Tricked out performance =
- 49% decrease in bounce rate.
- 500% average item quantity per order.
Tricked Out Content: The Vault Pro Scooters
Zipping from custom cars to custom scooters is a perfect transition. The Vault Pro Scooters sells apparel, safety gear and every type of scooter part imaginable, as well as fully assembled, custom scooters. They sell primarily online and through their flagship store in Inglewood, California. How did The Vault Pro Scooters improve its content?
- Re-segmenting Inventory. Vault re-segmented its inventory into dozens of clickable categories and subcategories. Because of the highly specific nature of scooter parts, as well as the variety of styles and colors, this intuitive user interface helps customers find whatever they need.
- Dynamic Content. Vault’s new website showcases its content dynamically through a Magento 2 custom interface. Now, all types of media can be embedded and updated instantly when they push content through the Magento CMS. With this feature, Vault can push content tailored directly to customers, including how-to guides for custom scooters, trick videos from professional scooter riders, and recap videos of professional and amateur scooter events.
- Micro-animations. The final trick for this shop was integrating micro-animations into the purchase path to boost conversions. The application of animated icons or micro-animations to the customer experience can emphasize the brand, improve user experience and boost conversions. The micro-animations that Vault implemented are simple, subtle, and provide a more interactive and robust shopper journey.
To approach this effort, the purchase process was segmented into a linear path (as depicted in the illustration above). We begin with the homepage, and then go through the search or category page to land on a product page. From there, we go through the cart and checkout process. It is easy to identify the call-to-action buttons during the customer journey. In the screenshot below, you can see some of the 20 buttons that are customized with micro-animations on rollover and/or click.
The following are a few examples of how to integrate micro-animation elements in this path:
- A “Sale” icon that turns into a “20%” sign, on mouse rollover or page load, draws attention and emphasizes the offer.
- A “Shipping” icon, such as a truck or package, that moves across the icon will literally drive home the concept that a product will be shipped to the customer, increasing anticipation.
- A “Checkout” process that animates each step so the user knows where they are in the process increases and confirms the understanding of your customer.
- An “Add to Cart” button that animates to show that the customers click has been received improves user comprehension.
The Vault Pro Scooters was able to improve its revenue, conversion rate and average order value two weeks after the site launched.
Tricked out performance =
- 15% increase in revenue.
- +36% conversion rate.
Tricked Out Product Pages: Sleep Outfitters
A fitting final example to my Magento case studies is Sleep Outfitters, a Lexington, Kentucky-based company that employs more than 300 people across 100 stores in six states. As a company, it operates under three names — Sleep Outfitters, Mattress Warehouse and Mattress King — and sells America’s most iconic bedding brands: Sealy, Tempur-Pedic and Stearns & Foster.
Sleep Outfitters threw out the traditional mattress store experience and reimagined it, both online and in its retail stores. Here’s how they did it:
- Add-ons. Sleep Outfitters enhanced its product pages with intuitive add-ons to upsell the customer.
- Comparison Tool. In addition to add-ons, Sleep Outfitters customized a mattress comparison tool in order to allow site users to compare mattresses side by side for color, feel and sleep position.
- End Journey. Also part of its redesign, Sleep Outfitters shoppers are now upsold accessories for bedding sets before checkout and can even choose their own delivery date, which is rare in the mattress industry.
“Our e-commerce sales are up, our conversion rate is up significantly, as is AOV,” says Kristin Micalizio, chief marketing officer of Sleep Outfitters. “Organic search traffic normally declines on launch, but ours increased 56% in the first month.”
Most importantly, Sleep Outfitters customers were impressed with the site. One reviewer wrote: “My online shopping experience went very smoothly. I had an easy time finding exactly what I wanted, and checkout was a breeze.” Six weeks after their launch, Sleep Outfitters crunched some impressive numbers.
Tricked out performance =
- 283% increase in online sales.
- +56% organic traffic.
These merchants didn’t fall asleep at the wheel. The strategic customizations to their out-of-the-box websites generated tremendous ROI. If you’d like to trick out your Magento web store with a better customer experience, talk with your digital agency and see how fast your business can grow.
Richard Parr, vice president of creative services at Kensium.com, is an award-winning creative leader with 28 years of experience in digital branding and e-commerce design solutions. At Kensium, he manages the creative services and marketing teams. In his spare time, he collects 19th-century Japanese woodblock prints and drives a Prius.