Tag Archives: UCD

交互设计学习笔记之《如何设计帮助系统》

从产品的整体设计来看,其帮助系统是提高产品可用性的一个重要环节,它能够帮助用户更快、更好地学习产品的使用,从而提高产品的可学习性;它能够让用户知道完成操作都有哪些更快更有效的方法,从而提高用户的使用效率;它能够告诉用户在遇到某些使用中的问题时该如何处理,从而减少用户在使用中的挫折感,也能有效地减少用户对于软件技术支持的压力,从而降低软件开发企业的技术支持成本。

为了设计出有效的帮助系统,在决定帮助中应该包含哪些内容时,我们可以采取一种基于场景的分析过程,即考虑用户在哪些情况下需要使用帮助系统,以下是总结出来的帮助系统中应当包含的内容:

  • 入门指南或学习指南:这主要是帮助用户了解软件都提供了对于任务领域中的哪些问题的支持和解决方案;
  • 操作指南或使用指南:这主要是帮助用户了解对于某个特定功能,如何操作界面以完成该功能;
  • 故障排除:这是为了帮助用户解决一些使用中的疑惑问题;
  • 参考手册;
  • 术语解释。

对于任何有一定规模的帮助系统,由于它包含了大量的信息,因此它自身的可用性也是设计帮助系统时需要认真考虑的一个问题。从本质上来看,帮助系统属于信息查询与使用系统,这类系统中主要的可用性问题有两个方面:

第一、使用效率,即用户能否很快、很容易地找到所需信息。

  • 索引
  • 搜索
  • 信息的合理组织与分类
  • 相关功能

第二、信息的可理解性。

交互设计学习笔记之《如何帮助用户探索和尝试》

对未知世界和事物进行探索是人类得以进步的一种非常重要的行为,而尝试和试验则是人类的一种很重要的学习亲事物的方法。在用户使用软件时,尤其是使用一个他们之前没有用过的新软件时,探索和尝试的行为是非常普遍和常见的。因此,软件设计人员应当在界面中对以上这两种行为进行很好的支持。

1.把所有的功能和操作尽可能列在菜单系统中

在对一个新的软件进行探索时,用户首先需要知道这个软件都提供了哪些功能或操作,这些功能或操作将会是用户随后的各种活动的发出点,而之所以需要把这些信息放在菜单系统中,有两个主要原因:

第一,菜单中对于功能或操作的描述是基于文字的,因此相对于图标而言,用户更有可能正确地理解他们;
第二,用户通过菜单方式来浏览这些功能是安全的,换句话说,仅仅在各个菜单中看看都有哪些内容并不会触发这些动作,这就使得用户可以放心一一仔细端详。实际上,很多用户在使用一个新软件时也是通过浏览菜单中的内容来看软件都有哪些功能的。

2. 让用户在执行某个操作前知道它的效果

某平板电视公司为了打消用户在购买时的顾虑,推出了一种平板电视的折叠宣传手册。这个小册子可以塞进报纸或杂志里面,展开后能变成一幅平板电视机的仿真招贴画,大小与42寸平板电视机一样。在接下来的一个月晨,该公司的平板电视销量神奇般地激增。在这个例子中,把印有电视的纸张贴在墙上的做法就是一种在采取真正行动前让用户可以预先看到其效果的方法,它能够让用户以一种低成本的方法来尝试不同的选择。

在软件设计中,预览功能就是这种原理的应用,这种功能对于用户尝试成本的节省也可能是时间意义上的。

3.让用户可以撤消动作

4.让用户可以把状态恢复到初始值

5.在执行具有破坏性的操作前要求用户确认

在软件界面中,在用户将要执行某个具有潜在的危害操作时,我们应当向用户提醒这个潜在危害性,并要求用户确认或取消操作,这里的危害性指的是对于用户数据或系统数据的破坏。

交互设计的利器——Flash Catalyst入门介绍

交互设计的利器——Flash Catalyst入门介绍

Adobe Flash Catalyst是一款专业的交互设计工具,可以在不编写任何代码的情况下快速创建用户界面。它的出现为开发人员和设计人员建立起了沟通的桥梁,程序开发人员可以导入设计师在Photoshop、Illustrator和 Fireworks中设计的用户界面,并将它们转化成UI组件而不改变它们原先的“皮肤”、外观和整体风格。设计师仍然用Adobe的各种产品来完成自己的大部分工作,但是能通过Catalyst来定义UI组件,这就像开发人员通过编程来完成这一工作一样。

