Identify Between Apps That Was Built With PhoneGap And Android Native

First posted on 11/10/2013

Sometimes, it is easier for us designers to design an app interface by referring to other app's layout design, to make an inspiration...

First, go to Developer options in your Android device Settings and turn on Show layout bounds.

image not found

Above is a screen shot for HealthTap app which was developed by using PhoneGap mobile app framework. PhoneGap is a framework for mobile app development and it is a cross-platform development, meaning you can port the source code into iOS and other platforms. It uses HTML5/CSS3 for the interface, and JavaScript for the back-end thing.

image not found

However, PhoneGap does use native Android library such as the above image. It invokes an AlertDialog which is a class in Android library. Besides that, it could use other Android Intents too, such as the Camera intent.

image not found

This is a screen shot of Instagram app. Needless to say, you can differentiate between these two frameworks easily by looking at the layout design.

In conclusion, the point that I would like to make here is to suggest that there should be a developer's tool where you can see the layout bounds for PhoneGap (HTML) app as well. So, it is easier for developers to do some debugging stuff... Oh wait, you can use your desktop browser to see the design layout. (Protip: Ctrl+Shift+K). Sure, but what if you want to see the design of such app like the one above?

Show Comments

Get the latest posts delivered right to your inbox.