交互设计

纠结的翻页设计

Posted in 交互设计 on 7/15/2011 by 00 – 1 Comment

1.什么时候需要进行翻页设计

当网页内容较多、不能在限定区域内显示完全时,需要进行分页呈现。为了方便用户在多个页面间跳转和快速定位(尤其是按顺序翻页),通过翻页设计提供多个页面间的导航。

2.设计翻页要考虑的问题

  • 分页的内容是什么类型?
  • 页面数量有多少?
  • 查看最多的是哪些页面?
  • 手动全部翻一遍的可能性有多大?
  • 是否会不按顺序翻页?为什么?
  • 是否会查看已翻过的页面?
  • 翻页是否需要在列表顶部和底部都出现?
  • ……

read more »

服务设计小笔记

Posted in 交互设计, 用户研究 on 6/9/2011 by 00 – Be the first to comment

SERVICE DESIGN: SETTING THE STAGE FOR THE CONSUMMATE EXPERIENCE

http://uxmag.com/strategy/service-design

一篇比较general的介绍性文章,看完有几点收获,简单记录一下:
1.“service design”是我们比较常接触到的keyword,类似的keyword还包括 “holistic design,” “multi-channel experience design” or “cross-channel design,”

2.传统的市场营销关注4P(product, price, promotion and place),如果想创造更佳的客户互动体验,还要关注3P(participants, processes, physical evidence)

3.你所提供的服务到底由哪些层次构成?每个层次包括哪些人、平台、设备、产品、功能、服务细节?它们如何构成整体的体验?

4.服务设计要在服务的全流程中识别问题点/痛点,将其转化为机会点/差异点

5.在线体验跟线下体验有什么样的差距?从counterpart那里可以学习、借鉴什么?

6.优质的服务设计意味着,所有相关人员,必需时刻思考并实践:如何为客户提供他们想要的,或是超出他们期望的服务。

常见网站导航的分类

Posted in 交互设计 on 5/13/2011 by 00 – Be the first to comment

网站导航的类型很多,但目前似乎还没有比较统一的分类和命名。参考了一些资料,将常见的网站导航归类如下,并附上一些例子:

Types of web navigation



按用途分

结构导航(Structural Navigation)

  • 全局导航(Global/Main Navigation)
  • 局部导航(Local Navigation)

关联导航(Associative Navigation)

  • 上下文导航(Contextual Navigation)
  • 相关性导航(Adaptive Navigation)
  • 快速链接(Quick Links)
  • 页脚导航(Footer Navigation)

功用导航(Utility Navigation)

  • 跨站导航(Extra-Site Navigation)
  • 工具箱(Toolboxes)
  • 标识链接(Linked Logo)
  • 语言选择器(Language Selectors)
  • 国家或地区选择器(Country Or Region Selectors)

页内导航(Internal Page Navigation)

 

按形式分

标签型导航(Tabs Navigation)

  • 导航标签(Navigation Tabs)
  • 模块标签(Module Tabs)

层级型导航(Hierarchy Navigation)

  • 面包屑(Breadcrumbs)
  • 快捷下拉菜单(Shortcut Dropdown)
  • 首页链接(Home Link)
  • 页脚导航(Footer)

菜单型导航(Menus Navigation)

  • 垂直下拉菜单(Vertical Dropdown Menu)
  • 水平下拉菜单(Horizontal Dropdown Menu)
  • 手风琴菜单(Accordion Menu)

内容型导航(Content Navgation)

  • 页面导航(Pagination)
  • 标签和标签云(Tag/ Tag Cloud)
  • 缩略图(Thumbnail)
  • 走马灯(Carousel)
  • 连续滚动(Continuous Scrolling)
  • 存档(Archive)
  • 文章列表(Article list)
  • 事件日历(Event calendar)

 

读书笔记-交互设计精髓

Posted in 交互设计, 读书笔记 on 3/2/2011 by 00 – Be the first to comment

这本书算是行业书籍里面的大部头了,断断续续地读了半年,收获很大。无论是产品、用研、交互、视觉、前端、开发,about face都值得一读。

的确,交互设计其实更多的是一种思维,很多角色都可以充当交互设计师。但这并不代表交互设计师没有空间了,因为交互设计所关心的事情,必须有人来做,只不过title不一定是这个。

 

简单回顾一下历史,上世纪80年代初,交互设计领域的研究已经开始。80年代中期,参与第一台笔记本电脑设计的工业设计师Bill Moggridge和Bill Verplank提出了interaction design一词。1995年about face第一版面世时,交互设计的影响力和影响范围还很小,因为过去的产品往往简单而直接。而电子化时代的产品,不可预测性增强,使用行为趋于复杂。随着互联网爆发式的增长,交互设计逐渐受到了重视。

什么是交互设计?

形式、功能、内容、行为都是设计关注的方面。交互设计的核心,在于针对具体的产品,如何去设计复杂交互系统的行为。所谓“体验”不是设计出来的,而是我们通过控制可能影响体验的要素,让体验更加趋于理想的情况。所谓的“体验设计”,可以包含形式、内容和行为三部分。(Form+Content-Infoivz, Form+Behavior-IxD, Behavior+Content-IA ?)