2009年6月1日,Adobe公司给大家送来了儿童节的礼物,发布了Flash Catalyst Beta,大家可以到其官方网站免费下载试用。Flash Catalys的安装过程中一些交互设计不是很好,它首先得让用户解压安装文件到一个目录下,可是用户根本不需要从这些解压文件中选择 “setup”进行安装,安装程序自动运行,如此的结果是这些文件占据了几百兆的空间,用户却很容易就把它遗忘。建议Flash Catalyst开发团队在设计时,安装文件不要解压到某个目录下,直接储存在缓存中,等安装完成后就释放出来。接下来的安装非常简单,按步骤很容易就完成了。

启动Flash Catalyst,出现如下界面:

Flash Catalyst启动界面

从此界面上我们可以多种操作:1.打开一个项目;2.从AI文件中创建新项目;3.从PSD文件中创建新项目;4.从FXG文件中创建新项目;5.创建新项目;6.信息和介绍。 read more »

交互设计学习笔记之《如何使界面让用户一看就懂》

交互设计学习笔记之《如何使界面让用户一看就懂》

1.采用比拟手法

      比拟是人类语言中的一种修辞手法,其实质在于利用人们熟悉的或容易理解的知识去解释人们不熟悉的或难以掌握的问题。在软件设计中,比拟手法经常运用于以下领域:

      对某种界面进行比拟,软件界面中最常见的按钮就是对我们现实生活中种种物理的实休按钮进行模仿。它所借用的实体按钮的主要特性在于,当人们按下按钮后会触发一个动作。

      界面上的文字用语借用我们已经熟知的词语,如关闭、找开、移动(窗口)、复制、属性、重命名等。

      软件界面的整体外观借用我们已经熟知的事物或物体,例如windows操作系统的桌面就是模拟了真实世界中的办公桌面。

      在用户手册的编写中采用比拟手法,帮助用户更好地理解软件的功能和使用方法。

使用此方法时应注意的问题

      比拟的根本目的只是为了帮助用户理解软件,而并不需要在所有的方面和所要比拟的对象完全一样,尤其在操作上。

      不要被我们用于模拟的实际物理对象限制了我们的思维和想像力,这里主要指一些操作作为。

2.模型匹配原则

      首先需要理解三个概念:心理模型、实现模型系统模型 read more »

应需而变——产品设计流程

应需而变——产品设计流程

整体流程

 

上图是整个产品的设计流程,我们把其分为6个阶段,每个阶段都有关键的内容和要求,各个阶段并不相对独立,而是相互关联,互联互通的关系。产品设计本身就是一个反复迭代的过程,而且我们也要应需而变,进行灵活的产品设计。

基础调研

竞争产品分析

寻找市场上的竞争产品,挑选3-5款进行解剖分析。整理竞争产品的功能规格,并分析规格代表的需求,需求背后的用户和用户目标;分析竞争产品的功能结构和交互设计,从产品设计的角度解释其优点、缺点及其原因,成为我们产品设计的第一手参考资料。

领域调研

结合上述分析基础和资料,纵观领域竞争格局、市场状况,利用网络论坛、关键字搜索等手段获得更多用户反馈、观点、前瞻性需求。

参与者:决策人员、交互设计师、策划、开发人员

产出物:相应的对比分析文档和领域调研报告

产品分析

产品定位

从软件提供者的角度分析产品推出的意义和重点关注的方面,实际考量、丰满决策层的idea,明确列出产品定位,通过讨论修缮取得决策层的认可;

用户分析

结合竞争产品的分析资料,采用定性分析的方法,获得对产品目标用户在概念层面的认识;

产品概述

以软件提供的身份,以最简短的文字,向用户介绍产品,突出产品对用户的价值。避免功能点的简单罗列,而应该在归纳总结的基础上突出重点;

功能需求规格整理

在归纳关键功能的基础上,结合竞争产品规格整理的领域认识,从逻辑上梳理需求规格列表,重在逻辑关系清楚、组织和层级关系清晰。划定项目(设计和研发)范围;

参与人员:策划、交互设计师、开发人员

产出物:用户分析文档和产品概述、功能规格列表

交互设计

交互设计

一般而言,交互设计师都遵循类似的步骤进行设计,为特定的设计问题提供某个解决方案(注意,没有绝对正确的方案)。设计流程的关键是快速迭代,换言之,建立快速原型,通过用户测试改进设计方案。

其一般步骤如下:

用户调研

通过用户调研的手段(介入观察、非介入观察、采访等),交互设计师调查了解用户及其相关使用的场景,以便对其有深刻的认识(主要包括用户使用时候的心理模式和行为模式),从而为后继设计提供良好的基础。

概念设计

