屏幕外的交互设计:界面设计 ≠ 屏幕设计

网易UEDC – Vicol :在互联网做设计的朋友,工作中几乎每天都接触着电脑和手机屏幕,像我的交互设计 工作也以接需求画原型图写文档为主。但我今天想说的,和这些看起来没有什么关系。我想说点屏幕外的交互设计 。

文章目录[隐藏]

屏幕外的交互设计:界面设计 ≠ 屏幕设计

网易UEDC – Vicol :在互联网做设计的朋友,工作中几乎每天都接触着电脑和手机屏幕,像我的交互设计工作也以接需求画原型图写文档为主。但我今天想说的,和这些看起来没有什么关系。我想说点屏幕外的交互设计

在设计界,我们几乎无时无刻不接触到一个概念:界面。我们常说的「人机交互」,其实中间省去了一个「界面」。就狭义上大部分电子产品来讲,人也就是用户,向界面有输入的过程,界面将用户的输入翻译成机器语言,交由机器来处理,机器将处理结果在界面上转变成人类可知的信息,再输出向人,形成一个闭环。

屏幕外的交互设计:界面设计 ≠ 屏幕设计

这里我们发现有两个处理过程:

  • 一个是把人的输入信息变为机器的可知语言。
  • 一个是把机器的处理结果变为人类可知信息。

纵观几十年的人机交互发展,这两种处理过程一直是一个优化进程。这个过程由设计概念和技术突破来引领。设计上提出前瞻性的设想和概念来刺激技术,技术上攻破一道道难关来实现设计。

从最初的CUI到GUI,到现在的TUI、VUI以及逐渐发展的NUI,可以看到这个过程中,对机器的性能要求越来越高,对人的输入输出成本要求越来越低。人机交互的发展,其实是一个从机到人的发展。我们要求机器能说,能听,能看,甚至能理解(机器学习、人工智能等),这都是朝着我们人的认知世界和感知信息的方向去发展的。

屏幕外的交互设计:界面设计 ≠ 屏幕设计

那么再回到「界面」上。界面作为人与机中间的信息传递媒介,是我们交互设计师关注的重中之重。可是,做了这么久的交互设计,我们常常会有种误解,我们所谓的界面,就是电脑上和手机上的屏幕。我们所谓的「界面设计」更像是「屏幕设计」。

然而,并非如此。

屏幕外的交互设计:界面设计 ≠ 屏幕设计

当我们对界面进行抽象和概括性的理解会发现,界面本质是在传递和展示信息。那么三个问题来了:

  • 只有屏幕可以吗?
  • 到NUI时代,屏幕还是最好的信息载体吗?
  • 屏幕适用于所有的数字产品用户吗?

下面给大家分享几个界面设计的实例来回答这三个问题。

电梯楼层按钮

屏幕外的交互设计:界面设计 ≠ 屏幕设计

屏幕外的交互设计:界面设计 ≠ 屏幕设计

电梯里的楼层按钮我们几乎天天见,这样的界面太过于常见,我们常忽视了它们也是界面的一类。可能有人觉得这没什么好设计的。

实际上,电梯楼层按钮的排布设计,我在不同地方见过好几种。有的是从左到右从下往上排楼层,有的从下往上从左到右排楼层,哪种更合理?楼层数相对比较多的情况下是否需要优化设计?还有开门关门按钮放上面合适还是下面合适?以及楼层到达提示怎样看着更清晰?当数字键盘成为我们要设计的界面时,这些就是我们要思考的问题。

智能自行车

屏幕外的交互设计:界面设计 ≠ 屏幕设计

就车身而言,我们的骑行行为作为输入,车头的方向指示灯就是输出。那么车头就可以理解为界面,它所要传达的是告知用户转向信息以及部分路况信息。在这个界面上,交互设计师所能思考的方面有很多:在户外骑行的场景下这种信息的传递怎样才最有效?传递哪些信息是合理的?这些信息分别以什么样的形式告知用户?怎样才能确定用户接收到了信息?这样的界面交互思考是我们平时不太遇到的。

小度机器人

屏幕外的交互设计:界面设计 ≠ 屏幕设计

接下来的例子是我当初参与设计的小度机器人。在这个机器人身上,我们看到了熟悉的屏幕,也就是机器人的脸。可除了这张萌萌哒的脸,小度身上也可以「调戏」。在做这个机器人的时候,我们思考怎么让这个机器人更像人。试想一下,我们是怎么跟活生生的人交流的。表情、语言、肢体等等,这是人类交流的方式。