交互设计注重形式(form),对行为(behavior)进行设计。

其实,严格来说,所谓“行为”也不是设计出来的。行为可以引导,行为方式可以预先设定。交互设计实际是一种“可能性设计”,关注使用者的目标,期望,态度和能力(aptitude),预先思考行为发生的各种可能。 换一种说法,交互设计实际是要做一种“疏导”的工作,按不同的目的将使用者引导到不同的行为流中,并且以一种“流”的状态去完成任务,达到目的。

在非成熟阶段,我们更倾向于问“what”,是怎么样,为了解决眼前、手边的现实问题;成熟阶段,我们会更希望知道“why”,根本原因何在,为了解决全局、隐性但起决定性作用的问题。
整本书的结构的思路很清晰,从研究到设计,从框架到细节,逐层深入:

第一部分介绍了理论背景,作者的perspective和整体的framework──Goal-directed design。思路大致是

概念和方法 –> 理论根据(现实模型和心理模型)–> 实践的一个基础:区分用户层次 –> 定性研究的方法 –> 定性方法的综合呈现:人物角色和目标 –> 设计实践深入的桥梁:场景和需求 –> 从需求到设计:框架和改进

第二部分是设计行为和形式。从优秀设计原则和样式的总结出发,从中观的层面去考虑好的设计需要解决的问题和达到的目标:为什么样的平台和姿态设计?达到协调和流的状态,努力消除附加工作,设计好的行为,善用隐喻、习惯用法和启示,遵循基本的设计原则。

第三部分探讨了详细的交互行为的设计:搜索和查找、撤销、文件和保存、数据输入、点操作和选择、窗口、控件、菜单、工具栏、对话框、错误/警告/确认。这些都是作者认为存在问题、需要重新认识的常见操作和交互元素。

贯穿全书始终,作者一直在强调:设计无非也是为了满足需求,所以设计要基于对人的理解。在人与计算机的关系中,人应该占绝对的主导地位,掌握着控制权;而技术是为人服务的,不应该让人去理解系统的运作方式,去适应系统的限制。

我们平常总是动辄“用户体验”,什么都是“以用户为中心的设计”。仔细想想,“以用户为中心”只是形容词,重点还是放在了“设计”上。说到底,是不是真的愿意为用户着想,觉得他们的问题确实是值得我们去解决的问题,还真要打一个很大的问号。

与其每天高喊UCD,不如讨论讨论什么是服务精神,愿不愿意用一种服务周到的态度去面对你的服务对象(还不是直接面对),把什么事情都考虑周全了,把什么麻烦事儿都自己揽下并解决了。如果大家真正对所有用户都“有爱”了,愿意像对待家人、朋友、老板、客户那样全心全意地服务,什么UCD,什么用户体验,都是再自然不过了,何必时时挂在嘴边,好像生怕自己忘记。

咬文嚼字之 什么是交互设计

Posted in 交互设计 on 2/19/2011 by 00 – Be the first to comment
“咬文嚼字”系列的目的,是为了记录对一些基本概念或常见词语的理解。概念其实比我们想象中要重要,因为无效的沟通往往有一个特点:双方对基本概念的理解根本就不同。
——————————————————————————————————————
虽然冒着成为书呆子和学究的风险,但还是有必要想一想什么叫做“交互设计”(百度百科上的词条实在不太好理解><),毕竟每天都要听/说上个十几回。下面是一些不成熟的想法,欢迎拍打~

让我们先来对这个词做一下拆解:神马是设计?神马是交互?神马是人机交互?神马是交互设计?神马是好的交互设计?

什么是设计?

00的理解:设计是将问题的解决方案进行可视化

设计和艺术(art)最显著的区别在于目的不同
  • 设计:为了解决问题、传递信息、促进沟通
  • 艺术:为了自我表达、激发灵感、引起情感共鸣
两者还有其他方面的差异
  • 设计:表达的是对问题和服务对象的理解
  • 艺术:表达的是对艺术家自己、对外在世界的理解
  • 设计:更多是将已经存在的东西更好地联系起来、表现出来
  • 艺术:更多是从无到有的创造
与其将设计与艺术做比较,不如类比设计与规划(plan):两者都是基于问题的解决方案,以及解决方案的实施。设计侧重于可视化,规划侧重于系统化和操作性。

什么是交互?

00的理解:交互是两个实体之间的关系(relation)、行为(behavior)和响应(action & reaction)

  • 这两个实体的特征分别是什么?
  • 它们的关系是什么?
  • 它们的关系是否会变化及如何变化?
  • 它们会有哪些独立行为及相互行为?
  • 这些行为之间如何响应?
  • 相互行为对它们分别有怎样的影响?
  • ……

什么是人机交互?

