User Interface: The Template Image Button

October 26, 2012

I recently switched to a full-time position here in Push Popcorn, as Gabriele already told you, in order to speed up the development of Records.

Working from home is the best condition for me; I love working by night and spending much time focusing on details I consider important for Records.

Well, today I want to show you some of these "details".

Since Mac OS X 10.5 is possible to render an image as a template into the NSImage class. This kind of template images have typically been used in Toolbar items and in the bottom side of Mac apps, inside buttons. The final result is an image like this one, with two states and two colors for "normal" (dark gray) and "pressed" (black):

The final result is pretty cool but, for Records, I wanted to improve it a bit more, in order to use different colors, starting from a single PDF black mask representing the image. That's why I rewrote the default template render mimics introducing the template color property.

This is the final result. Honestly? We love it. And you?