I’m currently developing my first iPhone Native App. When it was time to distribute the App to different test persons I met some issues. I will not get into the process of collecting the correct certificates and mobile provisioning file. I had the Ad Hoc Provisioning Profile, all test persons had registered their devices with correct UDIDs and I did build the App from Xcode using correct Release Configuration. The problems started when I was sending the MyApplication.app file by mail to my home Windows computer. My mail client and/or the Windows 7 OS corrupted the .app package in the process and iTunes would not accept my installation files…

When you buy an App from App Store you get .ipa files. How come I don’t get this when I build my App from Xcode? I read up a bit on how to create a .ipa file that should be easier to install on both Mac and Windows. This is how you can approach this solution (assuming that everything is ready to be published):

• Finder: create a new Folder somewhere, call it i.e. “AdHocDistribution” or whatever you like
• Finder: inside the Folder you created, create a new Folder. Call this “Payload” (case-sensitive)
• Finder: if you have created the icon artwork required by Apple for distribution to App Store, add this to the “AdHocDistribution” Folder and call it “iTunesArtwork” (no last name on this file!)
• Xcode: Choose you Release Configuration
• Xcode: In the menuline choose Build > Clean All Targets
• Xcode: then choose Build > Build
• Xcode: Find ‘Products’ under the ‘Groups & Files’ section and select the file called ‘yourAppName.app’
• Xcode: Right-click on your .app file and choose ‘Reveal in Finder’
• Finder: When the App package is revealed in Finder you’ll see 2 files, one called yourApplicationName and another one called yourApplicationName.app.dSYM.
• Finder: Copy or drag the Application file that is named without any lastname to the “Payload” Folder
• Finder: In the “AdHocDistribution” Folder, select the “iTunesArtwork” file and the “Payload” Folder
• Finder: You should now Zip these two files but be aware. Using the default Mac way “Compress 2 Items” will include some Mac specific files which might get you into trouble on Windows. The safest way is to use a Zip application like “BetterZip” or “YemuZip” that creates a Zip file that will guaranteed be compatible with Windows.
• Finder: Then rename your Zip file to be named .ipa instead of .zip
• Use this .ipa to send to your test persons along with the appropriate mobileprovisioning file
• The test users can easily drag the .ipa file and the .mobileprovisioning to their iTunes and sync the App to their iPhones

A bit harder part was handling events. Air for Mobile supports touch and multi-touch events but generally you have to choose whether to use multi-touch, gesture or none. If you use gesture mode you can use defined gestures and all other simple events are interpeted like mouse events.  Choosing touch mode will enable you to have more control over events e.g synthetise you own gestures. When you decide not to use touch events, all will be interpreted as mouse events, and is advised to use when app is intended to run on touch and non-touch devices. My choice was to use touch and I was able to enable horizontal swipes between app screen as well as scrolling and taping for selected items. Of course mouse over events do not work on mobile devices.
After spending couple of days I was converted from Android ignorant to Android developer, and here are big thanks to Adobe. Being able to use the same, well known and adapted technology is a great thing which brings down entry-barrier into Android development world. Every Air/Flex developer will be able to create mobile versions of application using technology that is well known to him, using the same controls, effects and back-end communication. Only thing that changes is visual – but it is something you cannot avoid, and events, but it is nothing much different from ordinary mouse events.

Release date is said to be second half of 2010 so I expect to have final version of Air this autumn, but already there are plenty of apps in web. The only problem for me was unable to test it on real device – I don’t have Nexus One.

I have spend some time looking at unity3D and how we can use this 3D engine. Unity is an integrated authoring tool for creating 3D games or other interactive content such as architectural visualizations or real-time 3D animations.  It is mainly used for game design, but has a huge potential when it comes to real time visualizations.

I have made a very simple game to get familiar with Unity. The plot is quite simple. You got some boxes with a nasty attitude, and its your job to sort them out. Try the game here.

The focus has been to get to know the unity environment and how to make tings move and interact. In this game I use real time physics, particles and a simple intelligence  for the enemy’s.  For graphics I only use cubes. My game is written in JavaScript, but Unity also supports C# and Boo.  Unity can export to :

