There is a new tutorial on The Tech Labs that deals with runtime skinning of Adobe AIR applications and performance considerations. I wrote the tutorial to expose some general best practices of using runtime skinning and also to detail performance considerations. I hinted at the idea of native application skinning, but i wanted to dedicate a blog post to that topics, which follows below. The basic idea behind native application skinning is going beyond service based applications to truly integrated desktop applications that leverages OS specific user experience expectations. When we look at the applications we use day to day, we develop expectations on how it looks, functions, and interacts with us. It becomes easy to tell the difference between a widget and a desktop application. Main factors for integration are color and style, integration of user interaction paradigms per OS, and visual controls and implicit hot keys. Lets look at a couple of chat application to give a visual description of what I mean.
Above we see three applications – Tweetie (Mac client), TweetDeck(AIR client), and Twitterrific(Mac client). When visually describing the application we want to concentrate on how the application provides similar experiences and expectations to other applications we use on our desktop. Tweetie is a fully integrated native application that keeps with Mac UI and UX. The Tweetie application leverages a large header to add user controls such as search, and navigation. Tweetie has a preferences menu and multiple hot keys that can be accessed from the toolbar. Application controls and configuration preferences are basic expectations from the user of an application. When we look at TweetDeck, we see a SWF wrapped in a standard chrome window from AIR. These native window are OS specific, but you loose the ability to leverage the header for user controls and advanced application name management. When using the application, the first time user has to hover over icons to get descriptions, and the hot key are not available on the toolbar. When examining Twitterrific, we have tons of hot keys that are unknown unless you read the documentation. There is no preferences integration and it really can be defined as more of a widget then a desktop application. So we see that the platform on which the application is build does not define how the application meets native integration. We as AIR developer can do anything and are really unlimited in our experiences that we create with our applications. This idea of unlimited design is good and bad, the good is that we can create truly brilliant applications, the bad is that it takes more time and development just to get to the level of integrated native style and expectations.
The idea is that Adobe AIR developers should be creating application like Tweetie that really leverage the native UI and compliment user workflow. It is upon us as developer to leverage the work that Microsoft and Apple have already done in creating user expectation and workflow, and leverage those to create a truly integrated user experience. I can say that the current way we use the computer is not the best, but at the same point it is what we use and unless you are creating something revolutionary, you should create your applications on user expected experiences. The New York Times desktop reader application highlights how an AIR application can be integrated successfully on the desktop:
Adobe did an excellent job in leveraging the header to manage user controls and really create a sweet application name style. The user notification on updating of articles is awesome, the only thing i would like to see change is the window controls which always seem disabled. This shows an enterprise application that meets my expectations as a user. I would like to see hot key support in the toolbar, but this is a great step and example.
I want to see more and more AIR application that are not just widgets, dashboard apps, or SWFs wrapped in native chrome, but instead are an extension of the native OS that is a fully functional and integrated kick ass application. I have been working on a skin library to support OSX, XP, and Vista in Flash. Each has its own challenges, but i am looking so see if what i am talking about above makes sense, or if i am just a crack pot. If you are interested, drop me a line or create a rebuttal that tells me i do not know what i am talking about – I look forward to the challenge.