网站首页 > 技术文章 正文
编辑导语:“交互”是一个我们经常会看见的词汇,“交互”包含很多方面,好的交互能够使工作事半功倍。但是你真的知道什么是真正的交互,而什么样的交互才是好的交互吗?一起看看这篇文章,来寻找答案吧。
最近一份工作和一位优秀的交互设计师(可能是我认知中最优秀的)一起工作,感觉整体的工作流程顺畅到让我舒心,令我不得不提笔写下这篇文章表达一下在我知道的领域中什么是优秀的交互。
一、核心
1. 交互的定义
交互有两种定义,一指交互设计师,一指交互设计。
交互设计师:在大中型团队中,都会设立一个交互设计师岗位,聚焦于交互设计,向上对接产品经理,向下对接UI设计师。一个优秀的交互设计师,在团队中一定会起到很好的粘合作用,帮助整个团队以及项目流畅的运转;帮助产品聚焦需求与用户身上;帮助UI设计师提高输出物的设计质量。
交互设计:交互设计本质上是对行为的设计;在小型团队中,交互设计是一个普适性的技能,对应的设计工作会被分给产品经理和UI设计师来完成,需要由一方活捉双方协作来完成交互设计,通过交互设计承载从抽象到具体的落地。
2. 交互的工作
在我们实际的工作流程中经常会遇到一种情况,你定义完需求字段和逻辑之后交付给「线框仔」去完成交互设计,「线框仔」画画线框图,然后将线框图交付给UI设计,在版本迭代中对接下前端开发验收下实现,在整个工作流过程中交互的工作流是不是就这样结束了呢?
(图片引自网络)
当然不是,交互需要做的事情虽然看起来集中在表现层,但表现层本质上也是从最底层的战略层→范围层→结构层→框架层→表现层一层层从抽象到具象上来的。
交互设计时需要同步思考其他层次的内容,举例:作为交互设计师要去设计网站工作台的导航时需要先思考产品的用户群以及用户的使用路径是什么样的,然后在产品梳理的信息结构基础上加工设计产品为左侧导航或者顶部导航的形式。
(1) 什么人用→看到什么
在交互设计的关键路径第一步一定是有用户画像的切分,什么样的人去使用这个产品,他能看到什么样的信息,哪些信息对他来说比较重要需要加重显示;通过了解用户画像的区分去设计对应界面里的信息、字段、元素、说明提示。
(2) 解决什么问题→做什么
这个产品/功能需要解决什么问题,这个影响到用户的功能操作设计;例如:收藏功能,在这个步骤的关键就是要解决用户浏览商品却无法将商品收藏起来的问题;用户看到了商品的信息,不是只浏览信息,而是可以对商品进行收藏、购买、添加购物车等一系列操作。
(3)迎合什么需求→完成了什么
没有服务于业务的交互设计只是一个局限于视觉的设计,交互设计和产品设计都是基于业务模型搭建,(用户看到了信息,对信息进行了操作)只是一个简单的一次性会话,实际在现实业务中会存在很多复杂且特殊的情况,这些都是需要在交互设计时考虑的,考虑到最终业务需要用户去做什么事情,在这个过程中存在着什么样的不同时态以及不同角色。
二、设计方法
格式塔心理学原则、尼尔森可用性原则、尼尔森F视觉模型、Heuristic Evaluation十原则、费茨定律、席克定律、7+2法则、2秒原理、2/8法则、3次点击法则、界面黄金8法则、jakob nielson原则、KANO模型、0123简单法则、MVP法则、婴儿鸭综合症、包豪斯理念、泰思勒定律、防错原则、奥卡姆剃刀原理、maya法则、信噪比法则、序列效应、功能可见性原则、成本效益、古腾堡图表法、交互易用性五大法则、马斯洛需求层次理论。
以下简单介绍三种交互设计方法:
1. 格式塔心理学
Proximity接近、Similarity相似、Closure闭合、Continuity连续、Simplicity简单。
格式塔理论明确地提出:眼脑作用是一个不断组织、简化、统一的过程,正是通过这一过程,才产生出易于理解、协调的整体。
也就是说在人脑作用下,人首先会注意到一个有整齐、规律的整体,然后再看到细致的各个模块。
2. 希克定律
著名的“交互设计四策略”:合理删除、分层组织、适时隐藏和巧妙转移。
给用户非常多的选择,约等于没给用户选择,当然任何应用程序都会有一些无法消除的复杂性,关键的问题在于: 谁会面对这些复杂性?到了设计简单用户体验的最后,往往不是问“怎样才能把这个功能设计得更简单”,而是问“到底应该把这个复杂性放到哪里”。
3. 微设计
“微设计”理念是一种从微小细节观察并改良物的思维方法。其分为两层含义,一层是观察并找到物存在的深层问题,另一层是用最为精确的方式改良物。”微设计”理念既强调准确找到物被人需要的理由,也重视以最小的改变达到对原有物品的精确改良。也就是所谓的少即是多,针对性设计。
三、关系
1. 交互设计和产品设计的关系
在我们想要做出一个优秀的交互和设计之前,先想想什么影响到了交互和设计的好坏?很简单,是这个产品上呈现出来的页面,是这个组成这个页面的字段、按钮等等元素。
那么想要做好交互设计,就需要组织好这个页面以及这个页面上的元素了。
那么我们该如何组织好这个页面以及这个页面上的元素呢?
就像是希克定律描述的那样,合理删除、分层组织、适时隐藏和巧妙转移,我们可以将页面中有业务关联的不同元素作为一类进行分类,这样更方便用户的操作,将同类型的元素划分为同一个功能区域,这些功能区域的排序必须符合用户习惯。需要符合用户的常规的视觉动线——由上至下进行排序,从左到右的顺序。
2. 交互设计和视觉设计的关系
为什么我们谈到交互时经常谈到设计?
本质上交互和视觉是无法分割开来的一个整体。交互依赖于视觉呈现效果,视觉又依赖于交互的指引。
举个简单的例子,如果一个页面上所有按钮的位置、大小都设计得很合理,但某个重要按钮的颜色没选对,本该使用抢眼的颜色却用了不起眼颜色,那最终交付出来的设计方案还是失败的,在用户侧使用时是无法达到前期交互设计所预想的设计效果。
所以我们看到在实际工作中交互设计师(或承担交互设计任务的产品经理)和视觉设计师常常会密切合作,避免两者相互冲突、彼此消减,力求达到“本应如此”的协同状态。
四、后记
以上讲的可能还是太过抽象,考虑后续有时间我会输出一份之前做过的《内容平台转型–工作台设计》的具体设计文档。
本文由 @东航Channel 原创发布于人人都是产品经理。未经许可,禁止转载。
题图来自Unsplash,基于CC0协议。
- 上一篇: 交互设计应注意的细节
- 下一篇: Spring Boot项目接收前端参数的11种方式
猜你喜欢
- 2025-01-04 新技术来了,你没必要继续折腾WebGL了
- 2025-01-04 Python实现机器学习前后端页面的交互
- 2025-01-04 裂变增长实战经验
- 2025-01-04 我独自研发产品「1」——工具选择
- 2025-01-04 Spring Boot项目接收前端参数的11种方式
- 2025-01-04 交互设计应注意的细节
- 2025-01-04 浅谈前后端交互的基本原理
- 2025-01-04 产品经理做的原型和交互设计师做的原型有什么区别
- 2025-01-04 SpringCloud各个微服务之间为什么要用http交互,难道不慢吗?
- 2025-01-04 如何从交互角度读懂产品需求文档
你 发表评论:
欢迎- 582℃几个Oracle空值处理函数 oracle处理null值的函数
- 576℃Oracle分析函数之Lag和Lead()使用
- 562℃0497-如何将Kerberos的CDH6.1从Oracle JDK 1.8迁移至OpenJDK 1.8
- 561℃Oracle数据库的单、多行函数 oracle执行多个sql语句
- 556℃Oracle 12c PDB迁移(一) oracle迁移到oceanbase
- 546℃【数据统计分析】详解Oracle分组函数之CUBE
- 535℃最佳实践 | 提效 47 倍,制造业生产 Oracle 迁移替换
- 530℃Oracle有哪些常见的函数? oracle中常用的函数
- 最近发表
- 标签列表
-
- 前端设计模式 (75)
- 前端性能优化 (51)
- 前端模板 (66)
- 前端跨域 (52)
- 前端缓存 (63)
- 前端react (48)
- 前端aes加密 (58)
- 前端脚手架 (56)
- 前端md5加密 (54)
- 前端路由 (61)
- 前端数组 (73)
- 前端js面试题 (50)
- 前端定时器 (59)
- 前端懒加载 (49)
- Oracle RAC (73)
- oracle恢复 (76)
- oracle 删除表 (48)
- oracle 用户名 (74)
- oracle 工具 (55)
- oracle 内存 (50)
- oracle 导出表 (57)
- oracle 中文 (51)
- oracle的函数 (57)
- 前端调试 (52)
- 前端登录页面 (48)
本文暂时没有评论,来添加一个吧(●'◡'●)