• Stand alone players for mac and pc.
• Web player
• Iphone and Ipad
• Android
• Wii, xbox and playstation.

Unity has an excellent integration with all the major 3d apps like Maya, 3ds, c4d etc. Unity comes with an Editor where you combine scripts, 3d assets (models, texutres etc), sounds, terrains, physics and more. Read more about the editor

Where to go from here

I see great potential in Unity and will start a new project when I get the time. The focus will be to get a plot, good looking models and environment. Build it all  in Maya, export it to unity with lights, textures, animations and the rest of it. Should be good.

My first App consisted of an image of the iPhone “homepage” with some basic touch-behavior. Tapping the left side would make the image spin, rotating the Y-axis 180 degrees (.rotationY). Tapping the right side would spin the image the other way, while tapping on the top or bottom the image would rotate the X-axis (.rotationX). I used the Tweener-class to animate the rotation, using a “easeOutElastic” transition effect. The animations where of course quick and responsive on my computer, but how will the iPhone react to this? I worked very fine indeed. I tested on a iPhone 3GS and my old 3G. Both reacted as quick and responsive as it did on my computer. Nice! But hey, this was very basic…

I expanded my tests by using the new Accelerometer Class in AS3, making the image change its rotation-parameters according to how I held my iPhone. This also worked very well and my belief in the Flash iPhone packager continued to grow.

Time to build a real App!

Using a WebService that returns all contact info about the employees at Making Waves, I started to create an App that should present these data in an ‘iPhone-kind of way’. So I started off just like I would when creating a Flash solution, connected to the WebService, parsed the data and started to build a view. So far it worked like a charm on my iPhone. The view consisted of the employee name and department, three buttons, one to make it possible to call directly the person, one to send a sms and one to send mail. Finally it had a image of the employee. When the view is presented you should be able to switch between employees by swiping your finger to the left and right, just like you usually do it on an iPhone. To make it a little more interesting and different I made the view rotate its Y-axis when it is dragged according to how much it is dragged. The next and previous view/employee is automatically dragged according to the main view (take a look at the image on the top). The result was quite nice. Looking like a normal iPhone App but with a little twist. Using the TouchEvents that is new to AS3 was easy and combining it with the normal MouseEvents was no extra effort. Developing was quick and easy in a normal Flash development way, and I was thrilled to see the result on my iPhone. Time to put it to the test!

Since I didn’t have access to the iPhone 3GS I had to test it on my own iPhone 3G. The result was devastating. My first version was without the call/sms/mail buttons and the view of the first employee was presented pretty fast and it looked nice. But when I tried to swipe left or right the fun was definitely over. I worked but it was very slow. Performance was way under what is expected. I tried to read up on how to make performance to improve. GPU-rendering, cacheAsBitmap and so on. I added some functionality, improved the way to switch between views, tried to follow performance tips and tried again. Crossing my fingers and hoping that my last changes would do magic. Magic was unfortunately not the word. This time the app crashed each time I tried to start it. When trying to insert the image the iPhone didn’t want to handle the performance issue any more and shut down.

As a Flash developer I was really hoping that the Flash iPhone packager would be good enough to use to develop iPhone Apps in a easy and quick manner. The result after my first test was unfortunately as bad as they could be. I will not give it up just yet. There are probably a lot of things I could improve in my code to make it more iPhone friendly. At least I hope so! But one thing is for sure. Developing an iPhone App using Flash will not be the same as developing for the web. There is going to be a lot of issues to be aware of and as expected the performance issue will be the main issue.

I continue my test and will test my App on a iPhone 3GS when it gets available. I’ll try to improve it, I’ll do anything to try to prove that Flash CS5 will be a good platform to create applications for mobile devices. So far I have a long way to prove just that.

Firefox 3.5 as well as many smartphone browsers like Mobile Safari include a JavaScript API to geo-enable your web applications. Using it is pretty simple, and it gives us the ability create a completely new range of services utilizing the user’s current position. We can use it to position yourself on a graphical map or use yr.no’s weather API to get the weather right where you are.

In the following example, I will try to determine the user’s address by using Google Maps’ new Reverse Geocoding API. I haven’t included all my code in this post, but I will share upon request.

See the demo here

