*Editorial>
> Your road to innovation, one line at a time >
Mobile App Development
Time to relearn
Nash David, Assistant Editor
I
n the days that led to this first issue of devworx, I had the privilege to meet several talented individuals. It’s really encouraging to see what true passion for a subject could create – amazing products. You’ll read the story of Mariam, for example, who decided to study commerce and marketing, but found
herself more interested in playing with code – she’s been coding for the mobile game development industry for over 11 years now! Another inspirational person is Siddhartha Banerjee, a self taught iOS developer who has created some of the most popular apps around – Meter Down is an example that’s made it to the number 1 spot on the iTunes India ‘What’s Hot’ list of apps. None of these people have a degree in computer science or engineering, but they are developers nonetheless! devworxisaboutthesestories and much more, degrees or not, if you love building software, then we aim to cover it. Irrespective of their personalities, flaws or education, Bill Gates and Steve Jobs
*Contents>
created products that have inspired syllabi, employed educated folk, and simplified life in many ways. At this point, I’d definitely like to express my appreciation for the tireless contribution of several nearanonymous individuals that have made Open Source what it is today. These are true developers. They’re revolutionising our society in the true sense, where open philosophies have torn down barriers of all sorts. To prepare for the next issue of devworx, I’d like to meet you as well, and share your story with our community. If in your own way, you’re in the business of innovating through code, do write in to:
editor@devworx.in
> Your road to innovation, one line at a time >
Mobile App Development
02/Introduction
09/Get creative
Here’s a look at various operating systems out there
In addition to design, and rich user interfaces, there’s a lot to learn from best developer practices
04/Tools of the trade There are several tools that simplify the development process. We explore some of them
Editorial Assistant Editor Nash David Writers Kshitij Sobti and Siddhartha Banerjee
Design Sr. Creative Director Jayan K Narayanan Art Director Anil VK Associate Art Director PC Anoop & Atul Deshmukh Visualisers Prasanth TR & Anil T Chief Designer Baiju NV Contributing Designer Vijay Padaya
brand Product Manager Navneet Miglani Manager Online Shauvik Kumar Manager Product Marketing Chandan Sisodia Cover Design Vijay Padaya
© 9.9 Mediaworx Pvt. Ltd.
Published by 9.9 Mediaworx No part of this book may be reproduced, stored, or transmitted in any form or by any means without the prior written permission of the publisher.
March 2012
Free with Digit. If you have paid to buy this book from any source other than 9.9 Mediaworx Pvt. Ltd., please write to editor@devworx.in with details
12/Monetising your app Monetising your app is important, and you can’t afford to ignore the app markets. Here’s some basics to marketing your app
16/Interview 07/Web development and standards With hardware access now made available by web specifications, there’s much to be explored
We spoke to Mariam Dholkawala, a mobile game developer to find out what it takes to be a part of the mobile app development industry.
facebook.com/devworx.in twitter.com/devworx devworx> | March 2012 | www.devworx.in 1
> Your road to innovation, one line at a time >
Mobile Application Development
*Introduction
A
decade ago, many would’ve predicted a time when there would be a computer in almost every home. Well, although you can never truly predict how the future will unfold; instead of a computer in every home, it seems like there will definitely be a computer in every pocket. Yes, that is what a smartphone is – a computer. Its relation to mobile phones is incidental, being able to make phone calls is a mere convenience, a feature of the smartphone like any other. Like any other computer, the hallmark of a smartphone is that it can be programmed, and run applications designed for it. Unlike desktops though, where Windows has been the go-to mainstream OS for long enough, the mobile ecosystem has a variety of platforms for creating applications. Each platform in turn has its own SDK, programming language, best practices, and UI conventions. Let us take a look at some of the popular mobile platforms. Android Android at the very core uses a modified Linux kernel. This really doesn’t matter since you don’t write software for it directly; rather you write for a Dalvik Virtual Machine that can run Java applications. Android does, however, allow you to write native C / C++ code as well, and parts of any software that are resource-intensive can be written in native code and be included as a module in your application. This also makes it possible to reuse code from native desktop applications in mobile. Android is itself open source, so it is possible to modify it and create your own Android device. Android applications can be distributed outside the Android Market, even via alternate stores. To publish an application on the Android Market, you need a Google account and are required to pay a one-time $25 fee. Google provides free tools for developing Android applications. Eclipse modules are provided to make it possible to develop and test Android applications from the free Eclipse IDE. These developer tools also include a virtual machine and Android images, so applications can actually be tested on Android. Their tools work across Windows, Linux and Mac OS X. 2 devworx> | March 2012 | www.devworx.in
iOS Apple’s iOS is the operating system used on its iPhone, iPad, and iPod touch devices — but you already knew that! Unlike Android, iOS runs native code. Also, the iOS SDK is only available for Mac OS X, so to use the official SDK, you need to own an Apple computer. Additionally, to obtain the SDK, you need to enrol in the iOS Developer Program, for which you need to pay $99 annually. The SDK includes the Xcode IDE — which is actually free for all Mac OS X Lion customers — includes profiling and debugging tools, and an iOS simulator. It is not possible to sell your application, or even give it away for free, outside the Apple App Store. Inclusion of your application is subject to Apple’s approval. For testing, it is possible to distribute applications of up to 100 people outside the Apple Store. Additionally, for those who need to develop in-house apps for use within the company, Apple has the iOS Developer Enterprise Program that allows in-house distribution and updates. The program costs $299 a year and is open only for companies. Windows Phone Windows Phone is Microsoft’s new mobile OS, and is a successor to Windows Mobile, and as such is based on the same Windows CE kernel. It is, however, incompatible with Windows Mobile applications such that it might as well be a different OS. Windows Phone applications can be written in .NET, Silverlight and XNA. Silverlight applications are executed by the CLR, a virtual machine similar to Dalvik VM in Android. XNA is used for game development on Xbox and Windows Phone, and uses a different runtime. Native code is currently not supported in Windows Phone, although future versions of Windows Phone are likely to add support. Similar to iOS, the only official means for getting applications onto a Windows Phone is via the Windows Phone Marketplace. For this, you’re required to register and pay an annual fee of $99. This entitles you to submit unlimited paid apps, or up to 100 free apps. This membership
is common between to the Xbox 360 indie developer program and the Windows Phone developer program. Microsoft provides free Windows Phone developer tools based on their popular Visual Studio Express IDE, and with Expression Blend to help create UIs. The Windows Phone SDK can also integrate with Visual Studio 2010. Included is an emulator for testing Windows Phone 7 applications on the OS running on a desktop. As you would’ve guessed by now, these tools are available only for Windows — but that too, just Vista and above. BlackBerry While the BlackBerry ecosystem is no longer in its prime, it’s still an important platform — especially for enterprise users. The operating system used by BlackBerry devices is undergoing a major revamp. In fact, the BlackBerry Tablet used a completely new QNX-based OS. As such, different BlackBerry devices have different development systems. The next update to BlackBerry OS on mobiles will jump the version number from 7 to 10; and BlackBerry 10 will be QNX-based as well. Current-generation BlackBerry phones can be reached in two ways, via web HTML5 WebWorks, a web standards based app development SDK; or via the BlackBerry Java SDK. The BlackBerry Tablet and the upcoming BlackBerry 10 platform, on the other hand, can be reached via the previously-mentioned HTML5 WebWorks SDK, the Native SDK based on C/C++, or via Adobe AIR — which uses ActionScript and Flash. BlackBerry also includes the Android VM, making it possible to run Android applications on BlackBerry 10, or the BlackBerry tablet — after some modifications and repackaging though. Free IDEs / tools are available for all supported means of creating BlackBerry apps. The Native SDK and the Java SDK have an Eclipsebased IDE, there are testing and development tools — called Ripple — available for web development as well, including a simulator. For creating apps using Adobe AIR, you can use the free SDK in conjunction with any free or paid IDE that’s available, including Adobe’s commercial Flash Builder IDE. Tools for repackaging Android apps for BlackBerry are also provided. BlackBerry devices have their own App Store called BlackBerry App World. To submit apps here, you have to create a vendor account, and associate it with a PayPal account. Registration is free, and a wider variety of monetisation options are supported. bada / Tizen Samsung’s home-grown bada OS might not seem like a primary target for application development, however it is important due to Samsung’s sheer force in the mobile market. Samsung plans to merge this OS with the Tizen project, which is an open source Linux-based OS for devices, making it another Linuxbased mobile OS. bada actually isn’t even an OS at all, but a platform that can configured to run on any kernel. Applications for bada are written in native C++ code using the bada API. Flash applications and web applications are also supported. Samsung has its own Samsung Apps market for selling apps, and registration to it is free. To sell apps though, you need to sign up as a commercial seller, which requires submitting bank details.
The bada SDK is available for free if you sign up for a Samsung account. It includes an Eclipse-based IDE for development, a UI builder, and a bada simulator. The SDK is available only for Windows. Symbian Technically, Symbian is now open source; however, mostly just to look at, not to actually develop with or use in your own products. Symbian is old, very old, and on its deathbed. Even in its last throes — it’s to be abandoned by Nokia for Windows Phone — it is still a significant platform, especially in markets such as India. Symbian itself has a number of versions; the older S60 used native C++ code and is known to be difficult to develop for. However now it is possible to create Symbian applications using the popular Qt toolkit. The Qt toolkit is widely used, and is a highly cross-platform toolkit capable of targeting Windows, Linux, Mac OSX, Moblin, MeeGo, Embedded Linux, Symbian, and soon even Android. An SDK and IDE for both the old Symbian C++—based development and new Qt-based development are available — Symbian C++ via an Eclipse-based IDE, Qt via a custom new Qt Creator IDE. For selling applications, Nokia has the Nokia Store, earlier called Ovi Store. Registration costs just cost 1€ — likely this is a means to stop spamming — as a one-time fee for publishing apps. webOS HP, formerly Palm’s, webOS is a another mobile OS based on the Linux kernel. However similar to Android, you don’t write traditional Linux applications. In December 2011, HP announced that webOS will be open-sourced soon. On webOS, the runtime you develop for is a web browser itself — the popular WebKit, in fact. Native code modules can be used, and essentially work the same as browser plug-ins do. So for development, all you need are web development skills. The webOS platform has its own JavaScript framework just like jQuery UI or other web development frameworks. Creating a developer account for selling applications for webOS is free; it just needs a PayPal account. The future of webOS is uncertain, but it is a powerful platform, and worth keeping an eye out for. Conclusion In addition to these ones listed above, there are additional, and lesser used platforms such as BREW, MeeGo and Moblin. These may be worthy targets for some kinds of applications. Also, one “major” platform — in terms of sheer numbers is Java ME. The Java ME (Java Micro Edition) platform, while not popular on today’s smartphones, is present in all but the cheapest of feature phones nowadays. If an app provides a feature or service that can be useful even to the audience using such phones, it is a worthy target as well. As you can see, there’s so much variation between different mobile platform, when it comes of development languages, tools, APIs et al. that mobile development can get quite challenging. To counter this challenge, there is the emergence of cross-platform development tools and languages. These allow developers to write the application once, and package it for different platforms. devworx> | March 2012 | www.devworx.in 3
*Tools of the Trade
>>There are several tools that simplify the development process. We explore some of them. > By Kshitij Sobti
>>Gone are the days when you had to focus solely on native code and end up with dry and boring applications! With the help of some tools, you can bring your apps to life and with ease too! 4 devworx> | March 2012 | www.devworx.in
I
n the introduction, we discussed how developing individual applications for each platform is a rather complex job that requires learning multiple languages; Java for Android, Objective-C for iOS, C# for Windows Phone, C++ for bada, and even web development languages for webOS. You also need at least two operating systems, Mac OSX to reach the iOS devices, and Windows to reach all others. Over and above all of that, you need to be aware of the individual APIs on each of these platforms. For example, accessing the accelerometer on Android will involve a different series of steps than it would on iOS. If you have to develop for each platform individually, you either need a lot of resources to maintain what will be multiple different code bases, or you need to focus on key platforms and ignoring others. To
the end-user it does not matter what the most popular platform is, what matters is the platform they have chosen, and whether the app they want is available or not. There are two main ways that one can go about escaping from this mess, and each involves its own sacrifices. 1. Develop a web app instead of a native mobile application 2. Use a cross-platform toolkit that reaches the platforms you need to support. Let us take a look at both of this is some detail. The web app way Developing web applications is a sure-shot way of reaching nearly any mobile phone user. As long as the mobile user is capable of running web standard applications, you can reach them. And do you know what the best thing is? No approval process! No cut of your earnings. You build the
app the way you want, monetise it the way you like and you keep your earnings. The caveat though is a lack of integration with the native environment. You cannot access core components of the mobile such as the file-system, the camera, the contacts, the accelerometer etc. This however is a temporary restriction as standardised APIs for almost all of these features are in development. Even so, integrated app stores make it easy for end-users to discover and purchase applications, and that is something you might not get in a web application. The cross-platform way Many developers have realised the issues faced in reaching multiple platforms, and they have created cross-platform solutions in the form of SDKs and tools that allow one codebase to be shared across implementations. This means at most
you will need to learn one new language, the one used by the cross-platform SDK or tool. Here too unfortunately there are constraints that one needs to work with and be aware of. Each cross-platform toolkit can only reach a subset of all the platforms out there; while one can reach Android, iOS, and Windows Phone, another might be able to reach Android, Blackberry and iOS etc. Even among the supported platforms, not all features are likely to be supported. For example if there are features available on Android there aren’t available on iOS, then the SDK might not support that features at all! Picking a path It is important to decide which platform to pick, and this decision could be based on a number of factors. Are you really strong at web development? You might want to create a web application rather than a native app. This can change the architecture of your applications, for example if the app does heavy image processing, that bit might be better done server-side, whereas on a native app it could have been done on the mobile. You cannot make up for the lack of a camera though. Or you can pick a crossplatform toolkit that uses web technologies, and settle for the mobile platforms it supports. On the other hand, if it is really important to reach a particular platform, you might want to look at the solutions that support that platform, and then learn the language it uses to build apps. In this chapter we will take a look at some of these toolkits, the programming language(s) they are based on, the tools they provide and the choice of platforms they afford. PhoneGap PhoneGap is a free,
write a platform-specific binary plug-in and use it on your app anyway; many such plug-ins created by other developers are already available. The creators of PhoneGap also have a web service called PhoneGap:Build that allows one to upload their PhoneGap app to their server and get compiled applications for iOS, Android, BlackBerry, webOS and Symbian in one go. open-source project started by Nitobi, which was later acquired by Adobe. PhoneGap itself has been contributed to Apache as Apache Callback, however till that transition completes, it is still PhoneGap. We start with PhoneGap since it’s probably the easiest toolkit to get into and supports the most platforms. PhoneGap enables web developers to create native applications for a number of platforms. All platforms allow embedding a web browser in your application, or having a web standards-based application. PhoneGap takes advantage of this by hosting your web application in a web browser instance of a native application. It extends the APIs available to your web app and provides access to notifications, contacts, the compass, the camera etc. Web applications written for PhoneGap can take advantage of APIs otherwise only accessible to native apps. The app can be made using any web development tool, framework, SDK etc. This web application can then be packaged for the supported platforms by each platform’s SDK and sold in their respective stores. PhoneGap is free and open source. It supports, iOS, Android, Blackberry, webOS, Windows Phone 7, Symbian and bada — all the major platforms basically. If it doesn’t provide access to any native feature on a platform, you can
Rhomobile Among the platforms we have covered till now, Rhodes is perhaps the most unique. It is an open-source SDK by Rhomobile, now a part of Motorola Solutions. Its reach is nearly as
actual application code is in the much more powerful and expressive Ruby language. Nearly all native API’s are accessible, and if some aren’t it is possible to write an extension. Other unique aspects of Rhodes are the RhoConnect and RhoSync services. Rhode supports easily syncing to remote databases via the RhoSync server
It is important to decide which platform to pick, and this decision could be based on a number of factors. Are you really strong at web development? You might want to create a web application rather than a native app. expansive as PhoneGap, as it supports iOS, Android, Windows Mobile, Windows Phone 7, Symbian, and BlackBerry. In fact Rhodes can also build for Windows desktop. Rhodes is a Ruby-based framework that Ruby on Rails developers will find quite familiar. Imagine a Ruby on Rails application that runs on a local computer instead of running off a server. In Rhodes the majority of the application’s code is in Ruby while the views, or the user-interface are
in HTML. This makes the user interface as easy to develop as a web application, while the
application. This way offline devices can continue to work on data while if the app is connected, the data can be synchronised. Similarly RhoConnect allows connecting Rhode applications with enterprise solutions such as SugarCRM, Salesforce, and Microsoft Dynamics CRM. An Eclipse-based IDE for creating Rhodes applications is available is free, and the SDK itself is under the permissive MIT Licence. However it is possible to get an Enterprise Licence and commercial support. RhoHub, a service similar to PhoneGap:Build is available for Rhodes as well. With this service you can develop you application in an online IDE that runs in a browser, and build apps for Android, BlackBerry, Windows Mobile and iOS. The service is free for most uses, but again paid solutions are available with more features. devworx> | March 2012 | www.devworx.in 5
Titanium Appcelerator’s Titanium is another free and open source SDK for creating mobile applications using web development languages. While the SDK is free, there are premium features available as well, for those willing to pay, including services that can be used to enhance your applications. For example, Appcelerator Analytics. While with PhoneGap your application runs in a special browser that can access native features, Titanium applications are written in JavaScript but they directly use native API. Titanium just uses JavaScript as the programming language, and provides its own APIs to access and manipulate the native system. When you create a list or a button or other UI element using the Titanium UI API, it will create a native list or button or other UI element on whatever platform it is compiled for. This has one major advantage that your app feels and looks like a native application. Like PhoneGap you can create modules that expose platform features that Titanium doesn’t. So if Android or iOS gets an update with new features, your app can take advantage of them before Titanium developers add all updates. Titanium only supports Android and iOS in the free version, while the paid version includes support for BlackBerry as well. A desktop version of Titanium is also available that allows building Windows, Linux and MacOSX apps using web technologies. Appcelerator, the company behind Titanium acquired the creators of the popular Aptana web development IDE and now have an IDE of their own called Titanium Studio. Like Aptana, Titanium Studio is free, Eclipse-based IDE, it extends the features of Aptana and adds support for the Titanium SDK. 6 devworx> | March 2012 | www.devworx.in
AIR AIR, or Adobe Integrated Runtime allows one to create desktop or mobile applications using Flash development tools. The AIR SDK is actually free, so it is possible to use it for no cost. However Adobe’s Flash Builder IDE, and Flash Professional design tools both cost money. There are however numerous alternative IDEs and tools for
building such apps that are available for free; for example FDT has a free version, and FlashDevelop is entirely free and open source. The framework for building mobile applications and interfaces is part of the Flex SDK, which is itself free and open source; however, it is not necessary to use the Flex SDK to create AIR apps. Creating AIR applications requires one to learn ActionScript 3 and possibly MXML. ActionScript 3 is a programming language similar to JavaScript — in fact it is based on what was to be a future version of JavaScript that didn’t pan out. For those familiar with Flash development or JavaScript, this is just a stonethrow away. Just like PhoneGap extends the APIs available to web applications, allowing for access to native platform features, AIR extends the APIs available to Flash applications. Instead of running in a browser using the Flash plug-in, such applications run directly on the native system and access the native features. Like with previous systems it is possible to extend AIR to support platform-specific features, or use nativecode modules for better performance. The platforms AIR supports are iOS, Android and BlackBerry, however bada supports Flash applications as well, so some code reuse might be possible.
OS X. The SDK includes a basic mobile emulator for testing apps.
For latest news, updates and features, join us on Facebook at
Conclusion There are a number of other SDKs and solutions that work cross platform. Many of them,
facebook.com/ devworx.in
MoSync If you come from the hardcore world of C++ programming, MoSync is a pretty good SDK that will let you use your skills to program for mobiles. C++ isn’t well supported on most platforms, however MoSync lets you program in C++ and translates that to whatever works on
the native platform. With that it can even reach the Java ME platform! Other than Java ME, MoSync supports Windows Mobile, Symbian, Android, iOS, Moblin / MeeGo and Blackberry. In the future support is planned for Windows Phone as well. As usual, not all features are supported on all devices. In addition to C++, MoSync also supports web apps deployed as native applications, in which case it works similar to PhoneGap — possibly it shares some code with it as well. MoSync is open source and free, and anyone can use it to create free or commercial applications; however, since MoSync is under GPL, your application will need to be open source as well. If you wish to keep your application source closed, you need to get a paid, yearly subscription of € 199 or € 2,999 based on support level. For indie developers though, the commercial version of the SDK is free. The MoSync SDK includes an Eclipse-based IDE, which is available for Windows and Mac
however, require payment for any kind of use. Corona is a popular example. It supports targeting iOS and Android, with support for the Android Marketplace, the Amazon Kindle Fire Appstore, the Barnes & Noble Color Appstore, and of course the Apple App Store. Corona takes advantage of OpenGL and hardware acceleration, making it suitable for games. Corona applications are developed using the popular Lua scripting language; a language popular in game-development circles. Unity is another such platform designed to create games. It provides a 3D design tool for game-development and has its own scripting language. It can be used to publish to its own player, Flash Player, Android, iOS, desktop platforms Wii, PS3, and Xbox 360. A free version is available, but it doesn’t support mobile deployments. Worklight is another crossplatform commercial solution for mobile development. It too works with web applications and allows for hybrid native-web combinations. It can port to iOS, Android, BlackBerry OS, and Windows Phone. Cross-platform development is a real need, and more solutions are likely to develop over time, as the smartphone market gets even more fragmented. There is of course, always another option – web applications.
*Web Development and Standards
>>With hardware access now made available by web specifications, there’s much to be explored >By Kshitij Sobti
O
ne of the benefits of developing for the web is its broad reach, and lack of restrictions in many ways. It is a way to unshackle your application from the restrictions of each platform gatekeepers, and make an application with your own business model. Web standards are improving steadily, and it is likely that in a few years, there will be few features that you will need a native mobile application for. Since these are standards, a developer can create a website and expect it to work on any modern browser on any device. With the new powerful web standards, applications get all the benefits of web sites; they can run everywhere predictably, they can gracefully degrade if some functionality isn’t present. Web standards aren’t just HTML5, and a lot that’s advertised as HTML5, isn’t. It’s important to know though, especially since web standards and thus websites are designed to last for a long time. Here is a brief introduction to the open standards one should be aware of when it comes to web applications: HTML Even with the latest iteration, HTML5, it still remains a language to give structure to a page. HTML alone cannot be used to build fancy websites, but it is an important component. One of the
most important components of HTML is its ability to be behave exactly the same on any browser. Even so, HTML5 does add some new useful features: audio and video, offline caching, new form controls and more. With HTML you give structure to your application. CSS While HTML gives a page structure, CSS gives it style. Most of the fancy graphics and UI elements you see on a web application are actually added through CSS styles. CSS3 adds a range of new features from minor but important features such as rounded corners and drop shadows, to major new features such as 2D / 3D transforms, transitions and animations. Since of a UIs layout and styling comes from CSS, one can provide different stylesheets for different screen sizes and get vastly different UIs while keeping the rest of the web app the same. It’s important to be careful with CSS though since a lot of advertised features are only compatible with, or implemented in a subset of browsers. JavaScript If you are building a web application, you will be using JavaScript a lot. JavaScript gives your application interactivity, the ability to respond to events, and change things on page in response to such events. devworx> | March 2012 | www.devworx.in 7
directly in the web standards, but need to be implemented over them. Here are some popular frameworks that cater especially to mobile:
With the Jo framework, your app lives in a single page
Modern browsers will give you access to local storage, databases, websockets etc. Even reading and writing local files and accessing the users camera will be possible over time. These can be combined with HTML features such as canvas to have everything from image editors to 3D games. JavaScript too is being made more powerful, especially in context of mobiles. Mozilla’s WebAPI effort aims to make it possible for web applications to access the address book, the telephony features of a mobile (SMS and voice), the device camera, bluetooth, vibration, accelerometer etc.
Web frameworks Web standards are incredible powerful; and as we saw in the previous chapter, they can be used to build platformspecific apps as well. Still, often web applications are easier to manage and develop if a framework is involved, especially since the widgets you get on native platforms, such as datepickers, accordions, tree controls aren’t available
jQuery Mobile This framework, based on jQuery is not exactly intended for web applications, but can be used for simple ones. You can actually get away without writing any JavaScript at all, if you use jQuery Mobile, if your application is simple enough, and content driven. Using annotations you provide it automatically wires your user interface and interactions. IUI Like jQuery Touch above, iUI allows one to create web apps using just HTML, if your needs are simple enough. As the name suggests, it was created with Apple devices in mind, and as such its default
WebGL WebGL is OpenGL for the web, pure and simple. It is a subset of the OpelGL standard that aims to make it possible to have full-fledged hardware accelerated 3D content running in a browser. As one can expect this is very Enyo is an open source JavaScript framework that focusses on modularity useful for gaming.
To stay updated with the latest news and features, join us on Facebook by scanning the QR code with your smartphone.
Prefer 140 characters? Follow us: @devworx 8 devworx> | March 2012 | www.devworx.in
UI embraces the iOS look and feel. It can, however, run on any modern browser, and it includes themes that make it fit in well with Android and WebOS. It is also possible to write your own theme. DHTMLX Touch DHTMLX Touch is more oriented towards developing web applications for device with touchscreens. It is has a huge set of components, and is completely stylable. There is even a UI designer available that can help get an application started quickly. Jo This small lesser-known framework is nonetheless impressive, powerful and light. It has a strong JavaScript and application development focus; even the UI is built using JavaScript rather than HTML. Enyo While originally a framework for webOS, it has been open sourced and now works on all browsers. Since it was designed from scratch as a toolkit for mobile applications, it is heavily optimised for that use. Like Jo, it is JavaScript based, with little use for any HTML coding. Sencha Touch and jQTouch Sencha is designed for web applications, and has a nice set of UI components to enable the creation of rich interactive applications. It is also themable and is based on the Ext JS framework. jQTouch is similarly themable, and touch-oriented, but leans towards content rather than apps. Unfortunately, both of these are optimised for WebKit browsers, and so they don’t work elsewhere. Either way, we do not recommend them for development.
*Get Creative >>There’s more to a succesful app than just plain code. There’s a lot to learn from best developer practices. > By Kshitij Sobti
W
hile people may shy from calling smartphones proper computer, due to the constrictions. Yet, it’s only a few years ago that the kind of specifications we see in mobiles and tablets today were found in desktops. Consider that the graphics hardware of the current-generation iPhone rivals the original XBox in performance. When compared to current-generation desktops and laptops the hardware of mobiles and tablets may seem lacking. Yet in many ways smartphones have far exceeded the capabilities of even current-generation desktop and laptop computers. It took decades for computers to move from keyboard-only to keyboard-and-mouse input, however in just the past few years, smartphones have added touchscreens, GPS, accelerometers, gyroscopes, magnetometers, etc. On mobiles you no longer move windows through abstractions such a mouse click and drag, but by more realistic gestures such a swiping, flicking, pinching, shaking, tilting, and so on. To develop for mobiles, one has to understand the range of inputs available, the means of output available, the capabilities of the hardware, and the rather constrained size of the device.
There are some user interface design conventions that are used enough on desktops that they have become intuitive. For example, clickable objects have an indentation that makes them appear as buttons. When it comes to mobiles we find similar example, however they often involve more than just a single means of input. For example, rotating the screen to view an application in landscape mode. Let us take a look at some popular mobile design idioms. Use Minimal Chrome Of course here we do not mean the Chrome browser by Google, but the user interface concept of Chrome. Just in case you are not familiar with the term, let’s go through what it is. Chrome is that part of the interface that isn’t the actual content of the applidevworx> | March 2012 | www.devworx.in 9
cation. In a word processing application such as Microsoft Word, the ribbon is chrome, the menu is chrome, but the document contents are not. In a button, the 3D appearance and border are chrome, while the text of the button is the content. It might look nice have a realistic 3D knob to change volume, but no one is buying the illusion! No one really thinks it’s an actual knob. It might be intuitive to use, but it also consumes more onscreen space. Avoid unnecessary chrome so there is more space for the content; this is especially important on small screen mobile devices.
Google Chrome for mobile allows switching tabs by swiping a finger across the screen, like removing the topmost card in a pile, revealing the next. 10 devworx> | March 2012 | www.devworx.in
Steve Jobs introduced us to the world of multi-touch as we know it today
If you thing chrome is unavoidable, for example, how would you switch between webpages without some kind of tabs in a browser? How do you refresh a browser page without a refresh button. This is where all of the other “senses” of a mobile come in. Google Chrome for mobile allows switching tabs by swiping a finger across the screen, like removing the topmost card in a pile, revealing the next. Refreshing can be accomplished by shaking the mobile, or performing some other gesture. Think about games, often they have no chrome at all, yet still manage to convey how they can be used / played.
Are there some gestures or actions that a just natural for your app? Use them. Design for the platform This might seem obvious at first, however more often than not, applications use one design across platforms. Android users are used to a different way of interacting with their mobiles than do iOS users, or BlackBerry users and will likely be wildly different from the expectations of Windows Phone users. Also tablets are not large phones, they are often not used for the same purpose nor do people interact with them in the same way. Likewise the user
experience for tablets shouldn’t just be a scaled version of the mobile. Swiping across a phone’s narrow width to turn the page might be acceptable; expecting people to do the same on a wide-screen tablet is not. Since the application has the same functionality regardless of platform of form factor, that much can be shared. However the application should be developed such that having differing UIs for each platform is easy. Does your website / application show a hundred ways to filter content in the desktop version? Yeah, it’s likely mobile users don’t want that. Stick to the important controls and settings. Most platforms have design guidelines, and these should be followed as far as possible. Of course innovative UIs can / need to break such guidelines; and innovation is a good reason to not follow them — laziness is not. Make good use of gestures Multi-touch gestures add a whole new dimension of interactivity to applications, and one should be aware of the common gestures that users are already aware of and will most likely try out. Here are some common gestures and their common interpretations: Tap: Similar to a single click on desktop. Double Tap: Commonly used to zoom in or out. Long Press: This is closest to a right-click operation on the desktop, and is used for showing context-sensitive options or settings. Pinch / Spread: These gestures can be used to scale the content on screen. For example zooming into a page on a browser or on an image in a gallery app. Flick: This is commonly used to quickly scroll through long lists.
For latest news, updates and features, join us on Facebook at
facebook.com/ devworx.in
Rotate: This gesture can be used to rotate the contents of the page, for example an image. Make good use of sensors The touchscreen, keypad and physical buttons aren’t the only modes of input in mobile phones. There are also a number of sensors that you need to be aware of and use wherever they make sense. The app should not be useless without them, because that would be neglecting the audience with mobiles without those features. Accelerometer: This sensor measures the acceleration, it is used for sensing the orientation, or if the device is being shaken or moved in any direction. A shaking gesture for example is used by apps to shuffle puzzle pieces, or refresh data. Gyroscope: A gyroscope measures the rotation speed of the device along its axis of rotation. With it one can use a mobile as a racing wheel in a game. Magnetometer: These detect magnetism and are used as digital compasses.
GPS: The GPS can provide information about a person’s geographical location. Proximity sensor: This sensor can detect if something is too close to the screen. It is used to turn off the touchscreen when you’re holding the phone up to your ear. Microphone: The good old microphone can be a useful tool. SoundHound is a good
Most platforms have design guidelines, and these should be followed as far as possible.
example of an app that uses the microphone; it can identify the songs you sing, hum, or play to it. Camera: Camera input isn’t just for photos, but its becoming easier to detect basic objects and use it as a control / interaction tool.
To stay updated with the latest news and features, join us on Facebook by scanning the QR code with your smartphone.
Prefer 140 characters? Follow us: @devworx devworx> | March 2012 | www.devworx.in 11
>>Monetising your app is important, and you can’t afford to ignore the app markets. >By Siddhartha Banerjee
*Monetising your app $ >>In order to create a successful app, you need to enhance your app’s visibility on the app store and convince users to purchase it too! 12 devworx> | March 2012 | www.devworx.in
o, you think you got a killer idea for a mobile app? Make sure it’s really a killer idea or else no amount of marketing or ubercool coding will save it from the DOA status. Before we start, here’s a bit on the three components that contribute towards your apps’ success. The first is, understandably, great coding! But that’s not sufficient enough. First, you need a market, and second, is deliberate marketing. Failure to address all three
of these areas well, means improbable chances of your app succeeding in the market. However, there are exceptions to the rule – some apps don’t seemingly address all these three areas and yet achieve accolades. But such examples can be found in any industry, from literature to motion pictures. So, let’s do the right thing in the right way. After all, today the app business is the apple of everyone’s eye. The numbers say it all. For instance, according to an IDC prediction in December
2010, global downloads will reach $76.9 billion in 2014 and will be worth $35 billion. Another agency Canalys has predicted that direct revenue from the sale of apps, in-app purchases and subscriptions across smartphones and tablets will be rising to $36.7 billion by 2015. IMRB has forecasted that Indian app industry will top to $4 billion by 2015. Understanding the App Marketing Cycle. If buyers are looking for a travel
app for Mumbai, they are going to first search on any app store (iTunes App Store or Android Marketplace) with keywords like ‘Mumbai’, ‘travel’ a search similar to any search engine. This will propagate a list of apps related to Mumbai and Travel. If the buyer has no specific app in mind, the decision will be much more spontaneous and will be based on couple of factors such as cus-
tomer reviews, ratings and user interface. Increasing your challenge to stand out from all other listed apps. Your goal then, is to connect with the buyer at this level so he/she will trust your product and will read more (the meta data) about it. Although the entire process seems quite lengthy, in reality it takes place in split seconds. Once the trust factor has been built you can now lead your prospect in purchasing the app. The following diagram explains the buying process.
“once you’ve passed the honeymoon phase, your app sales will hit a plateau unless you’ve targeted your app towards a specific user group.”
Your app’s unique value So by now you have must realised that to stand out in the crowded market place you need to have some unique value attached to your app that will lead to sales. And to define uniqueness, you need to answer four questions: 1. Who are your competitors? 2. What are the key features of their apps? 3. What are the benefits of your app in comparison? 4. What’s unique about your app? If you could answer these questions, you will be able to define the unique value of your app. And this will form the foundation of all your marketing communications. In other words, in order to successfully market
that time. You would have a general idea of who will buy your app during the concept stage. However, once you have the app’s SMP ready you need to refine the TA. For instance, you may have defined that travellers will be the TA for your flight tracker app. Now it’s time to break them into further segments based on their lifestyle, location, and cultural practice. This refinement will help to reach your TA through SEO and targeted campaigns.
your app, you need to focus on a single-minded proposition (SMP) for your app.
your buyers get a list of apps that they have searched on the app store, the first element that attracts them is the icon. If your app icon looks attractive enough, they will then read the name and then decide to click on it or not. Once directed to your product page on the app store, they will again be drawn to the graphics, this time it’s the screenshots. The buyers will browse through the graphics to get a quick idea of what your app does. And finally, if they like what they see, they read the description. If your app is free or lite version, a buying decision is made at this point. If it’s a paid one, there are two more steps. First, they will read the review and analyse the ratings.
Refining your target audience (TA) Now that you have defined your app’s unique value, it’s time to focus on the target market. If you’re thinking it doesn’t matter as long as your app is on the app store, then you’re gambling, quite literally. If your app is worthy enough it will see a spike in sales during the initial launch. However, once you’ve passed the honeymoon phase, your app sales will hit a plateau unless you’ve targeted your app towards a specific user group. So defining and then refining your TA comes handy during
Four fundamentals before coding Before we talk about the fundamentals, let’s first understand the app buying decision. Once
devworx> | March 2012 | www.devworx.in 13
Second fundamental: app name Choosing an effective app name can help increase your sales because the buyer doesn’t have to invest time in understanding what your app does. This is extremely useful if your app is not a game. Tweetbot, PicDish, and Evernote are some great examples.
Your buyers’ attention span is short, as thousand messages have been bombarded to them everyday through print, electronic and digital media
14 devworx> | March 2012 | www.devworx.in
Lastly, to be 100% sure that they are paying for a product that is credible enough, they will click on the link of your product page. So the first fundamental is ‘Graphics’. The phrase “A picture is worth a thousand words” is perfectly suited for the app business. Spend real good time to ensure that your graphics showcase your app in the best possible way. Create variations by placing them horizontally and vertically. Lastly, give the same importance to graphics as coding. The Jaime Oliver app, that won the Apple Design award in 2009, is a perfect example.
buyer has landed on your app’s store page, this means he or she is genuinely interested in purchase. The buyer is looking for a final validation through words and is not interested in any frills. So KISS (Keep it short and simple) should be your mantra.
Third fundamental: app store text There is no full-proof solu-
Fourth fundamental: app website Imagine you are into the FMCG (Fast Moving Consumer Goods) business and you have
tion to create perfect content. However, as rule of thumb “less is more” works best. In the mobile economy, people are reading less when it comes to their communications. Your buyers’ attention span is
a fantastic product. Your customers love your product so much that they want to share your values and ethos with family and friends. And as we are living in EWoM (Electronic Word of Mouth) age, it makes
short, as thousand messages have been bombarded to them everyday through print, electronic and digital media. In this chaos, your app store text has to be precise, ending with a call to action. Remember, if a
sense for them to send a link of your website. Now imagine your website, which in spite of a fab product, is sloppy, full of broken links and cluttered. Do you think your customer will love that? Never. They want
something they can trust. Only a clean and simple looking site that answers all their concerns will be the winner. You don’t need to spend a fortune on building your site. It just needs engaging, clear product description and rationale for buying copy and visual in a pleasing and convincing way. After all, your super app needs a tidy and warm home where your buyers feel comfortable and confident. Essential marketing activities Like any other product marketing, your app needs a ‘Pre-Launch’, Launch and ‘Post-Launch’ marketing activity. Now why do we need these activities? Well, like any other business you must have ‘Anticipated Revenues’. Then, to reach that target you need to engage in certain activities (paid or free) and strike a balance in marketing activities, that will help you foresee the different phases of your apps’ progression. You will do some marketing activities prior to its launch. Then you’ll do some more activities during the launch and finally you will follow it up with ongoing activities to help you maintain app sales. And your plan could be some or all of these mentioned activities. So don’t worry about the length. Rather concentrate on how you are going to achieve success. Achieving the right marketing balance of cost and activities requires a bit of trial and error. However, don’t get scared as many of the activities do not cost money but cost your time. The activities that cost money should be tried with a test run. For example, place a Facebook ad for 10 days targeted towards travelers, male, age 30 or more travelling to India from the UK, for your Indian Train Schedule app.
Then measure the results to see if this marketing effort is beneficial for your app sales. If it does benefit then increase the time frame and location to reach a wider audience. Marketing requires a constant effort. You must be consistent to make people aware of your app and it’s the little nudges that could covert an intention into a purchase. However, only you can determine the best marketing mix for your app, as there’s no set pattern and some activities work better for one type of app than another. These are five important activities explained in details Press Release: Use PR to announce the launch of your app and to broadcast any other relevant information to your audience. An effective release should not exceed more than an A4 page and you should directly contact editors, news analysts, and reviewers to talk about your app. You could also hire a PR agency, which can distribute your press release to all media agencies, including Internet, blogs, newspapers and industry trade publications as a part of paid activity. Website with SEO: Create a product website to showcase your app. Always include screenshots and a demo video if possible. Always have a ‘Buy Now’ (if paid app) or ‘Download Free’ (if free app) button. Use the Google AdWords keyword tool, research search terms that are most relevant to your app TA and populate those terms. More than ‘quantity’ of keywords ‘relevancy’ is the key thing here. Social Media: Social Media plays a pivotal role in your marketing process. Let your fans curate your apps through different channels like Facebook, Twitter, YouTube et al. A number of popular game apps are using Facebook fan
page and are generating huge fan base. The same theory goes for micro-blogging site Twitter or use of video sharing site YouTube. These are easy to set up and don’t cost a dime. A huge amount of development resources are available on the net on how to create these pages. They best part of these Social Media Channels is that they broadcast news about your app amongst your TA’s social circle, when your TA ‘like’ or ‘follow’ your channel. Trial Version: Offer a free version with an option to have more functionality in the paid version. A free app is going to drive downloads and awareness for your app, especially in the Asian subcontinent. One thing you must remember while developing a free app is that it should not give away too much or offer too little. Another way of approaching the free vs. paid decision is to have in-app purchases (if you are developing for the iOS platform, for example). Promotions: Promotional marketing attempts to get people to make a buying decision. You can create various incentives to move someone to make an app purchase; including contests, sales and free downloads. However, remember to set a timeline to end your promotion. It helps your buyers make a purchase decision more quickly if they know the time is limited. Final Word We have come to the final stage and I would like to end it with a quote from an advertising legend, Bill Bernbech, “You can say the right thing about a product and nobody will listen. You’ve got to say it in such a way that people will feel it in their gut. Because if they don’t feel it, nothing will happen.” So in a nutshell, it will be a hara-kiri if you ignore the third pillar of an app’s success i.e. Marketing it.
*Author *Siddhartha Banerjee
>>Siddhartha Banerjee is the Founder & CEO of Code Conclave Technologies – a Mobile Strategy and App Development Company, with its head office in Mumbai and tech operations based out of Bangalore. He has worked in five countries in the creative and strategy departments with ad agencies like Grey Worldwide, Publicis Graphics and Y&R for over a decade. After relocating to India in 2010, he changed his career from advertising and became a self-taught iOS app developer. He writes on mobile technology, Apple Inc, and advertising on blogs and tech sites.
http://siddharthabanerjee.com
For latest news, updates and features, join us on Facebook at
facebook.com/ devworx.in
devworx> | March 2012 | www.devworx.in 15
>>it’s difficult to get programming out of a programmer”>>
*connect
We spoke to Mariam Dholkawala, a mobile game developer to find out first hand what it takes to be a part of the mobile game development industry. Could you tell us a bit about yourself?
sultant with Kreeda Games and Producer at Octane Mobile.
I started out at college studying commerce. Somewhere during college, I took an interest in computers. During that time I had no clue about gaming or programming, but computers fascinated me. I completed college with a specialisation in management and then joined a friend’s company called Viva Multimedia while awaiting my results. Viva was into developing interactive educational CDs, and that was my starting point for writing code. At Viva I realised I enjoyed playing games and ended up making some! I started programming with Adobe Director and my source of learning was gaming books and code by other developers.
What is your preferred area of specialisation?
How many years have you been working as a developer?
I’ve been developing for 11 years now. After Viva, I joined Indiagames and worked with them for 6 years. I started as a Flash programmer with the latter, years as Project Manager and Studio Head. These roles gave me a great understanding of project and team management. At Indiagames, I mostly focussed on working with Adobe Flash Lite for Symbian and BREW. After leaving Indiagames, I worked on several gaming projects with different companies including working as a Con16 devworx> | March 2012 | www.devworx.in
They say “it’s difficult to get programming out of a programmer”, and it’s really true. I love writing code and I’ve been working with Macromedia/ Adobe Flash for over 10 years now. I’ve developed Flash content for every platform it supports including mobiles and set-top boxes. I started with Adobe Flash Lite for mobiles and now write Adobe AIR mobile apps. Some of my apps are live on the Nokia Store, Apple iTunes and the Blackberry App World. My strengths also include a good understanding of games and the different mobile platforms. It’s important to study the strengths of each app marketplace and their potential success regions before planning content and I really enjoy doing that. What are the challenges you have faced as a developer?
One of the biggest challenges any mobile game developer can face today is the choice of platforms. There are so many platforms that I often see developers opting for one based on its hype. The iOS and Android being the most popular today. I think it was far easier when I began. The challenge was the constant push for writing new code because that’s how it is with
gaming. Unless you’re constantly working on a particular genre of game, the code is hardly repeated. I’ve always worked with new game concepts, some requiring additional libraries or engines, so the challenge has been researching and successfully implementing them in the game. How has the app development industry changed over the years?
The market has changed tremendously, and this change is happening much faster today. The way we looked at mobiles changed when Apple introduced the iPhone. Google was already changing the web, and with the Android platform they’re competing with iOS. The latest in the game is Windows Phone. App markets too have changed the ecosystem. Selling mobile games was once a monopoly enjoyed by large gaming companies due to their ability to produce more games. This changed when Apple iTunes opened for indie game developers to sell their content. Now almost all platforms have their own app stores. Similarly, when app stores were introduced, premium games made many successful developer stories. Not the case anymore. Developers are now competing for visibility and users thus bringing freemium to the forefront. Mobile advertising has also seen an uprise as a revenue stream for developers in recent years.
Mariam
Job Independent gaming consultant Education Bachelor of Commerce with Marketing Management Career Game and app development for web, mobile and settop boxes Online mariamdholkawala. com twitter.com/mariamdh