Last September, we launched a completely re-designed and re-architected website for the audio technology company iZotope. Unveiling a completely new corporate dot-com is a consequential milestone, but what made this even more seismic was that iZotope’s most anticipated product launch in the history of the company was to come on its heels. We knew we needed to build an experience that not only showcased and merchandised iZotope’s audio production tools, but also converted better than ever from day one. Here are some of the key principles that guided our design thinking and backend architecture decisions through the iZotope.com rebuild.

Create a Structure that Communicates the Product Value Effectively

During the strategy and information architecture development for the website, we focused on defining an organizational structure that communicated product value clearly and supported a range of purchase readiness. Rather than hard-selling visitors at every turn, we wanted to engage in a conversation. The website should provide them with the most pertinent and articulate information to inform their decision making no matter where they might be in their purchasing journey.

The product overview pages that we designed illustrate this importance of structure and content hierarchy in telling the story of each product effectively. (Check out this example for iZotope’s Ozone 9 mastering tool.) They begin with easily accessible calls to action at the top and, as you scroll, systematically reveal and validate the value proposition of each product offering by showcasing overview videos, defining key benefits, backing those benefits up with social proof, and offering content pathways to continue learning more. The page concludes with buying options and bundling opportunities, capitalizing on the idea that if a visitor has been engaged and interested enough to scroll all that way, there’s a good chance they have a high propensity to purchase.

Unify the Brand Experience

iZotope has a compelling brand that is evident in their product lines, but their legacy website neither broadcasted nor bolstered it. In reimagining iZotope’s web presence, it was essential to create a world-class online platform that celebrates their brand and provides a continuum of experience across all of iZotope’s touchpoints with their customers.

Inspired by how iZotope imbues each of its products with a unique color palette and iconic imagery, we designed a theming system whereby a product’s visual identifiers proliferate across the site. Not only does this make for a rich sensory experience as you explore different offerings, but it also presents a merchandising opportunity that is rooted in familiarity.

Develop a Sales Identity

To provide a cohesive ecommerce experience that merchandises all fifty of iZotope’s products across more than fifteen product families, we focused on developing a system of reusable components for presenting pricing information and product relationships across the site. Most distinguishable within this system are the product cards that combine a product’s imagery, features, price, and add-to-cart button into a concise and conspicuous system.

These cards form a foundational visual language for sales targeting on the site. Within product web tours, we use them to articulate different editions within a product family, equipping iZotope with the ability to target different experience levels within their consumer base and communicate a roadmap with inherent upsell opportunities. In the Shop, we present them in a grid formation to promote scannability and pair them with an intuitive filtering system that iZotope can modify and extend in the Adobe Experience Manager (AEM) backend. Different style variations available for these cards give iZotope even more capacity to cross/upsell and promote product bundles. You can see a short video of how that works here

Consolidate and Standardize Product Data

One of the most pivotal architecture enhancements in our rebuild strategy was to leverage AEM’s commerce backend to centralize product data. We built an import mechanism that gathers core data from iZotope’s internal and merchant systems and then unites that data in AEM. Additional fields within the commerce section provide the opportunity to expand the breadth of product information with marketing data such as imagery, product descriptions, features, and tags.

This repository services components across the site where content authors need simply to select a product from the commerce backend in order to have all of the information for that product populate in the component. This not only expedites the authoring process, but also supports a consistent display of product and pricing information across the site.

Facilitate Speed-to-Market Advantage

AEM is designed to facilitate autonomous webpage buildouts by authoring teams, but the right balance of templatization and component variation needs to be struck to support designers and content generators in this process. They need to have a framework in which they can quickly move to market with web content that bolsters their sales activities, and any new web content that they publish needs to harmonize within the structure of the site and contribute to a cohesive user experience.

With the optimal set of tools at their disposal, iZotope now has a vehicle to promote their vision and contribute to business growth. Their new flexible platform for innovation has increased the company’s capacity to launch new initiatives quickly to maximize sales and drive industry trends.

To learn more about how we helped iZotope build a platform for the future of audio production, check out our case study here.