手机
当前位置:查字典教程网 >网页设计 >交互设计教程 >Android平板电脑设计:屏幕流创建与设计布
Android平板电脑设计:屏幕流创建与设计布
摘要:UI元素如同大家所想的那样,Android系统竭尽全力把一切做的与它的竞争对手相反(这叫做差异化!)。Honeycomb有其自己的UI规范,...

UI元素

如同大家所想的那样,Android系统竭尽全力把一切做的与它的竞争对手相反(这叫做差异化!)。Honeycomb有其自己的UI规范,并且它现在有一种新的“全息UI”视觉语言,用于诸如选择时间日期、选择一个选项,设置音量等日常操作中。了解这种UI语言对创建屏幕流和设计布局至关重要。

Android平板电脑设计:屏幕流创建与设计布1

UI元素的采样,来自Google I/O 2011演示文稿的一页幻灯片

字体

iPad4.3可以使用多少种字体?答案是57种。

Android多少种?只有3种。

是的,它们是 Droid Sans, Droid Serif and Droid Sans Mono.然而有积极的一方面。虽然平台只有这三种字体,但开发人员可以自由地将其他字体绑定他们的应用程序。

Android平板电脑设计:屏幕流创建与设计布2

什么相同?

对iPad已经熟悉的设计师是幸运的,这两个平台有一些相似之处。

触控手势

点击、双击、滑动、拖动、收缩、旋转和任意滚动。

拆分视图和多窗格用户界面

拆分视图是平板电脑中最常见的布局之一。它由两个并排的窗格组成。当然,你可以为更加复杂的布局增加窗格。

Android平板电脑设计:屏幕流创建与设计布3

Ustream的拆分视图,类别选项在左,内容在右。

嵌入式多媒体

两个平台都允许嵌入音频、视频和地图。

Android平板电脑设计:屏幕流创建与设计布4

Youtube 应用程序,具有嵌入式视频播放器。

剪贴板

支持应用程序内外的信息复制和粘贴。

Android平板电脑设计:屏幕流创建与设计布5

拖放

两个平台都有拖放功能。

Android平板电脑设计:屏幕流创建与设计布6

Gmail应用程序中的拖放特性

设计模式

Honeycomb沿用了很多在Android 2.0中引入的设计模式,并扩充了它们。如果你对设计模式不熟悉,正如Android中定义的,它们是一种“应对反复出现的问题的一般性解决方案”。设计模式是Android维护者设计的关键的用户界面规范,意图是助于用户体验的一致性、给予设计师和开发人员一个工作模板。它们是可以定制的,所以没有必要担忧。

如前所述,操作栏是Android 用户界面中最为突出的组成部分,也是这里的重点所在。

Android平板电脑设计:屏幕流创建与设计布7

日历应用程序中被高亮显示的操作栏

图标或标志

图标或标志在操作栏的最左边。它是可操作的;点击后用户被带到应用程序的主页屏幕。

Android平板电脑设计:屏幕流创建与设计布8

日历应用程序的图标

导航

下面,我们找了几种典型的导航形式,下拉菜单形式或标签菜单形式。Honeycomb使用一个三角图形指示下拉菜单,并为标签提供了一系列的下划线;下划线通常占据大多数操作栏的自身空间。

左箭头也可能出现在图标或标志抑或标签的左侧,用作返回导航或者取消主要操作。

Android平板电脑设计:屏幕流创建与设计布9

三种不同形式的操作栏导航

常用操作

常用操作,顾名思义,就是给用户类似搜索、分享和溢出菜单的东西。它们总是被放置在操作栏的右侧,远离任何标签。

Android平板电脑设计:屏幕流创建与设计布10

日历应用程序中的常用操作

溢出菜单

溢出菜单是常见操作组的一部分,有时候会被一根垂直的线分隔开。这个位置放置多种菜单项,比如设置、帮助和反馈。

Android平板电脑设计:屏幕流创建与设计布11

一个溢出菜单

搜索

搜索也是常见操作组的一部分。搜索的独特性在于它的展开和收缩动作。点击搜索图标后搜索框展开让你输入查询关键词。点击“×”取消搜索,此时搜索框收缩,又变成单个按钮的状态。这是在有很多操作键或图标需要展示的情况下节约显示空间的一种方法。

Android平板电脑设计:屏幕流创建与设计布12

搜索功能收缩状态(上方的图)和展开状态(下方的图)。点击放大镜展开搜索框,点击“×”关闭搜索框。

语境操作

当某个项目被选中的时候,语境操作会改变操作栏的格式,展示出的选项不同于其他项目。例如,照片应用程序正在展示缩略图,一旦一张图片被选中,操作栏就可能发生变化,为编辑这张图片提供语境操作。

用户可以点击“取消”或操作栏中的“完成”来退出语境操作栏。

Android平板电脑设计:屏幕流创建与设计布13

Gmail 应用程序中,点击和选中邮件的时候就会触发语境操作栏

[译者注:本人英语水平实在有限,而文章专业词汇又过多,翻译失实之处请指正。谢谢!]

本文编译自一叶苦雨,原文地址。

        系列文章:

        Android平板电脑设计:做得像iPad就行吗?

译文出处:thinkingrain.lofter.com

【Android平板电脑设计:屏幕流创建与设计布】相关文章:

5个有效网页设计的原则

网页设计理论:对比和等同

无意识设计:寻找有价值的用户连续行为

界面重设计的利与弊

浅谈交互设计的未来之服务设计

网页设计中的隐藏菜单示例

20款激励人心的设计语录海报

网页设计教程:网站背景中的他!她!它!

如何成为一名优秀视觉设计师?

O2O设计思考!“走出屏幕”的体验

精品推荐
分类导航