Website communities for Brew Your Own and WineMaker magazines – enjoyable for consumers and profitable for publishers.
Backstory
Go to any bookstore and the rows of print magazines on every imaginable topic are proof that people desire content specific to their interests. From a marketer’s perspective, these magazines are the ideal platform to sell specialized products. If you buy a cat magazine, you’re probably buying kitty litter.
Most of these magazines have accompanying websites – some exist for the sake of it, others have blossomed into a thriving community. But, in a backdrop of free web content, how many of these thriving communities are generating income?
Sterling Woods Group approached Brew Your Own (BYO) magazine to help monetize its online presence. BYO had a companion website that had accumulated an enormous amount of content over the years – freely available to their fan base. This was a great resource for the fans, but not sustainable for the publishers.
Working with Andy Gagnon, the WordPress architect, and designer Jeremy Spurr, I helped the team create responsive page templates to manage current and future content.
The BYO launch was a success, and the parent company was able to use the same backend for their sister magazine website, WineMaker. With the WordPress architecture in place, it was a quicker build-out of the WineMaker site. I created the style direction for the WineMaker site.
Page templates
Page templates are universal structures optimized for each of the content types in a project. For online magazines, this includes a home page, department pages, article pages, blog pages, the sales funnel, call-to-action forms, special content pages, and whatever else might be unique or repurposed across the site. Additionally, with the responsive web requirement, each template needs to be tailored for mobile, tablet, and desktop views. This can be a dizzying amount of variations. Because templates are baked into the architecture of the system, attention to detail is critical.
Style Tiles
Style tiles are used to show a client how different “looks” might play out across a site or application. They give the client a chance to preview and interact with the core graphic elements – colors, fonts, design devices, button states, etc. before committing to a final direction that would be hard to change later. The design details of the chosen tile are then integrated into the site architecture.
For this project, I presented four different directions, naming them Coast, Bold, Colorful, and Relaxed. They ended up choosing Bold. You can see how that all played out on their site: https://winemakermag.com/
Relaxed 
Colorful 
Coast 
Bold