Since there’s still just a few browsers supporting geolocation, we need to check the current browser for the navigator.geolocation object. If it exists, we’ll call its getCurrentPosition function to get the user’s latitude and longitude:

if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(success, fail);
}

This triggers Firefox’ location notification bar (or the iPhone’s location dialog) which will ask you for permission to give your location to this web page. After you accept, devices with built-in GPS will give the browser access to these data while other devices will use local WiFi networks and IP address information to try and guess your location.

These values can now be used to retrieve your address from Google Maps:

http://maps.google.com/maps/geo?q=<lat>,<lon>&output=
   <xml_kml_csv_or_json>&sensor=<true_or_false>&key=<api_key>

We can either get our results through a direct JavaScript request using JSON or by getting an AJAX result using a server-side script. In my case I’m using the AJAX approach to let a PHP script retrieve, parse and format the data:

function success(position) {
    $("#location").load("location.ajax.php?lat=" +
        position.coords.latitude + "&lon=" +
        position.coords.longitude);
}

Addresses from Google Maps’ Reverse Geocoding API are ordered from best to least matches and categorized by accuracy. In this example, I’m just printing them all out.

See the demo here

Download geolocation demo source code

References

• Mozilla: Location-Aware Browsing
• hacks.mozilla.org: geolocation in Firefox 3.5
• Google Maps API Services: Reverse Geocoding

This is the markup for making calls directly from a link when browsing from a mobile:
<a href=””tel:+4792800913””>Call (+47) 928 00 913 from your phone</a>

To send a SMS:
<a href=””sms:+4792800913””>Send a SMS</a>

iPhone with Flash

Good news for Flash developers around the world. Finally Adobe is pushing forward to get Flash support on all mobile devices. They have now confirmed that the Adobe Flash Player 10.1 will be available for Windows Mobile and Palm webOS by the end of the year and early 2010 betas will be available for Google Android and Symbian OS. There is also a plan to bring Flash to the Blackberry, but there is still no time frame for this beta announced just yet. So what about iPhone? Well, unfortunately there is no immediate solution to run Flash on the iPhone.

The Flash player 10 for mobile will get accelerometer and multi-touch support early next year says Adobe CTO Kevin Lynch. GPS and other device capabilities should also be supported, and with this Adobe at least shows that they don’t want to miss out on the mobile device market. Adobe also announces that the Flash player has greatly improved its performance and reduced its memory usage, which really is needed to run a Flash solution on a mobile. Let’s cross our fingers and hope this is true.

Though Adobe will still not be able to deliver Flash in the iPhone Safari browser, they have announced a truly exciting feature in the upcoming Flash authoring tool Flash CS5. Create native iPhone apps using Flash! Flash Professional CS5 will enable you to build applications for iPhone and iPod using ActionScript 3. The Flash Professional CS5 beta is planned to be released later this year. Will Flash be a competitive platform for developing iPhone apps? Time will show.

There are already some example Apps made in Flash out there. We have tried some of them and none of them does any attempt to impress with high performance and interactivity. I must say I worry about the performance and memory usage, but I would happily be proven wrong and be able to produce Flash applications on all mobile devices.

As a dedicated Flash developer I do wish Adobe does this the right way and will be a major part of the future mobile development.

The desktop version is created in Flex with an AIR application as outcome, while the mobile version was based on Flash Lite 2.0 and developed using Flash. Both applications are based on the same design and both applications use Shared Objects to save the users favorite public transport lines. Part from that there are two very different solutions. Both solutions were developed within a timeframe of 70 hours!

Read more at http://mjl.makingwaves.no/

The main challenge when developing Flash content for mobile is to develop on a version that most available phones support. We decided to develop for Flash Lite 2.0 even though we lose a lot of today’s phones. But even phones with Flash Lite support have different specifications and it’s a jungle to find out which phone that supports which commands and so forth… but it is possible J

But the biggest issue with this application was loading XML. Flash Lite 2.x solutions are not very friendly to xml loading. It fills up the phones memory in no time. So the biggest lesson learned is to find workarounds if the first thinkable solution is to load xml data into the mobile phone. Part from that, developing applications for mobile phones is no walk in the park, but it’s really cool and not to hard either