Android 4.0应用界面设计分析

我总是觉得，直到谷歌在2011年10月19日上午十点，公布了有关Android 4.0系统信息的时候，Android与IOS的火拼才算正式开始。 虽然苹果对待这个眼中的“私生子”始终贯彻着严厉的专利打压政策，但Android在全球的市场份额却保持着快速增长。势如破竹的表象背后，是潜藏已久的、巨大的中低端移动市场。Android的胜利，只是因为给了人们更多选择。

从2007年中到2011年中各大智能手机平台的用户量变化图，我们便能直观的看到Android惊人速度（信息来源：调查机构ChangeWave Research）。

对于新系统，我想谷歌是充满自信的。如果说在4.0之前，Android手机只是一个“实惠”的代名词。我想从Android 4.0 开始，系统界面在一致性上有了许多改善，Android所代表的，将是一个越发成熟的用户体验。那么，作为开发者，Android 应用的界面应该如何设计？如果你仔细观察 Google 近期的一系列应用上的设计，应该能发现在一些指导性的要点，而这些设计也正在被第三方应用采用。

就在几周前，androiduipatterns 网站针对 Android 应用的界面设计提出了一些规范性建议，其中包含了大部分功能界面的视觉规范，值得借鉴。

一、起始界面

起始界面是功能的导航界面，大量的跳转都要通过主界面来完成。因此，一个应用的视觉与交互体验也是从这里开始的。作为用户的第一印象，一个好的起始界面应该给人以家的感觉。

起始界面要怎样设计？这里有三点很重要：标题、色彩以及功能图标的整体布局。

顶端的应用LOGO/用户名左对齐，相关操作右对齐；界面采用产品的标准色系，以达到统一和简练；与IOS的九宫格排列不同，这里建议在界面中排列3-6个带有描述的平面图标作为功能引导。

那么，什么应用使用这样的起始界面呢？看这三个例子： Aldiko，Evernote 和 Google+。

二、分界面

应用的分界面可以有许多形式，但一些功能的应用已经十分广泛。用户在此基础上尝试着记住和理解它。例如顶工具条就是一个被普遍接受和容易掌握的概念。

与起始页面的title布局大同小异，谷歌在这里建议将应用的LOGO或者HOME键设置在屏幕的左上角。在屏幕的右上角设置最为重要的操作图标，在这个位置，本应只有屏幕内所涉及到的操作，而搜索功能似乎可以成为一个习惯性的“例外”。

这里有些例子：

三、列表界面

应用可能需要处理大量的数据，而列表则是将数据规则化呈现的一种方式。列表界面应该足够清晰，为用户提供一个好的概览，同时，列表界面的操作栏应该允许用户对列表进行单项或多项操作。除此之外，这里还提供了更为细化的列表规范，“复选框——文本项——相关操作”的布局模式可以满足更为复杂的功能需求。

两个比较好的范例是 Aldiko 和 Google Mail。需要注意的是，列表的选择框通常是在左边，但是在 Aldiko 中，文件夹图标在左边非常突出，于是 Aldiko 选择框放在了右边，达到界面上的一种平衡。

四、载入列表

应用可能需要处理大量的信息，比如微博类产品的信息流页面。对于用户来说，这意味着列表长度几乎是无尽的。目前，许多应用已经采用了比较通用的处理方法，当下滑到列表已缓冲条目下部的边界时，自动加载更多的信息。

下面是两个例子: Android Market 和 Twitter。

五、长按

对某个单项信息进行操作，一种交互方式是长按。这也许不是最明显的操作，但是节省屏幕空间，也很符合“情景菜单”的理念。在视觉实现上，有两个要点需要注意：
1、当用户准备删除项目的时候，不要覆盖选定的项目。用户始终能够看到项目内容，方能肯定删除操作。
2、呼出界面只显示简单操作。如果需要更多更复杂的操作，最好单独设置页面。

下面的三个例子：Aldiko，Astro 文件管理器和 Google+。

六、多选操作

对列表进行多选操作，最好在列表项目左侧增加复选框，当选定了多个项目后，屏幕下方自动给出操作栏，这样可以更加节省屏幕空间。批量处理结束后，操作栏自动消失。如下图。

七、标签

从Android 4.0 开始，系统进一步突出了 ，如下图。

Android Market 和 Google+ 是两个好例子。

八、实例分析

看了这么多规范和例子，大家已经对Android的UI风格有了一个整体上的理解。那么下面我将以facebook和twitter为例，简要分析它们在Android与IOS平台上的应用界面设计，从而突出两个平台的设计差异。

facebook

在IOS平台，UI设计延续了ios app传统的布局模式。LOGO于Titlebar顶部居中，左右两侧为功能键，下方为搜索框。在中部，设置九宫格图标，风格和色彩都沿用了网页版的设计，而底部则作为新消息的提示区。色彩上沿用了品牌色系，而控件的尺寸和质感，采用了iphone原生的GUI风格。

Android版则依照Android系统的视觉规范，title被置于左上角，功能按钮右对齐。信息流页面，tab位于页面布局的中上部，更符合Android系统的操作习惯。items的排版与IOS平台基本保持一致，只是减去了快速编辑按钮（因为长按会自动弹出）。

Twitter

由于iphone深入定制twitter，产品和系统高度整合，twitter的IOS客户端基本延续了原生系统的视觉环境。title并没有使用LOGO，而是以用户昵称加以替换。这种模式便于多账户更换登陆，同时增加了产品的主体性，让APP更好地融入到平台的原生环境中。

在Android平台。tittle与工具被放置在topbar左右两侧，而tap则被移动到了topbar的下方，从而形成了一个综合的持久导航。除了导航工具，图标的形态也根据Android平台的视觉环境进行设计，符合Android的UI风格。

九、总结

不同系统平台都倾向于打造独特的交互和视觉模式，从而吸引自身的用户群体。同一款APP，想要做到最大程度的推广，就要满足不同平台的开发需要，这种需要不仅是代码层面，更在于交互和视觉层面。如果说APP是词语，那么每个系统平台就是独立的语境。想要最大程度的准确传达出词语含义，语法和语气就要符合语境的要求。

从用户体验的角度来考虑，一个好的操作平台，就是一套完整的感官系统，它所代表的，是一个公司在品牌与技术能力方面的综合诠释。用户在长期的使用过程中，就必然会形成固定的操作习惯，人们在使用前期，需要花费精力和时间进行记忆与练习，在基本掌握后，就将转化为潜意识的反射行为，这也是大脑为了减轻记忆负担所形成的运作模式。

如果一个第三方应用的交互与视觉设计，和搭载系统的UI环境大相径庭，就会引发一些问题。因为用户在操作过程中，是少有耐心学习新的交互行为，磨合的过程就会导致误操作，从而影响用户体验的流畅性。试想一下，如果我们用筷子去吃西冷牛扒会是怎样的一种体验？

虽然Google并没有在界面上给出太多限制，但是随着Android平台的发展，应用界面逐渐形成一套统一的规则和界面应是一个大体趋势。一套产品，若要给用户留下良好的第一印象，就需要认真考量跨平台的设计问题，无论在交互层面还是视觉层面。当然这并不意味着所有的设计都必须千篇一律，如果你的界面能够保证易用性的同时又有不俗的视觉表现，不妨去大胆创新。不过，遵循原生系统的现有规范还是会减少你大量的开发成本。

参考文献：

http://www.ifanr.com/65085

http://www.androiduipatterns.com/2011/12/how-should-android-apps-look-like_16.html

源地址： http://xdc.baidu.com/?p=1044