Making Sketchsheets

Every new project would require me to sketch out new ways of showing content in my designs — something that showed the scrolled content, or multitasking, different sized devices side-by-side etc. While it’s easy enough to draw a quick box and start scribbling in it, sketching within the frame of an actual device gives both context and a better sense of scale, I find.

As far as I could tell, there was no other single source online for a collection of device frames for printing. existed at the time, but it had out of date (and limited) devices (Update: Pasquale Vitiello has since updated the site for newer devices and a broader range of templates! Check it out). That was enough for me to decide to create Sketchsheets as a free resource for everyone else also in my position! However, there was a problem... I had ~15 templates that were based on iPhones, iPads and a generic Android sizes. That wasn't going to be enough in my mind to launch a site dedicated to printable device templates. I wanted to focus on templates that covered every situation you might have to design for. So I made a list... which grew, and grew, until I had a backlog of about 70 templates to create 🤦‍♂️. I had already committed to the idea in my head, so I ground down and started creating new templates on a daily basis. A few weeks went by and I had a total of 85 templates and loads of devices. That'll do it!

Going live!

I launched it on Product Hunt in 2017, and it was picked up and featured the same day on Very quickly I was getting up to 700 visitors at a time! I had tested it thoroughly before deploying so I was confident nothing would break, but I didn't really account for the bandwidth all the downloading of templates was eating through. I was hosting on a Digital Ocean droplet which had a transfer limit of 2TB per month at the time and some quick calculations confirmed I was going to go over that limit in a matter of days. My solution was to temporarily disable the 'download all' button until I could afford more bandwidth. People would still be able to pick and choose what they wanted to download, so I didn't think this would harm any users... maybe just annoy the lazier ones (the amount of emails I got asking for a "download all" button confirmed this). My inbox was flooding with device requests, "thank you's" and "can you add an option to download them all's" on a daily basis. The format of making a selection of just what you need at that time, I think, was the saving grace for most people. Unfortunately it was very hard to maintain that way, as I'll go on to explain.

Out with the old, in with the new!

I had made the first version of Sketchsheets as a grid of every single available template that you could pick and choose from, and download your own collection. This made the most sense to me because when I’m starting a design, I’m looking for a particular set of templates based on the orientation of the app, or type of content it’s displaying. Unfortunately, this current system had turned out to be an absolute nightmare to maintain by myself! I was having to export previews of every sheet and manually add them to the site each time. I’m sure there was a way I could have automated this to some extent, but that was a bit outside of my field of knowledge. As the months ticked by, more and more devices were released and I found myself falling behind with updates for a while. I knew it had to be simpler for myself to maintain, so I decided to redesign the site and organise the templates into device specific downloads. This would simplify my work load greatly, as all I would have to do when I updated, or added a template, is update the file in the repository and I wouldn't have to touch the front end (unless I was adding a new device).

Sadly my relaunch of Sketchsheets 2.0 on Product Hunt didn't go as well as the first, achieving very little upvotes and engagement, whether that be because of the day or time I submitted it — I'll likely never know. Unfortunately that meant I wasn't able to test the intial reaction to the redesign in any significant way. Perhaps the first version of sketchsheets that (at a glance) showed every template type was a more engaging format. My analytics show a pretty consistent number of new and returning visitors, however, so it's hard to say.

What next?

I've toyed around with the idea of creating a desktop app for quick printing, or a sketch plugin for people wanting to import the frames of devices. But, for now, I am just focusing on requests from users and maintaining the current influx of new devices. Currently, I'm happy people are actually getting good use out of it... it's great to hear from companies and universities around the world who are using it! If you haven't yourself.. give it a try!