This is a guest post by Juri Vasylenko of Ramotion - one of the most skilled interface design and icons creation studios out there.
That’s an obvious point because developers are technical specializes and they like to solve logic task most then cut. PNG’s and build user interfaces. However, the GUI is the first thing that users see in the app, and largely, the applications success depends on how attractive app is.
During the few lasts projects we have seen, that app user interface creation is the most time-consuming task, and we’ve been thinking how we can work on this task with more productivity in mind.
Borrowing experience from game development, where all the UI assets are stored in sprite sheets, we decided to try the same approach in UI-oriented app development.
Here is an idea how it can work.
Using one of the GUI templates, developers can compile an app skin template (sprite sheet) and plist where are stored coordinates of each element (buttons, icons, etc) and send this sprite sheet to the designer.
So the main task for the developer is to create the UI with native elements and link each one to the image in sprite sheet. After that the designer will replace each item in sprite sheet to a customized asset and send them back to the developer.
If everything is designed well, the developer would only need to replace the old sprite sheet to a new one and run the app with a new skin.
Ideally you would want to have a library that puts all the images to a dictionary and apply the skin to the item automatically.
It’s only a theory at this stage though, but we will try to do that in practice and inform you about our results here in future!