App of the week: PhoneGap

phonegap

PhoneGap represents a tremendous opportunity for web designers and developers. With it, you can apply your existing skill set for creating web pages and applications with HTML5, CSS, and JavaScript to create mobile apps that can be sold in the popular app marketplaces. PhoneGap makes app development for mobile devices more accessible to a broader pool of developers — including web designers who don’t handle all that much code.

Before I go any further, let me briefly explain how PhoneGap works. PhoneGap wraps your HTML, CSS, and JavaScript code so that it can be installed as an app across a wide variety of supported platforms. It also provides a means (via an API) of accessing device features such as the camera, accelerometer, and more. In this way, PhoneGap gives developers the ability to create a full-featured mobile app using web technologies.

Even with PhoneGap, it can still be a big leap to go from building web pages to building apps, so it is a good idea to plan ahead for this transition. Some of the questions a designer or developer should ask when moving from browser to mobile app development are:

  • Can I reuse my existing web site code? If so, how?
  • How do I design for multiple form factors and operating systems while maintaining a common code base?
  • How do I handle the range of display destinations, including standard, high-density, and others?
  • What is the process for generating and deploying apps on multiple platforms?

Fortunately, PhoneGap is widely used and there are many examples of successful apps developed by designers and developers who have already successfully tackled these issues.

This article looks at one such example, an app for OfferzNow created by Enlighten (see Video 1), and describes their process for building a PhoneGap app for both iOS and Android using Adobe Illustrator CC, Adobe Photoshop CC, and Adobe Dreamweaver CC.

Advertisements

One comment

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s