Penguin Random House
A Niche for the Cookbook Obsessed
How we helped the world’s largest publisher share their passion for food, cooking, and culture
When we first met the Taste team, they were called TasteBook. The TasteBook site started as a cooking app for users to save recipes, upload recipes, and print their own “TasteBooks”. This model started to show its age and outlive its usefulness, but the blog and newsletter that was attached to the site ended up being the only place for Clarkson Potter and 10Speed Press to publish recipes, interviews, features and exclusive content from upcoming cookbooks. TasteBook had something of value, they just needed to reposition it.
TasteBook’s new mission: be a place of cooking discovery, where people who love food, cooking, and culture can find inspiring voices in the kitchen. As the cookbook division of Penguin Random House, they had access to the best talent in the business, decades of experience, and the perspective to teach people about food. With half a million page views per month and 1.4 million recipes in their database, TasteBook had the potential to be a leader in the cookbook community.
We need to make it look as good as NOPI.
There was just one problem: they didn’t look the part. Their site and brand wasn’t doing the content justice and didn’t reflect internal publishing standards. TasteBook was a portfolio of high-quality editorial brands, and we needed to change that perception. The new brand needed to surpass the high visual standards of the print publishers and be able to proudly sit on a shelf next to one of their beautiful cookbooks.
In This Case Study
“With our new brand, we can’t continue to be all things to all people.”
VP, Digital Community, Taste
But, there was still a lot of baggage around the existing TasteBook.com site, inside and outside of the organization. So, armed with some post-it notes, we started to define our strategic foundation for the project:
- Build something we’re proud of
- Engage our readers and build trust
- Create a platform for great editorial work
- Create a flexible brand and site that can grow over time
Finding a new name and visual language.
Taste was in need of a design system that would build community, support publishing, increase name recognition, and establish credibility. To start, we defined a set of brand attributes. Through interviews with stakeholders at Taste, we determined that the new identity needed to be accessible to foodies of all levels, inspiring in breadth and depth, sophisticated in style, and trustworthy in quality. And of course, it needed to be fun. We drew visual inspiration from high-end lifestyle magazines, cookbook layouts, boutique food packaging, and interviews with food lovers and afficionados.
We developed a spread of brand directions, each dialing up and down different brand attributes. One direction was vintage and quirky, another was elegant and painterly, each of these options inspiring the client team and giving us more material to draw from. Ultimately we ended up with a healthy mix of each direction, dominated by some of the classier variations on the logotype and tempered with the quirkier and more personality-driven aspects of the brand ideas.
We ended up producing a custom set of letters, loosely based on the Britannic typeface. Britannic’s tall and proud letterforms inspired us to draw classy gridded letters, like something from a high-end fashion magazine. Paired with Tusar Deco and an adorable egg icon, we were able to hit the right balance of down-to-Earth sophistication. It also turns out that drawing a great “S” from scratch is harder than it seems.
Tusar Deco, our headline typeface, has enough personality to fill a room so we needed to combine it with something simple. We chose GT Eesti and Domaine Text as our trusty backup singers. We used Domaine for body copy, since Tusar Deco gets points for flair but not for legibility at small sizes.
Completing the System
We packaged all of this information into a streamlined brand guide, which lives on the site. It includes the essentials: a type guide, a color guide, logo applications, a collection of spot illustrations, voice and tone guidance, and photography inspiration. It's also an easy place for Taste to download assets.
Why is this useful? Design doesn’t stop after Upstatement steps away. A brand guide helps maintain consistency across designers, across companies and within Taste. It's the single source of truth as the brand is carried forward and grows beyond what one designer can possibly maintain. We believe that almost no project is complete without a basic brand guide. This type of documentation vastly improves the translation from our team to yours.
A Better Online Recipe.
The Reading Experience
When we first met Taste, they were publishing a lot of great material but there wasn't an underlying approach to content that could drive prioritized decision-making. We broke down their content by type, audience, and effort required to publish. This revealed clear choices about where to focus energy to get the most bang for our buck out of each piece of content.
We also needed to extend these improvements beyond the website. Taste's existing email newsletter was an extremely important distribution channel and we need to make sure that the email experience was on par with the site experience.
“We're creating a place of discovery, where people who are interested in food, cooking and culture will be excited to discover new voices and have a rich environment that inspires people them cook”
30,000 recipes? Sounds delicious!
A Unique Site Needs a
One-of-a-kind Back End
The design made for a tasty user experience and we wanted to make sure writers and editors had everything they needed to make great content. We built a handful of custom components in the WordPress admin that could be inserted as shortcodes. The workflow we designed makes it easy for an editor to add these shortcodes, which encourages our ultimate goal of creating textured and creative editorial content.
A Recipe for Recipes
Recipes are a very unique content type, and this site's stock-in-trade. Following our agile design and dev principles, this was actually one of the first features we built in the early days of the project — even before naming and design were even kicked off. By starting with the core of the content and user experience, we ensured that the most critical parts of the site got the most development attention.
To accomplish our requirements around recipes and all of the other content Taste was publishing, we built a custom WordPress platform, using Timber to separate the markup and the PHP. We also leveraged Upbase, our in-house SASS library, to expedite front-end styling. We did a fair amount of design in the browser, and Timber and Upbase made agile design iteration a lot quicker.
Making the Switch
Armed with a solid strategy, we needed to help Taste follow through on their promise of quality over quantity. With over 1.4 million recipes, they needed to cull the herd. So, we got to work on the four parts of a successful content migration:
Decide what to migrate and what to kill (and why). For Taste, this meant cherry-picking the best 30,000 recipes.
The client team prepares their data. In our case, Taste used scripts that we had written to efficiently organize, normalize, and tighten an incredible amount of information.
Make the handshake between client data and our team. The internal developers at Taste played a critical role in making this handoff seamless.
Design a front-end that anticipates the needs of both old and new content and seamlessly bridges the gap. We delivered an experience for legacy recipes that integrated old and new recipes.
What We Did
- Content Strategy
- Brand Design
- UX Design
- Front-End Dev
- CMS Development
- Content Migration