Pl. 10 / 13Case study
Web app that shows a printed piece in 3D from a PDF or image: folds, page turning, client sharing.
Personal project. I wanted an online tool where you drop a PDF or an image, pick a print type (flyer, business card, leaflet, booklet, book), its size and fold, and see the final result in 3D. It is aimed at graphic designers.
A flat PDF shows neither the panel order, nor the effect of a fold, nor the thickness of a booklet. The goal was a preview that the client can handle on their own.
I defined the scope: eight print types, standard or custom sizes, paper weight and finish, and a French interface.
With Three.js, a leaflet becomes an open sheet cut into hinged panels that fold on screen. pdf.js reads PDFs directly in the browser.
The share button generates a standalone read-only HTML file. The client rotates, folds and flips through pages without being able to change anything.
I tested an 18-page booklet. Artifacts at the spine, then overlapping pages, showed up. They were fixed over several passes.
I compared the tool with existing services (mockup generators, web-to-print modules, proofing tools) and outlined a subscription service.
I brought booklet page thickness close to its real value rather than exaggerating it, because the exaggeration (×3) raised the right-hand stack and made pages overlap at the spine. Leaflets keep an accentuated thickness, which reads better on screen.
I chose to read and display files in the browser rather than on a server, because a prototype needs no backend and the artwork stays on the designer’s computer. The trade-off: no hosted share link.
I chose a standalone HTML file rather than a hosted link for client sharing, because it validates the use case without a server or accounts. Known limit: the file gets heavier with a multi-page PDF.
A test on a real PDF exposed defects in minutes that demo templates were hiding. Bleed is not trimmed yet, the preview shows the whole PDF page: this is the first thing to fix, since a prepress professional spots it right away. I use it regularly for my freelance print work, and it suits me. No client has tried it yet: before going further, I would check the need with designers, since free tools already cover leaflet previews.
Colours sampled from the project visuals.