Mobile is going to be the next big thing. With an estimated worth of over $25 billion by 2015, Flurry expects mobile consumption to exceed TV and web very soon. Unfortunately the mobile market is severely fragmented both in terms of the hardware as well as the software. There are no uniform standards of development (HTML-5 is a good attempt but it is still far from perfect) and the difference in screen size, resolution and hardware capabilities are mind boggling. A year back when we were thinking of developing something for the mobile platform we had a lot of decisions to make - including the concept, idea and how to go about it and which platforms to target. Given that we had almost zero budget and very limited time to spare we spend a good amount of time researching which technology to use to develop our app.

mobile consumption flurry

Why Corona SDK? We had lots of option to chose from. We wanted to target at the very least Apple and Android. These two combined capture a majority of mobile market. Developing natively was out of question as it would have been prohibitively time consuming (moreover no one in the development team has a Mac and for a good long time I did not even have an android phone!). So we had to chose a cross-platform development framework or SDK to satisfy our needs. We considered HTML-5 and wrapping it with Phonegap as our first choice. But after little bit of tweaking we felt it is still not polished enough to be used  for commercial apps. Next we considered Cocos2d-x, Moai SDK,  Gideros mobile, Gamemaker, GameSalad and Corona SDK. Most of them are very good platforms with their own strengths and weaknesses. We needed rapid development capabilities without compromising on speed. In our opinion Cocos2d-x is the most powerful platform amongst these, but has a steep learning curve and is not as polished as Cocos2d (which targets only iOS). GameSalad is strongly lacking in control but makes development very easy. Gamemaker frankly is not yet ready to be used for commercial development. Moai SDK is solid and gives a lot of control, though the documentation is lacking and the community behind it is not that good. Corona hits the sweet spot between rapid development and control over your app. It is based on Lua (a scripting language) which is extremely easy and it took us literally minutes to get started. More importantly there is a vibrant community behind the SDK who share code and ideas freely which makes it very easy to troubleshoot in case you are stuck. The pricing was also just right for us (they give student discounts). For mobile development it is absolutely essential that the framework evolve fast enough to cope up with the changing mobile technologies. Corona SDK as a commercial product is pretty good at it. It has it's own limitations but for most apps it suffices. In the next section I will discuss some of the tips and tricks we learned developing our app for multiple platforms from a single codebase using Corona SDK Handling screen size fragmentation  The fragmentation in screen size and resolution in android devices is nothing new. With the introduction of the new iPads and iPhone 5 even the screen sizes now vary a lot within the Apple devices as well.  The trick to handle different device screen size and resolution is to simply ignore it! Corona makes it really simple to handle scaling (in android when developing natively you have to rely on device independent pixels or DIPs), so the only thing that really matters is the aspect ratio. Select a base resolution (this could be the device that you think will be majority), for us we selected the iphone 4S as our base device (960 X 640, aspect ratio 1.5). Now note down the range of aspect ratios you want to target.  Based on research we realized that almost all devices (>99%) have aspect ratios between 1.33 to 1.78. So all you need to do is some basic calculations to generate a template size with a safe region and bleed region. Anything within the safe region is guaranteed to be safe across devices and the background needs to be designed in such a way that it extends upto the bleed areas. Here are the formulas to generate the template size from the base size - templateHeight = baseWidth x maxAspect  = 640*1.78 ~ 1140 pixels templateWidth = baseHeight/minAspect = 960/1.33 ~ 722 pixels

template

Here is the config file


application =
{
    content =
    {
      width = 640,
      height = 960,
      scale = "letterbox",
      fps = 60,
      xalign = "center",
      yalign = "center",
    },

    license =
    {
      google =
      {
      key = "#####",
      },
    },
}
All elements need to be placed inside the safe areas. You can use display.screenOriginX and display.screenOriginY to move elements across the bleed area (if available). The background is same size as the template size. See an example below. quiz   Cross Platform from Single Codebase without using Globals One easy way of handling multiple platforms is to detect the current platform and execute code accordingly. It can be very tempting to use globals. NEVER USE GLOBALS. It goes against the concept of data abstraction, the very essence of Software engineering. It is easy to avoid Globals. Use a settings.lua file and define everything you need across your codebase here: settings.lua

local S = {}

-----------------------------SET BEFORE BUILD------------------------
-- define build platform
-- Google Play 1
-- Amazon 2
-- IOS 3

S.buildFor = 1;

-----------------------------SET BEFORE BUILD------------------------

--Content size
S.H =  display.contentHeight;
S.W = display.contentWidth;
--Content scale
S.S = display.contentScaleX;

--Offsets
S.Ox = display.screenOriginX;
S.Oy = display.screenOriginY;

S.platform = system.getInfo( "platformName" ) ;

--Platform specific font loading
if "Win" == system.getInfo( "platformName" ) then
    S.TrbFont = "Trebuchet MS";
    S.cpl = "Champagne & Limousines";
    S.dsd = "DS-Digital";
    S.stnr = "Steiner";
else
    -- Mac, iOS and android
    S.TrbFont = "TrebuchetMS";
    S.cpl = "Champagne&Limousines";
    S.dsd = "DS-Digital-Italic";
    S.stnr = "Steiner";
end

--Switch on analytics
S.ifAnalytics = true;

return S;
Now import the settings file in other codes...

--Hide status bar
display.setStatusBar(display.HiddenStatusBar);

--Required packages 
local settings   = require("settings");
local licensing  = require("licensing");
local analytics  = require("analytics");

--Start licensing services and analytics
if "Android" == settings.platform then
    --init the android licensing system
    if(settings.buildFor == 1) then
	    licensing.init("google");
	end
    --init analytics
    analytics.init( "####" ); 
 elseif "iPhone OS" ==  settings.platform then
 	analytics.init( "####" ); 
end
In fact you can change the variables in the settings.lua and it is the best way to share data across storyboards. If your app implements in-app purchases it is also advisable to store this information in the settings.lua. We hope that the tips and pointers are helpful to you. Thanks to Corona SDK we were able to launch our app in a very short time (we were working part-time on the project) simultanously on Apple store, Google Play and Amazon. We were surprised when we saw a large number of people using DSLRs but never going out of auto mode! Elements of Photography was developed with the hope that more people use their DSLRs to its full extent. You may check out the app at the link below. signature Print This Post Print This Post
Tagged with:  

Looking for something?

Use the form below to search the site:

Still not finding what you're looking for? Drop a comment on a post or contact us so we can take care of it!

Visit our friends!

A few highly recommended friends...

Archives