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

从2007年中到2011年中各大智能手机平台的用户量变化图,我们便能直观的看到Android惊人速度(信息来源:调查机构ChangeWaveResearch)。

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

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

一、起始界面

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

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

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

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

二、分界面

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

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

这里有些例子:

三、列表界面

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

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

四、载入列表

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

下面是两个例子:AndroidMarket和Twitter。

五、长按

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

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

六、多选操作

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

七、标签

从Android4.0开始,系统进一步突出了,如下图。

AndroidMarket和Google+是两个好例子。

八、实例分析

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

facebook

在IOS平台,UI设计延续了iosapp传统的布局模式。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

更多相关文章

  1. 想抢先体验Android操作系统的魅力吗?那就使用Android(安卓)LiveCD
  2. 制约Android发展的三大难题
  3. Android(安卓)M 新的运行时权限开发者需要知道的一切
  4. 想抢先体验Android操作系统的魅力吗?那就使用Android(安卓)LiveCD
  5. Android用户看过来,免ROOT和顽固后台拜拜
  6. Android(安卓)Tool——Hierachy Viewer可视化调试
  7. 借一个项目谈Android应用软件架构,你还在套用MVP 或MVVM吗
  8. Android(安卓)M 新的运行时权限开发者需要知道的一切
  9. Android通讯录数据库介绍与基本操作(增删改查)

随机推荐

  1. android 横竖屏切换问题解决方案
  2. Android 本地代码中的LIKELY和UNLIKELY宏
  3. Android消息机制Message的target==null的
  4. React Native中gif格式图片无法在Android
  5. Android APK多个ICON入口
  6. 更新android SDK的问题
  7. 轻量级依赖注入框架koin简析
  8. 学习android编程过程(连载。。)
  9. 2011.09.13(2)——— android 图标上面添加
  10. Android ADB的一些用法