Last week I gave a presentation at 360|Flex 2010 (San Jose) on “Developing iPhone apps with the Flash Platform.” As always, I wanted to make my slides, notes, reference links, and example code available to those who were there and those who couldn’t make it:

Download slides, links, and example code (3.1 MB .zip)

I’ve been traveling since the conference so I didn’t flesh out my notes as thoroughly as I have for past presentations. If you have a question about a slide, feel free to ask in the comments and I’ll try to explain it better. The 360|Flex folks recorded video of my presentation as well as a screen capture. I believe the plan is to make those recordings available to attendees as well as people who couldn’t make it (though they may charge a fee if you didn’t attend the conference).

Acknowledgments

This is in the slides, but I wanted to once again thank all the people who helped me prepare this presentation (some knowingly, others just by virtue of content they’ve shared):

• Tom Krcha
• Renaun Erickson
• Jeff Swartz
• Aditya Bansod
• Ted Patrick
• Mike Chambers
• Lee Brimelow
• Chiedo Acholonu
• Greg Burch

It turns out that my thinking on that topic isn’t going to become anything in the Adobe documentation. So I’ve sort of just been sitting on my ideas with the idea that someday I’ll probably share them.

Which brings me to this post.

Aside: upcoming presentations on multi-screen development

This is really a side note to the main ideas here, but I thought I’d mention it since it’s the reason I actually stopped to write this. In one of my mind-wandering moments this morning, I realized that at the upcoming 360|Flex conference (San Jose, March 7-10) I’ll be involved in two presentations that are directly related to practical aspects of building multi-screen apps:

• As part of the pre-conference free training, Joel Hooks and I are doing a four-hour training on using the Robotlegs micro-architecture. (Joel is the main speaker, fortunately, because he’s one of the core Robotlegs developers and the main “evangelist.” I’ll be helping out, to try and help save his voice and maybe to help find typos. =)

  If you’re wondering what a Robotlegs session has to do with multi-screen apps…keep reading, it’s explained below.

• On Tuesday and Wednesday, Renaun Erickson and I are giving (two separate) presentations about building iPhone apps using Flash Platform tools. My session is more of an intro into the workflow, how it’s similar to other app building, and how it’s different. (Plenty of code to look at — don’t worry!) Renaun is going to get more into specifics of building a game, as well as some more intermediate/advanced topics like performance.

Funny that I never really made that connection until this morning. I guess subconsciously I knew this is a direction I want to move in, and that’s why I’ve been focusing my learning (and hence my presenting) on these topics =)

Background

While I was partially trying to keep my thinking abstract, from a practical perspective I centered my thoughts around developing using the Flash Platform. So conceptually, what I was thinking about was the idea of making a single “app” for multiple screens, which would mean that (in the technology of the next year or so) it could be potentially take several forms:

• a browser/computer app (Flash Player)
• a browser/mobile app (Flash Player)
• a desktop app (AIR)
• a mobile (iPhone) app (Publisher for iPhone, similar to AIR)
• a mobile app for other devices (AIR)
• a TV app or widget (Flash for the digital home)

(Obviously many of these are only out in public beta, some have only been vaguely publicly acknowledged, and others may or may not ever exist as actual Adobe products =)

One app, or many?

Back when I started thinking about this, there seemed to be two main camps. One group was a strong advocate for the “single source” idea: you would build one SWF or one AIR app and distribute that same app on any platforms (desktop/mobile/TV). Obviously a key element to that, especially for desktop/mobile apps rather than browser apps, would be having code that detects screen size and device capabilities and adapts the UI to the device.

The second group felt that it was more likely that developers who are creating an app for multiple screens would actually create multiple apps (from the perspective of the IDE). The apps would obviously share some code, visual assets, etc., but would be different enough that they’d be created separately and distributed as separate file types. (In the case of apps created for the iPhone, of necessity this has to be true, at least in terms of the publishing part.)

Since I try to be pragmatic about things unless I have a really good reason, I favored the second viewpoint. However, I acknowledge that in some circumstances the first approach might be used. As always, I think that developers are going to use a mix of approaches.