所以当设计机器人的时候,我们不能把它完全当一个机器去设计。虽然有一个屏幕,但我们会跟别人交流的时候在人家脸上点来点去吗?并不会。我们和对方主要的交流方式是语言沟通,亲昵的时候,还会有身体接触。这些交流方式我们不会觉得怪异和陌生。所以我们设计小度的时候,你也可以摸摸它的头,它会害羞地笑一下或者满足地看着你;你摸摸它的胳膊,它会跟你说外面冷你要记得多加点衣服。这才趋近于自然的人类交流。而在小度这里,所谓的界面也就不仅仅是脸上的屏幕,是整个身体,我们的输入方式也变得多元化。

可变形金属

前面说到的都是已经落地的产品例子。下一个是清华大学美术学院的研究类项目,研究方向是可变形金属。(观看视频→可变性金属

在这个例子中我们可以看到,金属通过自身的形态变化表达一些所谓的「情绪」,可以想象,如果这样的可变性金属成为一种界面,我们会有怎样的输入,它又会有怎样的反馈输出?这个例子明显比之前的感觉离我们遥远一些,我们只是朦胧地看到某些可能性,并不清楚会走向什么方向。但我觉得这是交互设计研究领域非常有趣的一点。对于未来,我们可以探索,可以展望,可以试错,有些事情我们觉得会成为可能我们就去研究。它可能走不通,也可能带来新的交互方式,这就很让人兴奋。

盲人触摸显示器

我们通常提到的界面,很大程度是通过视觉去感知的。那么对于盲人朋友来说,视觉通道是关闭的。对于他们来说,显示屏几乎是没用的。所以有团队针对这样的人群,设计了盲人触摸界面,通过语音输入,以点阵盲文的形式来呈现信息。

屏幕外的交互设计:界面设计 ≠ 屏幕设计

盲人触摸显示器页面刷新频率一般很高,因为受过学习和训练的盲人其阅读盲文的速度快到惊人。那么这样的界面,从交互设计上来说,如何让盲人阅读时不错行,盲人阅读是否有更好的体验,文字和图片的展示如何做区分等等,这种界面的设计都需要严谨的交互设计流程去解决。

通过以上这些例子,分享一下我自己对我们常见的「界面」这个词的更多角度的认知。

可以看到的是,在不同的产品中,我们所面对的界面不再仅仅是屏幕,作为交互设计师,我们所要关注的也不仅限于眼前这个发光的方块。多年后,我们可能处在各行各业,都在做界面设计,只是有人在做屏幕界面,有人在做其他各种界面,但我们都还是交互设计师。

欢迎关注作者「网易UEDC」的微信公众号:

屏幕外的交互设计:界面设计 ≠ 屏幕设计

「怎样成为真正意义上的交互设计师?」

【优设网 原创文章 投稿邮箱:yuan@uisdc.com】

================明星栏目推荐================

优优教程网 UiiiUiii.com 是优设旗下优质中文教程网站,分享了大量PS、AE、AI、C4D等中文教程,为零基础设计爱好者也准备了贴心的知识树专栏。开启免费自学新篇章,按照我们的专栏一步步学习,一定可以迅速上手并制作出酷炫的视觉效果。

设计导航:国内人气最高的设计网址导航,设计师必备:http://hao.uisdc.com

原创文章,作者:震天下,如若转载,请注明出处:https://www.iamue.com/34309/

(0)
震天下震天下
上一篇 2017-09-26 12:39
下一篇 2017-09-29 12:55

相关推荐

  • 车载系统交互设计畅想Part1:仪表数据展示

    智能车载系统的概念变得越来越火热,智能驾驶的理念也越来越普及。现阶段,国内外各大互联网巨头都在联合传统汽车企业一起探索智能汽车的设计研发。可以预见的是,在不久的将来,驾驶员在车内将更加自由,就像智能手机一样,智能汽车将为驾驶员带来前所未有的丰富体验。本文作者Adhithya,通过一系列的访谈调研,探索现阶段驾驶员在驾驶过程中的行为方式,并依此为未来的智能车载系统的交互方式设计提供了科学的思路。“我知道在手动挡车上转速表的作用,但当我换了自动挡后我就很少去看它了“
    ——被采访人1
    ”我并没有真正的去关注过它,对我来说,这部分信息没有什么意义。“
    ——-被采访人2
    ”可能在爬坡的路面上我会看一下转速表了解一下车况,但当我在城市里平坦的路况行驶时,我很少会看它。“
    ——-被采访人3

    2017-05-01
  • 【译文】作为新手,我该如何学习Web设计

    我现在对于网页开发一无所知,我应该学习什么能让我可以在六个月之内开发任何网站?无论是看书或者开展项目都可以。 简单引导: 学习基础知识.  看一本书,而不是文章 设计一些东西.  从一款很酷的设计工具开始,比…

    2016-08-04
  • 交互设计中的心理学

    整理认知心理学中对交互设计(用户研究)有所启发的一些知识点(参考《认知与设计——理解UI设计准则》)包括:中央凹与边界视野——如何呈现信息以获取注意力格式塔原理——如何处理不同界面元素的关系时间感知——如何让…

  • 交互设计延伸阅读:格式塔心理学5项法则的学习与思考

    格式塔心理学5项法则的学习与思考 最近在整理交互设计七大定律,发现了这篇老文,内容很精彩,翻译下与大家分享。 最近在整理交互设计七大定律,文章要系统的看。 目录:【交互设计七大定律】关于交互设计法则“除非…

    交互设计WiKi 2015-08-27
  • 移动端的时代要如何重塑网页设计流程?

    随着时代和技术的发展,网页设计 的流程正悄无声息地发生着巨大的变化。精准具体的设计交付列表不再是网页设计 的唯一标准,静态页面设计在整个设计流程中所占的比重也逐步降低,正如同Stephen Hay所说,我们所设计的不再是单纯的页面,而是包含诸多组件的一整个系统。

    2017-06-05
  • 让产品经理无言以对的交互设计流程

      首先,要感谢我的 Leader 和师姐,在他们的帮助下,我才理清了这个交互设计流程。   虽不敢说这套方法一定是最优的,但至少是我工作以来一个的专业上里程碑。   话不多说,直接开讲。   日常…

    2017-03-06
  • 当与需求方争论时,UX 设计师的正确姿势该是怎样的?

    在我们平常的设计工作中,和需求方产生各种争论的情况很常见,双方都比较偏执强势的时候,很容易陷在各自的立场中,谁也说服不了谁;如果设计师本身就离自己负责业务的用户有一定距离(比如大多数的 B 类产品),就更容易在需求方面前陷入被动。这种时候,我们更需要从自己的专业思考角度走出来,用科学的方式去收集、分析、定位、验证问题,洞见问题本质,来和对方更好地达成一致。产品经理 A:我们的首页好久没改版了,要不要来点动作?
    设计师:好啊好啊,我也正想和你提议呢,早就看不下去了!
    (省略双方需求沟通过程若干字)
    ***进入设计评审阶段***
    运营:哎,这个内容对我们推广 XX 很重要的,怎么能去掉呢?
    产品经理 B:我负责的这块业务你是不是漏掉了,要首页首屏重点透出!
    产品经理 C:你要考虑万一某某用户来访怎么办,他们的诉求得满足~
    老板:我需要什么什么感觉,没体现出来啊!
    设计师:塞这么多东西用户都想看吗?
    众人:我不管,这块内容很重要的!
    ***设计师吭哧吭哧改了一版新的***
    众人:感觉好复杂啊!是不是还是别改了……当所有人都觉得一匹更快的马已经够用时,该如何说服他们接受相对昂贵、不容易习惯的汽车呢?

    2017-05-02
  • 交互设计文档怎么写? | 设计基础05

    摘要交互设计师的工作虽不只是画交互稿子,但是好的交互稿不仅能够完美阐释产品内容和设计师的设计思路,还能够在项目各方协调工作中起到重要作用。保证完整的呈现产品需求和设计思路的交互稿,能够让各方工作人员…

    2017-08-04
  • 设计原则中的5种信息组织方式

    要以用户能够轻松使用和理解的方式组织信息。用数据来回答用户的疑问。以更贴合用户目标的方式来呈现信息,就能创造出更好用的产品。“信息或许是无限的,但是……组织信息的方式是有限的,因为它们只能通过LATCH原则来组织:位置(Location)、字母表(Alphabet)、时间(Time)、分类(Category)、层次(Hierarchy)。”——Wurman, 1996“我做了太多次尝试,试图用某种其他方式来组织信息,但最终都会回归这5种之一。”——Wurman, 1996比如说,设计一套特别的服务时,我们应该考虑不同物品的位置关系,它们如何分布。超市货架的设计就是很好的例子,在物理空间中组织信息。比如字典和通讯录,无论是虚拟的还是物理的。举例:日历和会议日程、邮箱收件箱、项目计划、有趣的Facebook时间线、电商平台的订单列表、消息应用,还有许多。这种信息组织方式充斥着真实世界和虚拟世界。从购物与工业,到Pinterest上的分类和Twitter的标签。例如:从小到大,从低到高,从开心到不开心等等。给服务和产品标星打分、计分表、能效等级、尺寸等等。

    2017-08-04
  • 解压设计?一位交互设计学生对智能化的反思

    Skylar Jessen 是纽约大学的一名学生,主修交互设计。他觉得,如今的交互设计普遍缺乏人性化的东西。它们“压缩”了人们的自我表达方式。最近,在学校的交互设计项目上,他提交了一些特别的设计,并称之为“解压设计”…

    2017-08-01