When learning Android app development, one of the most important topics to understand is how to create delightful mobile interfaces and interactions. This means understanding the conventions within the Android universe, common style guidelines, patterns, etc.
The official Android docs has an excellent set of design resources. This section will highlight a few key design guidelines and link to the appropriate guides. You can also check out these Android design tips for a quick overview.
Check out these design principles which were developed by and for the Android User Experience Team to keep users' best interests in mind. Consider them as you apply your own creativity and design thinking. Deviate with purpose.
With the release of Android 5.0, there are updated guidelines for modern Android UI design. These guidelines are called "material design". This new framework encompasses several changes to the interface of Android apps and Google strongly encourages the adoption of these new principles. Check the following resources below for details:
Using these materials, you can understand and begin adhering to these guidelines for your own applications.
As you plan your app for Android, keep in mind that different platforms play by different rules and conventions. Design decisions that make perfect sense on one platform will look and feel misplaced in the context of a different platform. If you have built web and/or mobile apps in the past, review this Pure Android Guide for look at how to avoid making Android design faux pas. Check this article from jackrabbit for a more detailed breakdown.
Check out the UI Overview page which provides a high-level tour of key UI element. In particular, check out the Common App UI which outlines the key UI elements including the Action Bar, Navigation Drawer and Content Area.
Check out the color scheme guide and the android colors which includes common color palettes for Android apps. For nice color schemes check out:
For material design, check out the Material Palette for color selection.
Check out the typography guide to understand the common font types for Android apps and default type colors and sizes. See the calligraphy library for each custom fonts.
An icon is any graphic that takes up a small portion of screen real estate and provides a quick, intuitive representation of an action, a status, or an app. Icons must be created to work across a wide array of devices. There are also many different types of icons such as the "Launcher" icon on the home screen, ActionBar icons, and notification icons. To get started with icons, check out the material icons style guide. If you are looking for actual icons to use, check out materialdesignicons.com and material.io icons.
Check out the iconography guide and icon design guidelines for a detailed look. In particular, work to understand the design tips and follow the correct naming conventions for different icons.
Android powers millions of phones, tablets, and other devices in a wide variety of screen sizes and form factors. By taking advantage of Android's flexible layout system, you can create apps that gracefully scale from large tablets to smaller phones. Check out the following resources for more information:
There are about a dozen common UI patterns that are integrated into almost every app. When you are building Android screens, it's essential you adhere to these common pattern guides. The most important ones are listed below:
Following these and related guides explains in detail how to create consistent and delightful mobile apps.
One of the best ways to understand the best practices and patterns for app design is benchmarking other popular applications on the platform. One of the best ways to do this is to buy an Android device and use a variety of popular applications. In addition to that, we can benchmark by checking websites dedicated to giving us a wide sampling of apps and how they achieve certain common UI patterns. For this, we can check out the following sites:
Using these sites above to build up an intuitive understanding of how to build different UIs in your apps.
When developing a mobile application, there are a few stages you will probably go through during an agile development method. First, you decide on the core value of the app and determine the key user scenarios. From there, it is helpful to begin identifying and sketching the different distinct user interfaces and user interactions for the app.
The simplest way you can wireframe is by creating low-fidelity sketches on paper by hand. You can print a scaled Android frame to make this easier. You can also leverage many excellent digital tools as well:
See the android docs on wireframing for additional perspective and examples.