For example, suppose I’m building an app and I want to create a version for desktop computers, a version for the iPhone, and a version for other mobile devices. Personally I see this not just as an issue of “porting” the app from one platform to another. I think that each device has its strengths, and more importantly, each device is used for different purposes and in different contexts. If I’m building an app for a device, I should definitely be taking that notion of context into account as I’m designing the app. That pretty much rules out the possibility of using the exact same app (UI and everything) for both computers and mobile devices, unless I want it to run as a widget-type app on the desktop.

Also see: Adobe Flash Platform contextual applications developer center

Adaptable code to the rescue

On the other hand, that doesn’t mean that developers will always create completely separate projects. For example, suppose I’m creating an app for iPhone, and another for another mobile device. Or perhaps I’m using the Publisher for iPhone to create an iPhone version of my app and an iPad version. If my app is a game where I can more freely discard the conventions of the platforms, perhaps the only platform difference I need to consider is the difference in screen dimensions and pixel density. In that case, it’s quite possible that I can .

Even for a more line-of-business or productivity app, one of the key ideas in Slider, the future Flex mobile framework, is to (as much as possible) abstract away platform convention differences. For example, if iPhone usually puts the back button on the top, and another platform puts it on the bottom, and another platform puts it in a menu, and another platform has it assigned to a physical button on the device, then Slider might have a “back” event that you can hook into, and you can make your app perform the necessary “back” tasks regardless of platform.

Design patterns to the rescue

And, of course, in some situations you’ll almost surely need to create different versions of apps for different screens. For example, suppose you’re building a desktop Twitter client and a mobile Twitter client. Chances are good you’ll put some functionality into the desktop version that doesn’t go into the mobile one — such as previewing images, or maybe Facebook integration. On the other hand, adding a feature like automatic location tagging would make lots of sense in the mobile version, but not so much in the desktop one.

As I was thinking, many months ago, about the idea of efficiently creating different versions of the same app for different devices, a thought hit me like a ton of bricks. This is exactly the use case that the oft-mentioned “separation of concerns” is designed for:

Over several years, various “micro architectures” and “application frameworks” have emerged and waxed and waned in popularity. Many of these architectures are modeled around the “Model-View-Controller” design pattern (or its many variations).

One of the key benefits that these architectures claim is that it helps you keep the pieces of your application separate, without explicit links and dependencies between them. I’ve looked into and even tried out several of these over the years. One example that is frequently used to describe the notion of separation of concerns, which I always struggled with, goes something like this:

Suppose you’re creating an app, and you build the user interface and the other logic like server communication and data processing. If you use MVC/separation of concerns, then it’s really easy to just rip out your whole user interface layer and replace it with a new one.

They usually lost me with that one. As much as I tried, I couldn’t imagine a situation in which I’d want to build my app and then just rip out the UI and replace it with a different one note 1.

Until now.

Suddenly I had discovered, for myself at least, a real-world use case for the separation-of-concerns-so-you-can-swap-out-the-UI argument. If I’m building an app for the desktop and mobile, I’d like to be able to reuse my code where I can. At the same time, some functionality is only going to apply to one app or the other, so it’d be nice to be able to plug it in cleanly. Oh and by the way, the user interfaces are going to be different, so being able to swap those out is an absolute must.

I’d always liked micro-architectures in general, if only because I like knowing that I’m building my app using some pattern or structure that is based on developers’ real-world experience. It’s much nicer than trying to invent it myself and having to deal with all the pain points they’ve already gotten over. Now that I am imagining a world where I create multiple versions of the same app, with similar functionality but different user interfaces, suddenly micro-architecture patterns have become indispensable in my mind.

Conclusion

These are only just a few of my thoughts about the future world of multi-screen, contextual applications. Like Lee Brimelow, I believe that going forward building multi-screen, multi-context apps is going to be a much more common scenario. From my perspective as someone who thinks a lot about user experience design, and trying to optimize tools for the task and context, I think this is one of the most exciting aspects of the current technology revolution. I’ll definitely continue to share my thoughts and ideas in the future (hopefully more practical ones, too, not just abstract ones like this =)

Notes

Note 1: Just to be clear, I’m not trying to sound negative about MVC or micro-architectures/frameworks. Most of them provide many benefits, many of which are also related to the idea of separation of concerns, such as making code easier to test, making code cleaner, reducing boilerplate code, providing structure so that teams or developers who inherit a project can get going more quickly, etc. Swapping out the view layer is just one little benefit they mention. (back)

