Create Your First Project
Start adding your projects to your portfolio. Click on "Manage Projects" to get started
Figma - Design to Development Handoff - Anatomy of a Book
Project type
Figma Design Prototype
Date
March 2026
HTML file.
Copy the following link into your browser:
file:///Users/sophiapoznahovskaharrison/Downloads/Anatomy%20of%20a%20Book/preview.html
This is the first iteration of the project. I used Gen AI to generate code for the rotation of four images that were generated in Figma using its assistant. My next steps are to input more images to make the rotation smoother, and then label all the different components of the book.
This is a creative project I am working on more or less for fun. The back story for this project is that I run a small side business with my partner selling books. I frequently forget the technical terms for the different structural parts of the books when I describe the condition in a listing. Would my time be better spent just remembering the terms or drawing a quick diagram? Probably. But I couldn't pass up an opportunity to figure out how to make my idea come to life (and probably overcomplicate this whole thing). Plus I couldn't get the idea out of my mind, and I wanted to see if I could do it.
The idea: an interactive diagram of a book where the user can click on any part of the book and the technical name will appear. It would act as a reference when listing the condition of books online.
The need: while the need is very niche, booksellers are very particular about their book terminology. My partner and other professional book dealers can spot a newbie just by the terms they use. The ultimate need is for me to identify what that page is called that is completely blank that comes before the title page... but if someone else finds this useful I'm happy to be of assistance!