人机交互指系统和使用者之间的互动关系(wiki

什么是交互设计?

我们来看看一些交互设计的定义吧~
1.
Interaction design (IxD) defines the structure and behavior of interactive systems. (wiki)
交互设计,又称互动設計,(Interaction Design, 缩写 IxD 或者 IaD),是定义、设计人造系统的行为的设计领域。人造物,即人工制成物品,例如,软件、移动设备、人造环境、服务、可佩带装置以及系统的组织结构。交互设计在于定义人造物的行为方式,即人工制品在特定场景下的反应方式)相关的界面。(wiki
2.
Interaction designers strive to create useful and usable products and services. Following the fundamental tenets of user-centered design, the practice of interaction design is grounded in an understanding of real users—their goals, tasks, experiences, needs, and wants. Approaching design from a user-centered perspective, while endeavoring to balance users’ needs with business goals and technological capabilities, interaction designers provide solutions to complex design challenges, and define new and evolving interactive products and services.
3.
IxD is about shaping our everyday life through digital artifacts.  We not only design what it looks like, but also how it behaves, and we’re designing the quality of the way we interact with the system.
(Gillian Crampton Smith)
4.
技术为中心的观点:将原材料塑造出人们喜欢使用的产品;
行为学派观点:定义人造物、环境和系统的行为;
社会交往设计的观点:利用产品来促进人与人之间的沟通
5.
交互设计是指设计人和产品或服务互动的一种机制
via

还是挺晕吧?从这些定义我们大致可以了解,交互设计是关于系统、人的行为、互动、产品的机制定义。

  • 因为IxD是设计的一种,so,它的目标是要解决问题,利用提供的材料在特定的环境下解决特定的问题。
  • 因为设计有目的有对象(人/受众),so,设计要基于对人的理解,而对IxD而言,更重要是要基于对人的目标和行为模式的理解
  • 因为IxD是为实体间的互动进行设计,so,它天生具有场景性,人与系统是在一定的环境、条件下发生关系、进行互动。

00对交互设计的理解:

根据用户的目标和期望,对用户与系统交互过程中的行为方式和所感知、接触的元素进行定义、规划和设计,以平衡用户与系统利益的方式,引导交互行为容易、有效、愉悦地完成

上面提及的都是广义的交互设计,我们平时谈论更多的交互设计是人机界面交互设计(HCIID:Human-Computer Interface Interaction Design),而我们的工作领域主要是互联网用户界面交互设计(IUIID:Internet User Interface Interaction Design),这里的界面主要包括web界面、移动设备界面、客户端界面。

还需要说明的是,正如体验实际上是不能被“设计”(只能为更佳的体验进行设计)的,行为也是不能被“设计”的,但是我们可以设计交互方式(怎样的交互行为可行?),以引导行为的发生,进而达到目的。

什么是好的交互设计?

00的理解:好的交互设计提供有用(useful)和可用(usable)的解决方案,能最有效地传达信息,激发、帮助用户高效地完成某个任务,并且在这个过程中感觉满意、愉悦。

简而言之

嚼了半天,我们是不是可以这样理解:

交互设计本质上是为使用者提供贴心、周全的服务而做的设计方面的所有努力

by 00

Designing Interfaces中文版摘要

Posted in 交互设计, 读书笔记 on 2/19/2011 by 00 – Be the first to comment

“模式是某个对象的结构和行为上的特点”,这是一本关于界面设计模式的书。为什么界面设计中模式很重要?因为

对设计师而言:

  • 模式捕捉了常用的结构,是关于best practice的总结和沉淀
  • 模式可以快速复用,提供设计的模块化素材

对使用者而言

  • 界面的习惯用法在增多,模式使用得当的设计得让人有熟悉感,易学习

全书的思路大概是:基于对用户的理解而进行模式的探索和积累——内容组织和结构模式——导航模式——布局模式——操作和任务模式——大容量信息展示——少量信息输入模式——大量信息编辑模式——视觉模式

01 用户做些什么

好的界面设计并非始于图片,而是对人的理解:人们喜欢什么,为什么会使用某种特定的软件,他们可能会怎样与之交互。人们使用工具的理由包括:寻找信息或对象,学习知识,进行交易,控制或监视,建造某种东西,和其他人交谈,娱乐等等。

交互设计第一步:找出用户的目的。界面设计真正的艺术在于解决正确的问题。

Web交互设计优化的简易Check list

Posted in 交互设计 on 1/30/2011 by 00 – Be the first to comment

“优化已有产品的体验”,这是用户体验相关岗位职责中常见的描述。我们的产品常常是在快速的迭代过程中不断完善的,就像孩子生下来需要养育才能长大一样,优化已有功能/产品,和设计新功能/产品同样重要,不可偏废。

但是,相比实现新功能,已有功能的优化总是显得没有那么紧迫而且很零散,导致了迭代优化的计划总是被归入“重要不紧急”甚至是“不重要不紧急”的象限,变成了东一棒子西一榔锤的买卖。我们可以通过可用性测试来发现问题,但是测试往往受到时间、用户邀约、场地和设备等条件的限制,可能无法进行。更多时候,设计师需要根据一定的原则(例如可用性准则)进行走查,以快速地发现并解决问题。

这篇小文章关心的问题是:如果想对非娱乐导向产品已有的交互设计进行优化,我们

  • 需要从哪些方面考虑
  • 遵从什么样的原则
  • 如何开始检查现有的设计
  • 如何确定优化的优先级

read more »