Adobe AIR data privacy and security slides, notes, and links (1 MB .zip)

As a side note for those who actually attended the presentation, in retrospect I think I over-emphasized the security concerns and didn’t emphasize enough that there are plenty of use cases for which AIR is definitely secure — especially in the case where you need to keep the user’s private data secure. Hopefully the notes that accompany the slides help to clarify this somewhat.

I also used and referred to a number of resources in my presentation, which are listed below. The download .zip with the slides also includes an html page with all these links.

Introduction

• "Maintaining security with Adobe AIR" by Ethan Malasky and Peleus Uhley (Adobe MAX 2008)

Background

• "AIR security" (Adobe AIR documentation)
• "Why Adobe AIR Doesn’t (Yet) Include the Feature You Most Want" by Oliver Goldman
• "Understanding the Flash Player Security Model" by Deneb Meketa (Adobe MAX 2008)
• "Considerations for using encryption with a database" (Adobe AIR documentation)
• "Using digital rights management" (Adobe AIR documentation)
• Operating system security (user and "admin" rights)
  • "What are Adminstrative Rights, Anyway?" by Oliver Goldman
  • "Does Installing an AIR Application Require Admin Rights?" by Oliver Goldman
• Source code visibility
  • Action Script Viewer (ASV)
  • "Ethical SWF Decompiling" by Lee Brimelow
  • Nitro-LM
• Encryption: ActionScript crypto libraries:
  • as3crypto
  • OpenSSL (partially) cross-compiled to ActionScript using Alchemy

AIR application installation

• Sign your app with a trusted cert
  • "Code Signing in Adobe AIR" by Oliver Goldman
  • "Digitally signing Adobe AIR applications" by Todd Prekaski
  • Promotion: get a free signing certificate (while supplies last) by submitting your app to the Adobe AIR marketplace
• Plan for updates
  • "Building AIR applications that can be easily updated" by David Deraedt
  • "Using the Adobe AIR update framework" Quick Start article by Jeff Swartz (Adobe AIR documentation)

Modular applications

• Sandbox bridge
  • "Scripting between content in different domains" (Adobe AIR documentation)
• XML signature validation
  • "Creating and validating XML signatures" by Joe Ward
  • "Using the XML signature validation classes" (Adobe AIR documentation)
  • "flash.security package" reference (Adobe AIR documentation)

Local shared objects

[No links]

Encrypted Local Store

• "Storing encrypted data" (Adobe AIR documentation)
• "EncryptedLocalStore class" reference (Adobe AIR documentation)

Local files

[No links]

Local SQL database (SQLite)

• SQL injection attack
  • "Using parameters in statements" (Adobe AIR documentation)
  • "SQLStatement.parameters property" reference (Adobe AIR documentation)
