The Book Report:
Personal Project
Web Design + Development
Problem Statement:
I wanted a way to showcase the books I've read over the year that combined digital reading lists and physical library ephemera like loan cards and stamped dates in a fun and playful way.
I designed and produced the site and all assets myself utilising Figma, Adobe Illustrator + Photoshop and Webflow. The cards themselves were produced physically with a typewriter, pens, label maker and date stamps.


I really love library loan cards and the sense of nostalgia and joy of going to the library as a kid and wanted to reflect this in an online reading list where I can keep track and showcase the books I read over the year. I felt that the best way to capture the essence of this was to use real loan cards and stamps to show a list of books and their finish dates which I could then include on a website. Each month I fill out a card using fun methods like my typewriter, nice pens and a label maker then scan it and adjust it in Photoshop before adding it to the website.

A photograph showing a typewriter, date stamps and loan cards used within the project.
Figure 1: The physical process.


It was important that the website also convey a sense of nostalgia and fun to showcase the cards whilst also feeling like a connected part of my personal portfolio website. I created the logo myself using Figma and Illustrator inspired by vintage reading promotional material. I wanted it to feel like something you could find on an old library poster but also fit nicely within a website. I use Pitch as the typeface throughout my portfolio and it also works nicely here to complement the use of an actual typewriter.

The design for the desktop version of the website.
Figure 2: Desktop view.

It was also important that the site look as good on mobile as it does on a desktop computer and responsive design was applied to ensure this:

The design for the mobile version of the website.
Figure 3: Mobile view.

You can visit The Book Report at

Other Work: