Coming soon to Storyboard Suite: Support for 9-patch Images

Application design usually means working with an abundance of graphics, and when designing applications for multiple screen sizes, designers have to keep in mind how those images will scale when deployed across different resolutions and aspect ratios. A button that looks great on one screen might have awkward corners or warped text when scaled to fit a screen of a different size. To avoid this, designers often create multiple versions of their graphics in various sizes. While this allows for tight control over the visual presentation of the graphics, it also means extra time, effort, and resources.

So how do we create graphics with scalability in mind without having to duplicate effort, bloat file resources, or sacrifice quality? Enter 9-patch.

What is a 9-patch image?

Essentially, a 9-patch image is a custom graphic that scales the way that you intend it to, which you define when creating the graphic. Where supported, this stretchable image is automatically resized to accommodate the content as defined. The “as defined” part is what allows designers to retain control over how a graphic looks even when it is resized.

Check out this example. Both buttons look the same before, but the 9-patch button retains it’s original appearance when resized to be slightly wider and much higher. The other image scales poorly, especially at the border and corners.


How to define the stretchable areas of an image

9Patch`A 9-patch image is a standard PNG image that includes an extra 1-pixel-wide border and must be saved with the extension .9.png. When creating 9-patch images, designers can indicate which areas can and cannot be stretched. We will post our own tutorial when we release the next version of Storyboard Suite, but for now see this tutorial to learn how to create 9-patch images. For more information on the background of 9-patch, check out the Android Developer documentation.

We are stoked about the new features and enhancements that are coming out in the next release of Storyboard Suite, which is just around the corner. 9-patch support is just one of the many features we’ve added to streamline the design process, so stay tuned for release information!

Apple gives the nod to Lua on iPhone/iPad

OK .. so Apple never came out and specifically said that you couldn’t use Lua, but the terms of the iPhone developer license were such that incorporating an non-Apple language interpreter was in violation of the agreement.

Many claim that this clause was directed specifically at boxing out Flash, though Steve Jobs has indicated that it isn’t only about Flash, but rather about maintaining a high quality experience with proven and tested technologies … provided by Apple of course.

This caused quite a bit of outrage in the Lua community, specifically because Lua is already embedded in a number of  iPhone applications and is a language designed to facilitate application extension through scripting.

Looks like a quiet change to the License Agreement was made at Apple’s WWDC last week.

The good news is that this also opens things up for us to move forward with our evaluations of a Storyboard port for the iPhone platforms … and just to be fair we’re evaluating Android too =;-)