Intel XDK

I recently tried out the Intel XDK application. Many thanks to Joseph Labrecque for making me aware of this tool. This is a free tool which allows you to leverage your knowledge of HTML, CSS, and JavaScript to build mobile apps. It works with both Windows (I tested on Windows 7), Mac (I tested on Mavericks), and Linux (I did not test). The tool contains a number of working examples as well as an intuitive interface. I like the fact that you can test your app on numerous devices (including iOS devices) without having to pay for a certificate. The tool itself is based on a number of open source tools. These include:

  • Brackets code editor
  • Apache Ripple emulator
  • Node.js web server
  • Apache Cordova support
  • Weinre for remote debugging

Given how easy it is to use this tool, I wanted to make readers aware of many of the capabilities.Obviously, you need to download and install the software on your computer. Once done, you can launch and are immediately presented with a number of helpful hints. You can view these each time you launch the application (or only once).

Help bubbles in interface

There are a number of sample applications (ranging from games to geolocation). There is an AppStarter for those who do not know a lot about HTML5. There is also an app designer to allow for quick development of the actual interface. Initially, I recommend choosing a sample demo. Click on it, follow the instructions, and then test your result on an Android or iOS device. [Click on the image below to see a larger version.]

Demo projects

In order to test the app on your device, you need to install the Intel App Preview app. It is available in major stores (such as Google PlayStore, Apple AppStore, Windows Store). You need to push your app to the Intel server and then download it to the individual device.You are prompted to synch your app with the server. This is why you need an account with the Intel XDK and need to login to the app on each device.

Synch to server

For example, here is a screen capture of my apps which I can test on my iPhone.

Available apps for testing

A similar screen is available when the Intel App Preview is running on your Android device or Windows 8 device.

After trying out some of the demo apps to better understand the capabilities, I opened a new project and used the app designer. I first tried the app starter. I was able to easily add an image and some initial text. I know I could have done a lot more, but I am just doing a quick review of the capabilities. There are a number of video tutorials and documentation on the Intel site. Here is a quick view of the interface. Note that it is very visual.

App interface

 

When you build an app from scratch, you can select a framework.  Note that these are the current choices. I choose Bootstrap for one of my examples.

Available frameworks

You can also switch to code view (which relies on Brackets). If you do make changes in the code view, you will be prompted on which version to load when you return to the design view.

Brackets

You can emulate the app on your computer. There are a number of device options (reminds me of the old Adobe Device Central application).

Emulate on device

You can then preview the app you have created and test it on an actual device (in this case, I am using it on my iPhone). I know it is extremely simple. I am just demonstrating the capabilities.

App running on iPhone

 

Once you have completed your app, you can build it. This will require the proper developer credentials as well as a certificate in some cases (so you can actually deploy your app to the appropriate store). I did not test this option. However, these are the stores you can publish to. I recommend clicking on the image to enlarge it.

App versions you can build

I find this app very intuitive and easy to use for initial development purposes. Since it relies on Brackets as the code editor, I am already familiar with that interface when editing JavaScript and HTML files. I am curious as to your thoughts on this tool. Are you interested in trying it out? Have you built any apps with it? I look forward to your comments.

6 thoughts on “Intel XDK”

  1. Just asking, where do I find my files in XDK and my images does not appear in app preview.probably the path of my images.

    thanx

  2. The files should be located in the project path. When you initially specify the project, you decide on the location of the files. Once you open an existing project, you should see the path visible. Hope this helps a bit.

    Best always,
    Mark

  3. On my main testing Android 4.4 netbook the login option never comes up in Intel App Preview. The only working buttons are overview and demo apps. Demo apps says offline in red letters at the top right, even though all of my other android apps are online. I figure it must be because I’m connected through the ethernet port instead of cellular? I can’t find connection settings in/for the Intel XDX App Preview anywhere. Are these settings hidden somewhere?

  4. Puzzling. I haven’t connected in this manner. I recommend checking the Intel documentation.

    Best always,
    Mark

  5. Hi Mark
    Whats best between intel xdk and phonegap? I am new to intel xdk and struggling to find ways o making a logo/icon for my app. Tutorials are not showing this feature. As we all know that every app needs an icon/logo for users to click and download or install. Please email me, many thanks

  6. When you go through the build process (perhaps to create an APK file for Android devices), you should see an assets screen which allows you to include a custom icon. Hope this helps.

    Best always,
    Mark

Leave a Reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Social media & sharing icons powered by UltimatelySocial