手机软件交互设计笔记（二）

原文地址：http://uedc.163.com/1726.html Iphone和Android系统手机风靡全球的同时，移动互联网的发展也掀起了一股热潮。最近发现身边一些朋友纷纷在做手机上的第3方应用，或多或少碰到了些困惑，也许对于做惯了基于浏览器的产品的设计师来说，有一些比较典型的要点容易被忽略，这就容易引发出：找不到手机软件的感觉、布局经常改变、设计和优化时找不到明确的立足点等等一系列令人困惑的问题。本人有过一段手机交互设计的时光，将在这里罗列一些总结或感想，带一些建议，供看官们斟酌和评判。      抛开定位、使用环境这样的用户研究体系的大头，专注于说明手机交互设计的特点，其难点在于如何有效的结合硬件、软件平台和设计规范。 以硬件区分手机类型： 仅以物理硬键控制操作的机型（后文简称按键机） 主要以触摸方式操作的机型（通常包含主页、挂机等物理键） 物理硬键齐全，但支持触摸操作的机型（外形和按键机型一样） 主流的可安装第3方应用的软件平台： 塞班s60（第3和第5版） Windows Mobile for PPC Android Iphone OS Java（目前有非常巨大的智能和非智能机型群是包含java平台的） 其他还有很多，诸如plam os、UIQ等 交互设计规范： 一个有经验的设计开发团队，在项目初期会率先着手建立或检查相应平台的设计规范。和web控件规范一样，手机交互设计规范定义了一些常用控件、组件等的布局和响应方式，提炼设计中的公共部分，减少设计和开发的重复思考，并确保整个设计体系的一致性。不同的是，手机交互设计规范不仅有着限定作用，它同时还是一个信息架构的体现、一个创新的过程、并且它还对后续的交互设计起到一定指导作用。我们了解到的iphone的无菜单的风格、各种操作手势、弹出框、标题栏和返回按钮，都是在这个阶段就需要定义好的，而不是具体到某个功能中才任由设计师发挥（所以说创新应该作为一个系统工程，而不是在某几个细节上灵光闪现）。 从设计第三方应用的角度看，大致可以浓缩成以下几个版本的设计规范： S60第3版—有一套比较经典和严谨的规范 。另外S60第5版虽然是触摸屏机型，但是对于交互设计师的工作来说两者区别并不巨大，只是把OK键替换换成了点击，以及零碎的一些变化。 Java版—事实上由于左右物理控制键和方向键、OK键是按键机型的普遍配置，S60第3版规范的适用 范围是非常广泛的，稍微修改一点就可以适用于Java平台。区别在于手机的“删除”和“返回”两个物理硬键的配置不太一致，所以需要统一将右下角的命令默认为“返回”，在编辑文本时，临时变为“删除”。这样牺牲了某些机型的某些操作的效率，保证了这个整体的机型都可使用。 Iphone OS—Iphone的出现一举打破了之前若干平台固有的设计定势，硬键和操作模式都精简了许多。 不过其缺少固定的menu模式，这对第三方软件的设计来说是个巨大的挑战，要么需要很大程度上脱离iphone自身的设计规范体系，要么就极端精简功能。 Android—跟从了一些iphone中的经典手势，操作和页面布局风格上相对保守一点，保留了menu和back两个硬键，虽然不够独树一帜，但是在功能和设计之间做的了一个不错的平衡，对于第三方应用来说，这是一个可以有宽广发挥空间的平台。 根据上文所述，接下来我就主要以S60第3版、Android、Iphone OS为代表，通过抽取手机交互设计规范中的部分，来说明他们的特性和区别，顺带展开一些个人经验的叙述。 大家请看以下截图： 上面几幅图并没有刻意选择同一类型的界面来对比，我们不妨先仅关注硬键/全局功能键，会发现他们之间的显著不同，实际上反映到设计过程中，这样的区别对界面设计造成的影响要来的更大。 下面以摘取手机交互设计规范的形式来陈述： 1.硬键和手势控制 S60第3版 Android Iphone: 以上硬键和手势对于操作的控制，需要我们在设计前有个十分清晰的认识，并且整个团队达成一致，如有精力则需要专门写到设计规范文档中。硬键控制是没有什么改动余地的，两款触摸机型可以对手势适当进行取舍，毕竟有些应用用不到所有的手势，能精简操作最好。 （从下面开始，会有一些功能界面，请允许我偷懒一下，用线框代替实际界面截图） 2.菜单 S60第3版的菜单是由左软键或OK键调出，需要定义以下几点： （注：聚焦到某一条目上时，通常按OK键是打开，但有一些内容包含几种看起来级别相当的操作，此时会弹出菜单选择） 如何收回 背景是否雾化 每屏最多显示多少条 有无二级菜单，如果有，怎样调出和收回，和一级菜单的位置关系，焦点条的区别 菜单项文字靠左 数字标号，如果整个软件能保证菜单项目均在10位以内，建议加上，这样可以与数字键盘对应 对聚焦项或当前页面不适用的菜单项，是不显示还是文字变灰处理。 OK键菜单只包含针对聚焦内容的操作项，需控制在一屏之内，避免二级项 菜单项的排序规则：针对聚焦项的在上，其他的在下，这两部分中分别按照使用频率从上至下排列 Android Android传统的菜单是由menu硬键调出，比较多的是2-3行，每行2-3项，看起来像是一些按钮，所以里面的图标和文字都居中。作为第3方应用，如果菜单项稍多，做成一纵列的文字项从操作上来看也未尝不可，毕竟用户刻意记住其默认的菜单形式也没有什么好处。只是仍然需要注意控制一下数量，如果需要二级，可以考虑做成弹出的，比如在一级项中选择“排序”，之后弹出选择框来选择

原文地址：http://www.537520.com/?p=473 手机客户端设计风格 界面简单： 做减法不做加法，如果一个功能不是超过50%以上使用的用户都会使用，做减法。 别让用户不知道当前功能是干什么的。 慎用图标，图标占用界面的空间很大，如何更有效的利用图标表达意思显得格外重要。UI界面是吸引用户使用的第一感观。 手机界面的整体统一，菜单、下拉框、按钮等控件风格保持一致。 链接：用户在点击之间就知道里面是什么，可不可点，不要让用户惊讶。 按钮：让用户知道那就是个按钮，一眼直白的告诉用户按钮是干什么的。 文本框：预留合适的位置，不要多，也不要少。别让输入法抢了页面的主屏幕。 提示语：根据产品本身的特性，注意提示语的友好性，笑脸与苦脸图案有时比其它词语表达成功与失败更直观。 提示语一定要简短，切忌长篇大论，不要高估用户的耐性，言简意骇。手机屏幕“寸土寸金”。 报错：用户是否立刻可以注意到我们的错误提示，提示是否有引导性，必要时要加帮助。客户端不是网页，不会报404，过长时间的等待（loading…等）没有任何提示只会逼用户离开。 帮助：别让用户不知所措。适当的帮助可以让用户更快的上手。 不要试图改变用户的使用习惯，除非能让用户眼睛一亮。 下一页：提前预测用户希望看到什么，不要让用户失望。 如果希望用户下一步做什么，一定要很明显的表达出来。 退出：好的客户端不是右键“退出”，尽可能让用户自己去摸索产品更多的功能，右键或许更多的可以是快捷键。 原文评论：对于这条持保留意见，对于特定平台，每个键的交互都趋向于统一，用户按键时可以预知下一步会发生什么，比如S60的右键，就是返回或退出，如果增加快捷键很容易让用户迷惑。