flag asset slices

One of the parts of building beautiful software that you don't often see on sites like this is the meticulous, un-sexy work involved in translating a pixel-perfect design into code that replicates it faithfully. I'm lucky to work with an incredibly talented iOS engineer, and we spend a lot of time thinking about how exactly we should slice up assets from the design, which elements we should create in code, et cetera. For this design: http://dribbble.com/shots/916410-visual-activity-stream, we needed the flag labels to work for names of variable length. Normally under these circumstances we'd just try to implement the element in code so the length could be flexible -- but drawing lots and lots of shadows, especially on UI elements that animate and must be constantly redrawn, can be a huge performance hit on iOS. So we decided to slice the element up into four constituent assets -- essentially the 'end pieces,' and a 'middle piece' that can be stretched uniformly in code to accomodate a variable length.

More by Kevin Twohy

View profile