Intel XDK: An App Development App For Beginners

What is Intel XDK?

HTML5, the mobile industry having it from few years. In mobile industry there a vast growth from past few years. The evolution is really unbelievable from pressing of a button to gestures, multi-touch, GPS, compass almost everything what we want we are getting them in our mobile. Going to the platforms there is a great evolution in android, iOS. Each and every mobile manufacturer tried to give its own platform like Nokia’s Symbian, Samsung’s Bada but very few are survived in this vast mobile world. Everyone wants to be a developer, they want to design their own app, game so what is future platform or using which programming language we should program our app. There is great improvement in mobile applications as parallel to operating systems of mobile. Even if one application is success in one platform same application is needed by another platform so platform owners are hiring them more and more giving them rewards, app monetisation.

Intel XDK

However this lands a problem to the developers who are as much confused about putting in their time and effort as they are worried about the monetisation possibilities on these platforms. Some of the monetization channels are available in the form of subscription. The hurdle of learning each and everything attached to new API and a new platform is a bigger issue than it is normally perceived. It is not meant that is complex and difficult but it takes time. Whenever the new API, updated version got released then it becomes complex.

Many of us have a standard platforms like iOS, Android but similarly we had so many problems like android is running on innumerable devices with various specifications, display sizes so it makes difficult to develop it.

Possible solution for these problems is HTML5. It is the technology that is supported by all devices. It is easily accessible irrespective to hardware. HTML always directly interacts with hardware and runs in an interface with a part of browser. This provides an experience to the user which works almost at par with most native applications in the combination with other client side technologies such as JavaScript and CSS3. This creates an interface which is flexible and responsive. Most of the social media shifted to HTML5. Sencha have already given their word how responsive HTML5 is. HTML5 uses cache and it helps to reduce server load and makes application to available offline.

IntelSDK

Advantages with HTML5 is once application is developed it can be packed and can be run in a browser. It brings embedding audio and video media. It has inbuilt  geolocation support. Keeping this in mind Intel have released Intel XDK, HTML5 App Porter Tool and many others.

Introduction of Intel-XDK

Intel-XDK can be simply defined as a sort of cloud based IDE which supplements the HTML5 mobile app development. One of the main features of is the emulation of a lot of devices for HTML5 based apps and even hybrid native apps. Some of these devices include iPhone, iPad, Samsung Galaxy S, Galaxy Tab, Microsoft surface and ultrabooks. It supports the features that never heard before like accelerometer emulation across all three axes, multitouch, geolocation and allows developer to choose the current data connection type for emulated device. Multitouch emulation has a nice touch to it too, one can just hold the right mouse button anywhere on the emulator screen and then left click to provide multiple touch inputs. This is one of the functionality which is supported by HTM5 apps. It offers a good compromise of providing access to functionality like the accelerator and other sensors which are unavailable to HTML5 tools.

IntelXDK-4

In editor mode one can very well choose to develop the app in their own IDE and upload their code in order to test in emulator. The editor mode also supports development of server side components and has ready made templates available for ASP and PHP.

Installing XDK

XDK can be installed on all three platforms which includes Mac OS X, Windows and Linux but you must have installed java and google chrome installed in it. There is also Google chrome plugin available in the web store that provides a button to load XDK in its java applet.

Installation is very easy as we do for a software’s. After installation it provides you a login screen if u don’t have an account just provide your valid Email after that you will be redirected to sign up screen asking for further details. Once done you can login and you will be providing Intel’s Hello World app. You can also browse and load other samples and demo’s bundled with the IDE.

Your first app

To begin creating your first app, click on the start new button on the top left corner and you will be presented with a setup of HTML5 application asking for the details of the project. Once done as you will be guided by the screen. It also asks you that you want to build up from pre-existing demo. Use app starter wizard or use the Game Dev Mode which integrates the features for ImpactJS and Ejecta based simulation for simple and 2D physics games. You can also upload ready made zip file of HTML and JavaScript for app.

For the purposes of our demo, creating an app from the app starter wizard would be the best way to describe all the features provided by the XDK. Wizard is basically a three step process which helps to make a template for our application. It uses app framework, a JavaScript library to supplement the mobile application development.  Intel app framework is a query selector JavaScript library which supports the Intel XDK and its HTML5 tools. It also includes the User Interface framework that works on all platforms and is known to be best supported by all webkit browsers.

Wizard lets you to select theme for your app you will have a choices to choose between Frosty, Carbon, Slate, Volcano and Eco. Each have their own CSS (Cascading Style Sheet) to your HTML5 app. Then setting of your navigation icons. You can choose Navigation Icon and Transition for each field. You can also preview your navigation bar there if you want by clicking Preview Navigation arrow. It gives you a preview of your app on mobile. Lastly setting up your pages for each navigation icon and specify each CSS for your each page. Once done then click on the generate button and template application is generated for you. The source files for this template is viewed and edited in editor mode. You have choice to edit these files in your text editor. It is very easy to complete remaining process if you know HTML5 and JavaScript.

Testing can be done on real device using applab mobile application. You can test it in local wifi network. The debug console can be used to perform one of those benefits of using HTML5 where no action is required on part of the user, not even an application download. You can setup such updates in four types, one is to just update the app immediately, load it at the next restart, request permission from the user to load app or just to post a notification to the user when update is available. Multiplayer functionality for gaming is available in the form of leader boards and achievements are also available. PushMobi functionality allows user to subscribe to the developer messages. The Intel AppAds functionality allows you to monetize their application. XDK also supports integration of Phonegap applications, which can be coded and built inside XDK IDE. This integration solves the problem of Phonegap developers, thus ridding them of the headache of setting up a local development environment.

To perform test build of the application, you need to go to app development centre to submit details about application and its platform. You can choose

  • iOS
  • Android
  • Amazon
  • Nook
  • Windows 8
  • Windows phone 8

You can also choose to be a desktop app. Even Facebook and chrome are available as a valid choice for target platforms. If you choose these platforms it asks about the credentials. It lies at the top right. Dev center allows you to build test builds as well as actual builds. This helps you to publish your application directly to the respective application store but to perform this you have to fill some details like Project ID, API key in android similarly in other platforms version number, title, icon etc… once you done you are done you can see green build app now button. Once build is completed you can see a Build successful screen and then email including the link to download of final built application.

Dev center has an advantage that you need not develop the app inside XDK, you can code yourself, zip it and then build your application. You can also email the application bundle and also has a debugging script available to check the application.

Game development

XDK also supports so many game engines in HTML5 standards. The most famous is ImapactJS which is integrated to XDK interface with the Weltmeister editor to create levels tile by tile inside the Game Dev mode. There are other tools like Scirra which provides drag and drop game creation who doesn’t have much programming experience. Other engines are like LimeJS, Box2DJS, and the Render engine. 

I am a blogger by day, programmer by night, Hacker by weekend. Persuing B.Tech now. I am an Indian from Kanuru. The first blogger from Kanuru
We will be happy to hear your thoughts

      Leave a Reply

      Thetechhacker
      Register New Account
      Reset Password