Content Design Strategy for Digital Storefronts
As the world of eCommerce continues to grow and evolve, sites aren’t thought of as simple web pages, but as digital storefronts. Consumers crave sleek and modern page designs full of engaging content that works on mobile devices.
With this in mind, designers need to prepare for several different page types and templates when designing a modern, mobile-centric digital storefront.
Commonly, sites incorporate homepage, category browse, product detail, and checkout form pages into their sites. These are considered to be fundamental eCommerce page types. Generally, these core pages follow a standard structure and layout, easily mapping out a designer’s page catalog.
So, after the catalog is mapped, what happens next? We designers simply pop on our headphones, jam away, and whip up some web pages. Just another day in the office, right?
Creative and visually engaging web design isn’t born from a simple recipe but from brainstorming and innovation. The best example of this always seems to come from content pages.
If you want to sell anything online, rich content pages chock-full of images, copy, and interaction opportunities are a requirement, not a differentiator. Designing these pages to deliver a modern, mobile, and consistent brand experience is a true design challenge.
Just this past year, we faced this exact content page challenge. Imagine a site that has hundreds of content pages, with each page displaying a wide variety of images, graphics, and text. What do we do when standard design processes won’t get the job done?
Not only do these pages need to be modernized, mobilized, and standardized, but they also need to be easy for developers to implement and simple for business users to manage. As we said earlier, today’s content pages can create rather intricate challenges!
Faced with this exceptionally complex project, we needed to develop a way forward: a process.
Step 1: Brainstorm
As with any creative endeavor, getting ideas out into the open needs to be the first step when tackling a complicated challenge like these hundreds of custom content pages. We filled whiteboards with our thoughts, problems, and ideas, and emptied pots of coffee to keep the ideas flowing. Solving difficult design problems takes a level of time and effort that many underestimate.
Step 2: Visualize
With our ideas whittled down and our coffee pots refilled, we decided that in order to solve the challenge, we needed to take a deep dive into the existing pages to find consistencies and similarities that could help streamline any solution moving forward.
So, we took a deep look at each content page, meaning we printed out every single page, taped them up, and reviewed them one by one with various design team members.
As we said: design solutions require A LOT of time and effort commensurate to the problem. To find these solutions, sometimes meticulousness and scrutiny are what it takes. During this analysis, on a cold and wintry Chicago Thursday, we made a breakthrough.
Step 3: Simplify
Faced with a large, complex content page problem, we realized the answer was the antithesis of the challenge. We needed to create templates based on commonalities in the originally disparate pages. Usually, complex design issues require relatively complex solutions; however, through brainstorming and visualizing these design challenges, we found another way.
Step 4: Solve
So, we simplified the hundreds of content into six modular templates that could be used to display the content. These modules each had their own interactions – from simple image-and-type layouts to accordion and carousel displays. These templates enabled the pages to render a vast range of content into a specified set of modern and responsive modules.
Modern consumers have certain expectations when it comes to the web stores that they interact with. These expectations drive the need for rich content pages that creates unique design challenges that can easily overwhelm teams.
Internally and externally, the site needs to deliver value, and through this design process, we were able to work through the challenge and establish an approach that streamlined the design process, simplified site development, and enabled the clients to manage their own content moving forward.