• Encrypted database
  • "Using encryption with SQL databases" (Adobe AIR documentation)
  • "Using the EncryptionKeyGenerator class to obtain a secure encryption key" (Adobe AIR documentation)
  • as3corelib project (includes the EncryptionKeyGenerator class and hashing algorithms

• SilvaFUG North (SF) May meeting (May 12): This is basically a pre-event for FlashCamp, with presentations on Flex-related designer concepts and designer/developer workflow. I’ve been away from the design world for a while, so I’m excited for the “refresher” course.
• 360|Flex Indianapolis (May 18-20): I’ll be there, speaking on “AIR data privacy and security”, and you’ll also find a host of the best and friendliest Flex developers I’ve ever met, including a healthy contingent from the Flex engineering and evangelism teams. If I had to choose one conference to go to (and I probably do, this year) 360|Flex is it for me.
• Bloomington, Indiana Adobe users’ groups (May 21): While I’m in Indiana, I’ll be heading down to Bloomington to speak to the users’ group(s). My presentation topic is still being finalized, but it looks like it’s going to be something around Flash/Flex Designer/Developer collaboration (notice a trend?). I’m also hoping to have a bit of time to catch up with friends, colleagues, professors, etc. — I went to grad school at Indiana University and worked for IU after graduation, living in Bloomington for just under six years total.
• FlashCamp San Francisco (May 29): Back in SF, at the Adobe office, this is the preview event that’s not to be missed, covering all things Flex 4/Flex Builder “Gumbo”/Flash Catalyst. I won’t be speaking at this one, but I’ll be hanging around learning more Flex 4 goodness, talking to developers (as part of the AIR team), etc.

As I mentioned briefly before, this week I presented at the 360|Flex San Jose (August 2008) conference. My presentation was titled “Adobe AIR SQLite: An optimization conversation.” As I mentioned in the presentation, the term “optimization” could mean a few different things — for example, optimization meaning improving performance, or optimization meaning improving developer productivity. While my presentation focused mostly on the first type of optimization, I included suggestions for tools, libraries, and strategies that fall in the “developer productivity” type of optimization as well.

Anyway, as always I’m happy to make my presentation materials available. Here are the slides (with some notes) from my presentation:

“Adobe AIR SQLite: An optimization conversation” slides (PDF in .zip - 504kb)

I don’t really have any specific code examples, apart from what’s in the slides, so there’s no “source code” download. However, I did link to a lot of external tools and resources (including a few of my own). To save you the trouble of digging into the PDF, here are the links:

Tools

• Cristophe Coenraets’ “SQLite Admin”
• My tool for testing queries
• “Lita” by David Deraedt (I learned about this one after the presentation, so it’s not discussed in my slides/video, but I thought it’d be worth mentioning anyway.)

Application architecture/patterns/libraries

• SQLite MXML wrapper classes (Peter Elst)
• Data access layer (Brandon Ellis)
• asqlib SQL statement generator (Miran Loncaric)
• “Command” classes (me) as demonstrated by my AddressBook sample application
• AIR ActiveRecord source and blog post explaining its usage (Jacob Wright)
• AIR SQLite Cairngorm services (Eric Feminella)
• Connection and statement pools, mentioned (with source code) in the article User experience considerations with SQLite operations (Daniel Rinehart)

Finally, as you may have heard, Adobe sponsored the recording of every presentation at 360|Flex, and they’re all going to be made available free of charge via a channel in Adobe Media Player. They’re rolling them out in phases, and mine isn’t available yet. When it is, I’ll update this post with the video as well. Update: the video is now available on Ted Patrick’s blog as well as in Adobe Media Player.

In the mean time, 360|Flex was full of awesome presentations. I wasn’t able to get to all the ones I wanted to see, due to conflicts and me trying to finish up preparation for my presentation. So I’m going to be spending some time watching many of those videos as well. If you’d like to see the videos, Ted Patrick has posted instructions on his blog:

How to view 360|Flex San Jose 8/08 session videos in Adobe Media Player

Okay, so I did know that they interviewed me (although in my memory it didn’t happen at Starbucks), and those are in fact my answers to their questions. (I actually wish they had reformatted them a bit. I think they are a bit tough to understand as they appear in the post but I didn’t realize the context in which the answers would be presented.) In any case it’s quite a silly read, and the other speaker interviews they’ve posted are even funnier. Poor Tom sure puts up with a lot of heckling from John.

Although I’ve never been to 360 Flex before, I’ve always wanted to go. I was fortunate enough to get chosen as a speaker — hopefully my presentation will turn out well enough that they’ll let me come back again =). And I definitely meant it when I said that there are so many presentations I’m looking forward to, that there was no way I could limit my list to just two!

Oh, and I suppose I should make two small corrections. One, i haven’t actually started working on my slides/presentation content for 360 Flex yet (oops!). Two, as of now I’m not planning to include any stick figures in my presentation. That’s not to say I never have, however =)

P.S. I know the issue of identity theft is a real one, and a very serious one. In fact a couple of weeks ago I thought I might had been a victim of identity theft (expected bills and checks were missing from my mail) and it was very disturbing. So please don’t take my joke about someone impersonating me as a sign that I don’t think identity theft is a real, serious issue!

In all those presentations I promised to make my slides and code available. For those of you who attended my presentations these are a long time coming; for those who attended my session at Webmaniacs/Flexmaniacs, these are also somewhat overdue.

In any case, after deadlines, conference, and illness, here are the slides and files for my Webmaniacs session “Adobe AIR: Windows, Menus, and the System Tray” (and my two SilvaFUG presentations that were based on that session):

