Android 4.0 design specification (with full text translation pdf)

After reading and translating the Android design guidelines, compare Android 4.0 with Android2.3 and previous versions of app design guidance to summarize the 10 major changes to Android 4.0 design:

1. Navigation bar (see mode patterns> navigation Navigation)
The previous physical key navigation (return, menu, search, home page) becomes the virtual key (return, home page, most recent task) embedded in the screen.

On the left is a mobile phone with 4 physical keys in the early days, and a new version with only 3 virtual buttons on the right.

Remove the menu items and search items from the navigation bar, and display the previous tasks directly in the navigation bar by using a long press master key.

Recent Task Interface
When you put the menu away, add "more action" (action overflow) to the action bar of the software interface, as shown in the yellow dots in the following figure.

The yellow circle part is the position of the "more Action" (action overflow) and the display of the clicked content

2. Action Bar (see Mode patterns> action Bar)
Action Bar from the previous app icon + operation, into the following figure:
1 up to +2 spinner+3 important operations +4 more operations.
Which, up button, click to go to the current interface of the previous level, not the first level interface has this button, the first level of the interface has no upward button; Spinner is a drop-down menu for displaying content that includes a quick switch to the view and complete information to display related content; more actions (action Overflow) is a common and unimportant operation in the collection Action bar.

The action bar can be split into the 1 main action bars, 2 top columns, and 3 bottom columns in the following figure. If you want, the top bar can host the tab tabs, and the bottom column can host the main actions and the more actions that are collected (action overflow).

When the space is sufficient for horizontal screen display interface, the split action Bar can be flexibly merged together. As shown in the following figure, the mobile phone end is displayed in the Action Bar.

3. Multi-panel layout (see Mode patterns> multi-panel layout multi-pane layouts)
Multi-panel layout is more aimed at the tablet computer, put the mobile end of the directory view and details view of the two-level interface, or even more pages, composite display in the same interface, effectively using the screen space of the tablet computer, flat hierarchy structure, simplified navigation. This has been used quite skillfully on the ipad.

4. Selection (see mode patterns> Select selection)
The length of the Android4.0 is very different from the Android2.3 and earlier versions. The earlier version is followed by the appearance of the context menu. In Android4.0, the position of the operation Bar after the long press will cover a temporary situation action bar, no longer pop-up context menu surfaced. In the context of the temporary situation Action bar, the content items of the current interface are allowed to be handled individually, and are also allowed to be processed in batches.

The context menu emerges when a content item is long pressed Android2.3 and earlier system versions.

The context menu bar is covered on the Action bar when you press the Android4.0 system version of the content item long.

In context menu environment, support batch operation.

5. Return and up (see mode patterns> return and upward navigation with back and up)
Return the key to use in the mobile phone global virtual navigation bar, based on the user's recent view of the interface history, the use of reverse chronological way, the connection between the interface. The Up button is used on the left side of the action Bar, based on the hierarchy, click to go to the previous level of the current interface, if the current interface is already the highest level, there is no up button.

The yellow part is the page path after clicking the Up button, the red part is the page path after clicking the return button

6. Theme style (see Style style> theme style themes)
Launched three sets of default themes: Holo light theme, Holo dark theme, Holo light base + Dark Action Bar theme. The main app is designed on the basis of these three sets of default themes to speed up the efficiency of app research, but it is only recommended and not fully enforced. Visual designers can focus on the two chapters of style and building blocks.

7. Widgets (see Start Bar get Started>ui Overview UI Overview)
In the original Apps page, the widgets content is added with the tab tabs. A way to add widgets in a cryptic way and put widgets on the desktop. In app design, we should pay more attention to widget design.

8. Compatibility (see mode patterns> compatibility compatibility)
Backwards compatibility takes into account how the physical navigation keypad is compatible with the Android 4.0 system and how virtual navigation phones are compatible with Android2.3 and earlier versions of the apps.

Install the android4.0 system on the physical navigation key mobile phone, click the Physical button, and the action overflow appears at the bottom of the screen.

Apps that are designed for android2.3 and earlier systems on a new virtual navigation phone will appear on the right side of the virtual navigation at the bottom of the screen with the Action overflow button (as in the yellow section above).

Install android4.0 on the new virtual navigation phone and click the action overflow display status as shown above.

9. Emphasize pure Android application design (see mode patterns> pure Android)
In the Android4.0 app design guidelines, special emphasis is placed on Android Android apps, never use other platform-specific elements of attention, in the following 5 areas:
(1) Emphasize the visual elements of the style to conform to the Android system;
(2) No other platform-specific icons;
(3) Do not use tab tabs below the interface;
(4) Distinguish up and return, do not use the return Style button on the action bar;
(5) Do not use the right arrow in the Content list.

In the Android system, the tab (tabs) is fixed on top of the screen, not underneath. This is different from the iOS system.

10. Other details
Add a lot of new interactive details, information display and visual style specifications, see translation details. Among them, there are a few points to emphasize here:
(1) The interactive gesture of horizontal slip and content is added. In some modules, actions that support the right and left horizontal slippage, such as recent tasks and message notification drawers, are supported.

(2) Visualization of the plane, Grid wind is in the 4.0 stage.
(3) in the writing style clearly pointed out that writing wording, to directly use the second person "you."

See http://developer.android.com/design/index.html
Quick Lookup, Android full text translation download address: http://cdc.tencent.com/?download=Android-Design-4.0

The full text translation of Android is produced by CDC D3 Multimedia Group (Jiangning, Zhang).
Thank you for your reading!

(This article is from the Tencent CDC blog: http://cdc.tencent.com/?p=5082)