Dieter Brehm

Joyful Eats

The joyful eats website in three mobile phone views, showing the landing page, dishes, and restaurant blog posts

Joyful Eats is a blog for sharing exciting dishes, restaurants, and cafes.

Recently I was asked to design a blog concept that merges a recipe site and a restaurant review blog. There are plenty of people combining these ideas informally on Instagram or other social media platforms, but in my research is was rare to see an independent site presenting both content.

The brief for this project was to make a site that displays restaurant reviews, pictures, and recipes in a clean but whimsical blog archetype.

The work began with logo explorations that would later inform the site and the brand. These were done in Illustrator, and after several revisions we landed for the moment on the bottom right option in the below frame.

The final revisions of the logo for joyful eats, the final being text on an arc with a pink circle and a boba cup.

It took quite a few revisions to build up the letter forms and concepts that were the most interesting. It wasn’t lost on me that the initial concepts had a serious flaw in the reading order either! That caused the switch to a circular pattern system for future versions.

Early revisions of the joyful eats logo system.

The site itself features all the common features of blogs, with tagging, a simple paginated long-scroll viewing system, and navigation menus for the separation of meals and locations.

A desktop view of the joyful eats site showing the places view

Before reaching Figma, I did extensive sketching and prototyping on my dot grid notebook.

Process sketches showing logo development from the core idea of joy and of boba, including playing with how to represent information in the site.

As a playful element on the site, a color-theme selector is available for user customization which features several hand picked color schemes. Following in this vein of whimsey, I selected the fantastical header font Comico to stand out from the common recipe sites which tend to target thin, elegant fonts. To ensure balance, I used Inter, which is a tad more serious.

a desktop view of the joyful eats site showing the dishes view

Another detail I enjoyed designing was this simple landing page which shows on first browser load. It’s a polite and gentle introduction to people who are more familiar with traditional recipe sites.

The joyful eats website in three mobile phone views, showing the landing page, dishes, and restaurant blog posts

©2021 Dieter Brehm. All rights reserved.