通过综合考虑用户调研的结果、技术可行性、以及商业机会,交互设计师为设计的目标创建概念(目标可能是新的软件、产品、服务或者系统)。整个过程可能来回迭代进行多次,每个过程可能包含头脑风暴、交谈(无保留的交谈)、细化概念模型等活动。

创建用户模型 Scenarios/Personas/Profiles

基于用户调用得到的用户行为模式,设计师创建场景或者用户故事或者storyboard来描绘设计中产品将来可能的形态。通常,设计师设计用户模型(persona)来作为创建场景的基础。

创建界面流程

通常,交互设计师采用wireframe来描述设计对象的功能和行为。在wireframe中,采用分页或者分屏的方式(夹带相关部分的注解),来描述系统的细节。界面流图主要用于描述系统的操作流程。

开发原型以及用户测试

交互设计师通过设计原型来测试设计方案。原型大致可分三类:功能测试的原型,感官测试原型以及实现测试原型;总之,这些原型用于测试用户和设计系统交互的质量。原型的可以是实物的,也可以是计算机模拟的;可以是高度仿真的,也可以是大致相似的。

实现

交互式设计师需要参与方案的实现,以确保方案实现是严格忠于原来的设计的;同时,也要准备进行必要的方案修改,以确保修改不伤害原有设计的完整概念。

系统测试

系统实现完毕的测试阶段,可能通过用户测试发现设计的缺陷;设计师需要根据情况对方案进行合理的修改。

参考者:交互设计师、策划、视觉设计师、开发人员

产出物:产品设计文档的交互设计部分
 

产出物

说明:这些文档是在整个产品开发过程中慢慢产出的,贯穿于产品开发过程的始终,并需要不断完善。

产品调研报告:这份报告有别于项目经理所做的产品报告,它是交互设计师及用户研究员根据自己的专业知识,从用户体验的角度进行分析,从而指导自己的设计,为概念模型做准备。

概念模型文档:此文档在调研、讨论的基础上,针对需求,把头脑中的概念形成模型,可以通过讲故事的方式进行情景设定,模拟用户使用场景,从而更容易地发现问题,及时进行相应的改进。

界面原型文档:当一切都成型后,我们可以进行具体的设计,进行界面布局,把功能进行合理的安排,形成文档,有利于评审,也有利于后续设计。

交互流程文档:这是一个非常详细的文档,把产品的操作流程形成规范,考虑了所有可能出现的问题,并给出相应的提示信息。此文档有利于指导设计,无论是程序开发还是UI设计,都做到有据可循。

补充:文档只是为了更好地完成产品设计,它可以起到解释性作用,一定程度上节省了沟通的时间成本,同时它也形成了一定的规范,让大家去遵守,有利于产品开发的执行,但是不要为了写文档而写文档,应付业绩考核,还自以为很有成就感。一切都要落实到行动上,没有强大的执行力,文档中描述得再好的产品形态也会被改得面目全非。

原型设计

信息架构和界面原型设计

交互设计师设计产品界面中应该包含的控件数量和类型、控件之间的逻辑和组织关系,以支持用户对控件或控件组所代表的功能的理解,对用户操作的明确引导,进行易用性评估,所有界面设计成为一套完整的可模拟的产品原型;

视觉设计师进行整体风格的设计,对主体界面进行风格设定,出设计方案。

参考者:交互设计师、视觉设计师、策划、决策者、开发人员

产出物:产品设计文档的原型设计部分

详细设计

交互设计师完善设计细节、交互文本和信息设计(Message box),视觉设计师在风格确定后进行具体页面的设计,进行可用性测试,易用性评估;

参考者:交互设计师、视觉设计师、策划、决策者、开发人员

产出物:详细的产品设计文档

设计维护

在产品设计的过程中,对出现的问题进行相应的调整,特别是在测试评估时出现的可用、易用问题。在产品上线后持续跟踪,针对用户反馈进行相应的改进。

参与者:交互设计师、开发人员、视觉设计师、策划

产出物:完整的产品设计文档、问题报告

——————————————

整理文档参考了许多资料,自己也理清了头绪,在设计的过程中并没有固定的技法,黑猫白猫,能抓老鼠的猫就是好猫。

大智交互设计
维基百科
总之阅读了非常多的资料,关键是指导自己的设计过程,还是要活学学用,应需而变 

Microsoft XUI Concept

这是INVIVIA为微软做的一个概念设计,其目的是通过一个诗意的故事来告诉人们技术已深深地融入我们的日常生活中。 XUI是experience user interface的缩写,视频中的概念已经离我们不远了,下面尽情欣赏精彩的视频吧。