• “Adobe AIR: Windows, Menus, and the System Tray” slides and files (2.4 MB .zip)

The .zip file contains three files and a folder:

• Webmaniacs 2008 Slides for presentation.pdf: PDF “notes pages” printout of my presentation — each page contains one slide plus any notes that I added.
• Exercises.pdf: Since this is a “hands-on” presentation I created this document that contains step-by-step instructions for all the exercises. Using this plus the files below you should be able to work through all the exercises for the session.
• Code Snippets for exercises.txt: While all the code listings for the exercises are available in the PDF, a few of them are really long. In any case, if you’d rather copy and paste instead of type as you work through the exercises you can get the code from this file.
• Exercises_workspace_start/: A Flex Builder workspace with the “starting state” of some of the exercises for the session. Most of the exercises just start from a blank screen or continue a previous exercise, but for a few I set up the UI ahead of time to save time, and those files are in this folder.

Enjoy! As always, please leave comments and feedback.

• At the end of May I’ll be speaking at the Webmaniacs conference in Washington D.C. (May 19-23). I’m giving a two hour hands-on session titled “AIR: Windows, Menus, and the System Tray.” The session is being offered twice, on both Thursday the 22nd and Friday the 23rd. (And inexplicably, the Friday afternoon last-session-of-the-conference session is much more full than the Thursday one.)
• In two days, on Thursday April 17, I’ll be presenting a “beta” version of the same presentation for the Silicon Valley Flex Users’ Group meeting. That meeting is being held at the Adobe San Francisco office at 601 Townsend St., from 5:30 - 9:30 pm. (I’ll be presenting for the first half of the meeting, then Luke Bayes will be talking about his “Sprouts” tool set for the remainder of the meeting.)

As I always do, I’ll be releasing the slides and source code for these presentations once they’re done. However, since my SilvaFUG presentation is just a “beta” version of my Webmaniacs one, I won’t release that one until after Webmaniacs is done. (Since presumably the Webmaniacs version will be the better flushed out, more complete one =)

Here are the direct links:

• Grant Straker on Moving ZoomFlex from a homegrown framework to Cairngorm
• Ali Mills and Luke Bayes on Flex application frameworks (A great overview of the strengths and weaknesses of various frameworks like Cairngorm etc., from two really smart developers.)

Enjoy!

(via email from SilvaFUG)

Anyway, if you’re interested in this topic, the following links may be useful to you:

• A Slides (with lots of notes!) and example files/code (271 KB .zip)
• A recording of the presentation, in case you want to actually hear what I had to say =)

As always, feel free to add a comment or contact me if you have any questions or thoughts.

As promised, here are the slides, example files, and notes from that presentation.

• “Flash and external data communication” slides and example code (288 KB .zip)
• Recording of the presentation (I only got through about 2/3 of the slides)

I’ve added some notes to the slides, and some comments to the code in the FLAs. Feel free to comment or contact me directly if you have any questions or want to know more.

In case you’re in the Bloomington, Indiana area, or if you’re just curious what I look/sound like… =)

Next week (May 24) I’ll be the presenter at the IU Multimedia (formerly Macromedia) Users’ Group’s May meeting. My presentation is titled “Flash to external data communication.” Here is the description from the meeting announcement:

One key element in moving beyond the “isolated individual” interactive experience is having a way to load information from an external source and save information to share with others. Even when building a purely standalone project, the ability to dynamically load information provides a low-maintenance solution for keeping content updated. This presentation will provide an overview and examples of the many ways to get data from an external source (e.g. a server, text file, XML, or database) and send data to a server using ActionScript.

IUMMUG welcomes H. Paul Robertson back to the podium for our May meeting. Paul is always engaging and regardless of the topic he always has plenty of value to share for beginners and experienced developers alike. Join us in person or on line for this informative and valuable presentation.

I plan to cover a range of topics in ActionScript 2.0, and hopefully at least touch on some Flex 2 and ActionScript 3.0 examples too (since that’s almost entirely what I work in now).

As the description suggests, you can attend in person (of course) or via the live Breeze meeting. Location and other details are available in the meeting announcement.

I plan to post my slides/notes/code examples after the presentation, for those who attend or those who can’t make it.

And as a side note, apologies for the non-tutorial or resource post — it’s a change from my usual, for sure.