Templates for Device Mockups

Erica Gamet

1

I recently learned that the designers at Facebook make some of their designs and design tools available for designers to use. Designed originally for their design prototyping tool Origami, their collection of devices lets you see your designs as they would appear on those devices. Designing an app for the iPhone or a productivity tool for the Nexus? These images make it easier to conceptualize your final product. Each bundle includes PNG files into which you can slip your mockups as well as the original Sketch file used to create the image.


More than high-end smartphones, they have less flashy devices such as the Nokia 230 covered, with plans to add tablets, TVs, and wearables in the near future. It’s not all about the devices, either. They recently made the “Diverse Device Hands” available, which expands on their lone Caucasian male hand featured in previous mockups. In creating a more diverse stable of hand images, Facebook photographed the hands in-house and documented the process here. Strangely, they mention having over 25 hand model volunteers, but the downloaded images seem to contain only two. Still, it’s a good start and making them freely available is a nice touch.