Mobile Application Design

The first stage in a development process is design. Designing a mobile application involves defining the content, goals, and process flow of the application. During this stage, you should not be concerned with how the user will physically interact with the application. It is recommended that the outcome of the design phase is a thorough flow diagram that will enable you to effectively develop the application.

After you design the application, you know the underlying processes that the application will need. You then design the user interface to determine how the user will interact with the application to achieve the application’s intended functionality and goals.

When designing the user interface, determine the best way to present the required information to the user. A good approach is to start with a hub-and-spoke style application map that defines screens and the interactions with those screens to achieve all steps within the application process flow. You can then draft the various individual screens using wireframe illustrations.

The Mobile Designer NativeUI library simplifies designing the user interface because it allows you to be less concerned with platform-specific differences of the target devices.

The size of a mobile device is much smaller than traditional, desktop applications. As a result, you will need to divide the information that you present to the user into multiple screens. Mobile applications tend to use a linear methodology, allowing the user to move from one screen to the next working on a single task at a time.

Screen resolution can vary within platforms. As a result, deploying to a particular platform might mean building the application at more than one resolution. For example, Android devices running version 2.3 often had screen resolutions of 320x480 pixels. However, it is not uncommon for Android devices running version 4.0 to have resolutions of 720x1280 pixels. Using the NativeUI simplifies this because the NativeUI adapts to the varying screens sizes and resolutions, allowing text, buttons, and other user interface objects to render correctly. However, you still need to carefully consider the position and size of the objects you display in the user interface, including graphic images.

High-resolution tablet devices require very large-size graphics for their high-density screens, that is more pixels per inch (PPI).

Avoid designing a platform-specific user interface for an application that will run on many platforms. For example, if you design your application’s user interface using Windows Phone user interface design, the unique interface mechanics of Windows Phone might be impossible to render on other platforms. Additionally, users might find the unique interface mechanics hard to use because they are unfamiliar with them.

Using the NativeUI library with little to no custom objects reduces issues, such as resolution dependency, localization, and accessibility.

Be aware that user interface elements might not render the same way within a platform due to changes between versions of the platform. For example, the design of the Apple iOS On/Off switch changed visually between version 4.x and 5.x of the operating system. Also, the Apple iOS numeric keypad looks different on the iPad from the iPhone.