Client/Project: The Ultimate Book of Barbecue
Goals: Planning an event like a backyard barbecue takes place on a variety of different channels – our goal was to support our existing print cookbook with digital materials to allow a user to experience and use the content on multiple platforms.
Results: A multi-platform experience, consisting of a print cookbook with a sticker that had a QR code to scan, leading the user to a website of additional ‘downloadables’ and ways to interact with new content. The print cookbook was also translated into a digital form and published, with the same link to the website of additional content.
Tools & Techniques
- Pen & Pencil
- Stakeholder Interviews
- International team management
- CSS + HTML5
- ePub creation + testing
- Adobe DreamWeaver
- Visual Design
- Adobe Illustrator
- Usability Testing on multiple devices
I worked on this project in many separate stages. In the discovery stage, I coordinated efforts with the marketing and digital departments to understand the end-goal of promoting the book and what steps we could take to offer users a multi-platform experience that would not be repetitive or confusing, but rather enriching and supportive of their barbecue plans.
We determined that a website with downloadable additions and a digital ebook would meet the above goals.
Translating a print design of a book into a responsive digital version entailed checking font and image rights and finding complimentary replacements when necessary, rethinking the layout of text on a page in order to fit multiple columns on a paper page to a single column on a mobile device without losing the book’s style and feel, and designing visual info-graphics to work on a screen.
ePub Layout Design
The first stage I created the conversion for the print book into a digital epub to be viewed primarily on mobile devices. I designed a template to translate the text into a single column for a better responsive design, and redesigned many images and charts to be easily digested on a smaller, “single-page” screen. Other design changes also included using color and hierarchy of type to make a recipe stand out from reference text.
The instructions and files were sent to international team members, and I managed the conversion processing. I approved the initial design and any changes. With the initial product back, I finalized the CSS and HTML of the epub and QA’d the final product across multiple devices.
Website Design – Wireframes + Additional Assets
With the marketing teams, we designed a stand-alone landing page for the book that would be linked to via social media, a link in the digital version, and a QR code on the print book cover.
We built the website to support the content of the cookbook as well as offering free downloadables like additional cookbook content, food labels, a tip sheet, and instructional cooking videos per the recommendation of our marketing team.
I designed the header images for the website, as well as tile images for each downloadable asset. I used both artwork from our print book as well as open source art and in-house assets to create tiles that visually had a clear, bold call to action.
In addition to the visual images, I created a small, stand-alone PDF booklet of desserts to download. This included page layout design, font choices, and overall booklet layout and creation to ensure we had a product that was easy to read, print, and download. I also created the ‘game’ downloadables from existing, in house assets.
I tied everything together on our marketing site using WordPress. I ran some lean usability testing on the site to ensure that our messaging and calls to action were clear on desktop, tablet and mobile devices.
We tracked the sales of each version of the book (digital and print) and the performance of our website to ensure that we were supporting sales of the book and people were visiting the website and downloading our assets. Sales of the book saw a modest bump around the ‘grilling holidays’, and at the same time, visits and downloads from our marketing page increased.