Archive for July, 2010
Happy Car site界面设计欣赏
July 31st, 2010界面设计图标素材网站
July 31st, 2010当我们在做界面设计项目时，非常需要精致的图标，以下几个免费图标网站是经过筛选出的比较好的几个网站，方便设计师朋友们使用。
http://findicons.com/这个是我最常用的。
还有：
Iconfinder
Icon Fever
IconsPedia
Icon Seeker
IconArchive
Free Icons Web
Very Icon
365icon
Icon Easy
IconDB
Iconza
善于发现，善于创造
July 31st, 2010
生活中不无缺乏美好之物，只是我们过于匆忙，忽略了许多。德国设计师Lisa Rienermann在杜伊斯堡-埃森大学求学时，在城市建筑物下挑选合适的角度拍摄出来的字母集合。这是一件很有创意的事，要在身边找齐任意形状的字母并不难，但是要找齐同一题材的字母绝非易事。
基于用户体验的手机产品交互设计原则
July 31st, 2010一、用户体验信息收集
在讨论手机的交互设计方法之前，需要先对手机的用户使用习惯有一些基本的了解，需要对手机的用户体验信息做一些收集整理。收集用户体验信息首先需要确定两个问题：一是确定目标用户群体；二是确定信息收集的方法和途径。
在确定目标用户群体的时候，很显然的是，已有产品有过使用和交互经验，具备该产品或系统的交互体验的用户，相比较于那些没有体验的用户，可以为设计提供更多更有效的信息。因此在收集用户体验信息时，应该首先考虑所需设计的产品的用户或是有过类似产品使用经验的用户。在理想的情况下，当用户体验产品的交互时，设计师可以通过某种技术或是研究方法获得用户的全部感官印象，掌握他们的情感体验。然而这些主观的体验信息很难用实验室的方法收集或是客观的科学描述表达出来。因此我们只能寻求贴近实际的近距离接触用户体验的方法，就是深入访谈和现场观察。
我们需要调研的信息有：
1.硬件部分：
- 手机的持机模式（右手操作、左手操作、双手操作）；
- 手机的操作模式（手指触控、笔触、按键、滚轮、长按）；
- 两种操作模式下的输入方式（全键盘、九键、触屏键盘、手写）；
- 信息反馈形式（屏幕信息输出、声音、振动、灯光）对用户的影响；
2.软件部分：
- 用户对屏幕信息结构的认识（空间位置、信息排列顺序、信息的分类）
- 用户对信息导航的使用（菜单、文件夹管理、搜寻特定文件）
- 用户对信息传达的理解（图形信息、文字信息）
- 用户对交互反馈的获知（每个操作是否有明确的反馈）
3.积极的用户体验：
- 特殊交互模式带来的新奇感受——有趣
- 简洁的操作步骤和有效的信息提醒方式——信任感
- 软件运行速度，信息处理过程——操纵感和成就感
- 允许误操作，有效引导——安全感
- 交互过程中的完美感官体验（视觉、听觉）
- 类似于电脑操作过程的交互（有电脑使用经验的用户）——熟悉感和成就感
- 品牌元素在交互上的延续性——熟悉感和优越感
4.消极的用户体验：
- 系统出错、没有提示信息——压力、紧张和茫然
- 缺少误操作的补救机制——挫败感、压力
- 交互步骤的繁复难记——挫败感
- 提示信息的不明确（不符合用户模型）——茫然
- 过程处理时间过长——焦虑
二、用户分类
1.依据用户的需求可将智能手机的用户分为两类：
1.1 过程为主的用户(processoriented end user)
过程为主的用户的典型例子是电玩族，他们追求的终级目标就是视觉听觉的冲击和享受，最终游戏的结果反而变得不是那么重要了。此类设计对视觉和创意的要求是极为挑剔的，绝大多数设计师都有深厚的美术功底。
1.2 结果为主的用户(result oriented end user)
然而，与结果为主的用户设计相比，过程为主的用户的市场和受众都要小的多。结果为主的用户不在乎用什么样的方式完成任务，但是任务必须以最短的时间，以最简洁的方式，最精确的运算结果来完成。对于此类用户的交互设计人员来讲，更重要的是设计更合理的任务逻辑流程(logical task flow),以期最大幅度的符合人脑的思考方式和认知过程(cognitive process)。
2.依据用户的使用经验可将用户可以分类为：
2.1 新手用户
指刚刚开始接触和使用智能手机的用户，对智能手机的操作系统没有过使用经验，对计算机及应用程序的一般用法也没有太多的了解，但有一定的手机使用经验。
2.2 中级用户
使用智能手机有一定的时间，换过至少一个智能手机。对智能手机的部分操作相对熟悉，但经常使用的软件数量较少，并不完全熟悉智能手机系统的所有功能，对界面交互所必需的语法信息了解较少。
2.3 专家用户
有过相当长时间的智能手机使用历史，更换过几次智能手机，对手机的交互和电脑的操作都非常了解，经常主动寻找更简洁和快速的交互方式。
一般来说，中级用户和专家用户在长期使用某部分交互时遇到的问题更具有代表性，而新手用户提出的问题则更有利于设计人员认清用户与智能手机交互时的认知过程。
三、交互设计原则
对应用户体验信息的收集和用户分类，我们可以总结出来智能手机上交互设计的方法和要点。
1.硬件交互设计
- 根据人机工程学原理设计按键大小等硬件交互要素；
- 尽可能提供多种输入方式，包括键盘输入和手写输入，键盘包括数字键盘和全键盘。合理设计键盘使其符合用户的使用习惯；
- 考虑环境对用户操作的影响。例如嘈杂的环境下提供震动的提示方式，黑暗又需要保持安静的环境下选择指示灯闪烁发光的方式提示用户。
- 同样需要考虑环境因素对用户的影响，利用机械结构多样化设计实现单手操作模式和双手操作模式的切换，需要设计切换的便捷方式、屏幕方向的变化和键盘的转换等等硬件交互要素的变化。
- 设计新奇的交互模式，将大大提升用户体验，例如sony的滚轮导航模式，和苹果的触点导航键（旋转和点击），都获得了巨大的商业成功。
2.信息交互设计
- 信息项目的排布密度合理，字体排列、图标排列的方式具有可调性，设计合适的方式来突出重点信息；
- 使用用户的语言来传达信息，而非技术的语言。有效地使用“隐喻”。例如windows里面的“记事本”就是一个很好的隐喻例子，因为它和人们熟悉的日常概念联系在一起，所以用户可以很容易的理解这是一个什么工具。好的隐喻可以起到快捷的说明作用；
- 字体大小、颜色、图标设计等，都决定可读性的好与坏；
- 需要保持一致性的不光有每个功能软件或是服务的图标外观，更包括开机动画、细节元素和无形框架的一致，都需要贴合用户行为习惯进行设计；
- 尽量避免同一个元素包含太多的信息，例如，颜色的使用不要包含太多信息暗示，因为用户不一定会注意到或是理解某种颜色所包含的暗示。
3.软件交互设计
- 导航功能。随时转移功能，很容易从一个功能跳到另外一个功能；
- 允许工作中断。例如当用户编辑短信的时候，收到短信或电话，完成后回来仍能够找到刚才正写的短信息；
- 方便退出。例如，提供两种退出方式，按一个键完全退出，或是一层一层的退出。
- 让用户知道自己当前的位置，使其做出下一步行动的决定；
- 提供快速反馈，减少不必要的潜在等待时间。在任务交予系统处理或计算的时候，会有一段潜在的用户等待时间，一般我们会通过合适的等待提示让用户知道现在正处于系统潜在工作状态，而不至于让用户频繁地重复操作，使系统更慢；或者合理通过多任务切换处理避免这样的等待间隔。通过这些方法可以让用户回避这种的无效时间，从而提高交互效率。
- 良好的防错机制。误操作后，系统提供有针对性的清晰提示。即使发生错误操作，也能帮助用户保存好之前的操作记录，避免用户重新再来；
- 提供了解用户操作行为的途径，可以更好的帮助改善系统的操作；
- 通过缩短操作距离和增加目标尺寸来加速目标交互操作。
4.体验交互设计
- 让用户控制交互过程。“下一步”、“完成”，面对不同层次提供多种选择，给不同层次的用户提供多种可能性；
- 预设置的默认状态应该具有一定共通性和智能性，并对用户操作起到协助或提示的作用；此外，还应留给用户修改和设置默认状态的权限；
- 图标、多媒体设计、细节设计和附加功能设计为体验增值，有效提升体验度；
- 视觉设计，例如开关机动画、界面显示效果等；
- 多方面考虑用户信息的私密性，提供有效的保护机制，例如指纹识别密码模式。
四、总结
体验是一个比较虚的概念，很难量化很难评估，所以也导致很多小的无线产品开发团队干脆放弃了对产品用户体验的把握，甚至不需要设置一个专门的呃交互设计师职位来改善产品的交互体验，这对于成长型的公司是可以容忍的，但是对于要想做出精品，长期处于市场不败之地的公司就显得不够严谨了。手机互联网是未来的发展趋势，手机产品也对交互设计提出了更多的要求，简单探析了一下从用户体验出发来进行手机产品交互设计的方法原则，之后还是需要一个比较成型的交互体验评估体系的。
解读iPhone平台的一些优秀设计思路
July 31st, 2010
本文试图从iPhone的角度结合一些iPhone平台项目的设计经验提炼出iPhone平台的一些优秀设计思路，以供大家在做移动互联网设备设计时参考。
1、移动互联网设备和传统手机的区别
在传统手机时代，标准的通话键、挂机键、菜单键是手机的标配，用户被教育成了用键盘来操作数据，于是我们就养成了使用键盘的习惯，经典的案例就是诺基亚主导的时代。
在移动互联网时代，特别是触屏的大规模应用，手机的功能已经发生了转变，对互联网内容的浏览、下载、消费等等成为主要应用场景，触摸屏成为行业趋势，直接对内容进行操作，在屏幕范围内的点击成为主要的操作。绝大部分操作通过直接和内容交互完成，不要让用户通过中间设备间接进行控制。
因此，就可以理解为什么苹果会这么激进，只保留了一个home键，而将其他功能性的操作全部做在了屏幕里面。
在底部的几个按键的处理上（返回、菜单、home、搜索），Android的做法似乎介于传统手机和iPhone两者之间，既保留了传统手机的一些特性，但也在学习iPhone的触屏做法。从苹果遵循极简的设计思路来看，iPhone做得更彻底、更加极致一些。
2、高度直觉化的界面
苹果采用了隐喻等方式来暗示用户这里的操作，目的就是降低用户的学习门槛，使用户第一眼就知道怎么去用iPhone，典型的案例就是锁屏界面的解锁操作，以及缩放照片的操作。
iPhone采用了全触屏的操作方式，绝大部分操作都通过直接触摸完成，仅提供一个home键的实际按键，这种做法配合multi-touch技术，无论是完成一个任务还是体验游戏，操作都最大程度简化了用户的操作路径。
为此，iPhone还提供了各种丰富的手势，基于此，开发者可以创造丰富的操作体验。比如：tweetie 2
3、在需要时给我导航，且告诉我将去向何处
在iPhone平台上，如果应用程序有信息层级关系（比如邮箱>收件箱>邮件），利用title进行导航，导航栏左侧始终是返回按钮，右侧如果有必要，可以放针对内容的操作控件，中间有标题。
对这里的导航按钮来说，始终只有返回上一级的功能，且明确指明上一级的title是什么。
那么，另外一个问题是 如果这里的信息层级太深怎么办？是否需要给出返回首页等按钮或者更长的面包屑路径，这里需要考虑的是怎样减少程序的信息层级而不是一味地去将这里的导航复杂化。
iPhone提倡直接对界面元素进行操作，返回上一级也是如此，无需通过其他物理按键来切换页面，你所需要做的事情就是直接在屏幕上点击。
Navigation Bar
4、稳定的界面结构——tab bar，toolbar的位置
iPhone典型应用的界面结构很稳定，导航栏和页签栏的位置不会因为应用不同而发生变化，用户能形成比较一致的体验。
Android平台在规范性方面不如iPhone，比如：
a) Andorid对标题的处理方式比较奇怪，有的程序有标题栏，有的地方没有，不符合一致性原则；另外，还存在大小两种尺寸的标题栏。
b) tab bar的位置。有的应用放在顶部，有的放在底部，体验不一致。
另外，对手持设备来说，关注焦点是从上而下的，tab bar的关注点没有内容那么高，其实只是在需要的时候可以方便地进行切换就足够了，放置于顶部对于手持设备来说操作很不便。
5、一次做一件事情，避免一个按键承载太多的功能
Android的菜单键是一个全局按键，使用频率比较高，根据不同的场景功能又各不相同，用户较难形成一致的体验，系统级的菜单和上下文菜单也容易让用户混淆。
苹果的做法是将菜单里的功能进行分解，重要操作用户可直接操作（如通讯录的添加联系人，iPhone是直接放出来，Android是将其放到菜单里面），其他操作或集中在设置或通过滑动等交互方式进行扩展。（tweetie 2是将针对当前联系人的更多操作通过滑动的操作展示出来）
6、增强用户体验
iPhone在增强用户体验上有很多点值得学习。比如core animation提供了大量优雅的动画可以直接使用，以实现华丽的动画效果。
为什么用动画？
在整个界面转换的过程中，苹果会添加一些动画元素，作用有三：
a) 缓解用户等待的焦躁情绪，如：经典的程序登录界面动画。
b) 暗示用户当前界面的来源。如：有信息层级关系的左右切换动画。
c) 增强用户体验
用什么动画？
界面常用的几种动画:
a) 有信息层级关系的采用左右切换动画。
b) 针对当前视图内容的操作常用的采用model view的从下往上升起的动画。如：写邮件，action sheet。
拟物化设计
除此之外，还有声音元素、透明设计等其他手段以提升用户的使用体验。
(本文出自Tencent CDC Blog，转载时请注明出处)
