I built a tiny PHP tool to generate a one-page, printable phone book inspired by Tin Can’s playful design language. The goal was simple: make it easy for kids (and families) to keep important numbers visible, readable, and fun, without needing another app.
What It Does
The tool lets you:
- Enter up to 14 contacts
- Use either an external number (123-456-7890) or a short Tin Can number (400790)
- Upload profile photos
- Set up to 4 speed-dial contacts with custom icon badges
- Add “My Phone Numbers” and an emergency 911 area
- Generate and download a letter-size PDF ready to print
It also supports lightweight profile links (?profile=…) so you can come back later and edit your entries.
Design Direction
I wanted the printed output to feel kid-friendly and clear:
- Big names and numbers
- Strong contrast
- Profile photos with rounded corners
- Spacious cards for easier scanning
- Tin Can-inspired color palette and framing
A lot of the work was layout tuning for print behavior: margins, clipping safety, spacing rhythm, and making sure output stayed readable across different contact counts.
Technical Notes
Built as a single index.php app using PHP + GD.
Key implementation details:
- PDF is generated from a rendered canvas and returned as a downloadable file
- Phone normalization for external numbers (auto-format to dashed style when possible)
- Image-path + file-upload support, with fallback avatar behavior
- Speed-dial rendering logic adapts to selected count
- Row reordering in the form via up/down controls
- Mobile-friendly form improvements, with a “desktop is best” hint
Tradeoffs and Lessons
- Browser/server font differences are real in image-based PDF workflows
- Print-safe margins matter more than on-screen pixel perfection
- “Simple” form interactions (like reorder UX) can be the fiddliest part
- For family tools, convenience features (like saved profiles) need clear privacy messaging
Why I Made It
This is part utility, part experiment in “small software with a real use.”
One page. No account required. No app download. Just a printable contact sheet that kids can actually use.
If you want to try it, you can use the live generator here:
https://mvmp.cc/tincan/
Questions or feedback: [email protected]
Leave a Reply