designer + developer
Food for Thought
Web design
view site →

When I took the Web Design DeCal (that I now teach!) back in my Fall 2015 semester at Berkeley, I submitted this website as my final project. The prompt was to create 3 page views of any type of website we wanted to develop, given that we coded it using HTML, CSS, and jQuery.

Because of my obsession with all things food-related, I desperately wanted to build a fake food blog site. After hours of searching the web for photos that would fit the clean, white aesthetic I had in mind, I stumbled upon these incredible photographs from a French food blog that were perfect for the theme. I used the Masonry library to create a uniform grid layout for the photos and decided to make each image a card that, when flipped, would display the recipe ingredients on the back side.

Landing page
Grid layout
Card UI, flipping in-action

This was the first full website I've ever built, and I'm pretty proud to say that this site was voted 3rd place in the class out of all student projects. :^)

Lessons learned: That I love web design and that I'd love to teach the class I learned it from!

← back to all projects prev // next