Introducing the Caltrain Times Application
I have been working on a mobile application and finally have it released in the major marketplaces. It has been a great learning experience to go through the mobile developement process. The mobile application I have been working on is called Caltrain Times.
The purpose of the application is to help commuters of the Caltrain system easily navigate the train schedules through a good looking interface. If you are not familiar with Caltrain, it provides commuter rail service along the San Francisco Peninsula, through the South Bay to San Jose and Gilroy.
My approach to this application was to focus on the design and UX first. I spent time flushing out different UI interactivity approaches in code, then tested often and early across three classes of DPI screens.
My team has been working with a design agency out of Denver called The1stMovement for a other applications, Finicky (Terry Ryan) and 100 Days of Exercise (Ryan Stewart). They also did the design work for the Caltrain Times application. Taking the Photoshop PSD I went through and cut up the document, then exported the assets in three sizes. Flex provides a nice method of managing different sources based upon DPI of the application. I will go into more detail about the different approaches I took in workflow and using Flex in later posts. The main take away is that I found flushing out the UX in Flash Builder (adl with a bunch of different launch configurations) and across actual devices worked really well to make sure things looked and performed well.
I started working in the train time data, GPS functionality, and twitter feed logic after I nailed down the UI interactivity. Then I did some minor tweaks to handle overriding the application DPI based on screen size and screen resolution (phone vs tablet basically).
The next steps where to publish out release versions, which I used Flash Builder 4.5.1 to do. It was easy to create the different release packages (.ipa, .bar, .apk) with Flash Builder 4.5.1. You do want to spend some time going through all the dialogs and only include files into the respective packages that are needed for that platform. The process of getting all the icons, screenshots, descriptions, and other material needed to submit the different packages across the marketplaces wasn’t as bad I had feared it would be. But this was partially because I had high enough resolutions of the assets needed, scaling down for the various sizes. I also made use of some custom Flash Builder 4.5.1 launch configurations on the desktop to get the different screen shots.
Enough said for now, go try it out for yourself. It works both on phones and tablets:
If that wasn’t enough I also have made the source code available to use under a creative commons license.
Pingback: Cool Stuff with the Flash Platform - 9/8/2011 | Remote Synthesis