Book Image

PhoneGap 3.x Mobile Application Development HOTSHOT

By : Kerri Shotts
Book Image

PhoneGap 3.x Mobile Application Development HOTSHOT

By: Kerri Shotts

Overview of this book

<p>PhoneGap allows you to use your existing knowledge of HTML, CSS, and JavaScript to create useful and exciting mobile applications.<br /><br />This book will present you with 12 exciting projects that will introduce you to the dynamic world of app development in PhoneGap. Starting with their design and following through to their completion, you will develop real-world mobile applications. Each app uses a combination of core PhoneGap technologies, plugins, and various frameworks covering the necessary concepts you can use to create many more great apps for mobile devices.</p>
Table of Contents (21 chapters)
PhoneGap 3.x Mobile Application Development HOTSHOT
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

User interface tips


Often, the details are what matter. Here are some tips to help make sure you have not only a great-looking app but also a great-feeling one. Consider the following points:

  • Avoid novel or undiscoverable interactions. Or, if you do want to use such interactions, try to provide a second discoverable method to achieve the same thing. We could argue that the slide menu in Facebook is novel, but the gesture should be discoverable: the button that triggers the menu is highly visible and likely to be tapped.

  • Respect your users' expectations of what UI elements and gestures do. At first, this seems obvious; you wouldn't send an e-mail by clicking on a trash can. That said, there are plenty of ways you can do things, even in a subtle manner, that your users didn't expect. Your users' expectations are highly specific to the platform, so following your platform's HIG will help out significantly in this area.

  • Do blend in. By this I mean that your app should look like it belongs on your user's device. That is, your app should respect the HIG for the platform. It also means your app needs to have the appearance of a native app. Failing to do so may cause your users to feel like your app is a second-class citizen. Even with a native appearance, your app should also do its best to feel native; that is, it should have the speed and response time close to that of a native app. (It may not always be easy, or even possible, on some platforms using Cordova. In this case, you should try to get as close as you can, without impacting your project and its timeline.)

  • Be a perfectionist. By this I mean that you should make sure that all your objects align well, your textures blend seamlessly, images are scaled correctly (especially according to the aspect ratio), and so on. This requires painstaking attention to detail; however, eventually, your app will look and feel better.

  • Be responsive. Whenever possible, avoid freezing the user interface. If you must freeze the UI, then put up an indicator to the user so they know their inputs will be ignored. When it comes to being responsive, this isn't simply about being responsive to a tap on a button, it also includes scrolling performance. If an app scrolls in a herky-jerky fashion, the app will feel slow.

  • Sip your data. While your app may often be used on a Wi-Fi connection, don't forget about users who may have to deal with a cellular connection instead. Their connections may not just be slower, but they are usually under pretty onerous data caps. Cache extensively. Avoid downloading what you've already downloaded. If it can be compressed, by all means, compress it. Alternatively, give your user an "out," if your app is going to use a lot of data no matter what. You might want to let them disable the portions of your app that use a lot of data when on a cellular connection.

  • Properly handle "no data" situations. Unless your app ships with all the data it ever needs, there may be times when there isn't any data to display. In a social network app, for example, the network may be down. In a content-generation app, the user may not have generated any content yet. In each case, your app should handle the situation as best as it can. For example, if the user needs to do something first, indicate that in place of an empty view.