读书会第二期:《用户体验要素》(下)

接上文···框架层1界面设计界面设计要做的全部事情就是选择正确的界面元素。界面元素的种类繁多,书里列举了复选框、单选框、文本框、下拉菜单、多选菜单、按钮等一系列网站设计中常用的控件,在2001年的时候这些控件就已经出现了,至今仍在大量使用,但是作者写这本书的时候并没有预料到目前的互联网行业有多么繁荣,所以近些年出现的很多新控件都没在书里。目前ios平台和安卓平台都有完善的设计规范可供参考,网上也可以找到海量的控件模板,只要耐心积累,多观...

接上文···

框架层
1
界面设计

界面设计要做的全部事情就是选择正确的界面元素。界面元素的种类繁多,书里列举了复选框、单选框、文本框、下拉菜单、多选菜单、按钮等一系列网站设计中常用的控件,在2001年的时候这些控件就已经出现了,至今仍在大量使用,但是作者写这本书的时候并没有预料到目前的互联网行业有多么繁荣,所以近些年出现的很多新控件都没在书里。

目前ios平台和安卓平台都有完善的设计规范可供参考,网上也可以找到海量的控件模板,只要耐心积累,多观察其他界面的设计优劣,这些基本功很容易就能打结实的。

另外有一点要注意,在2008年移动互联网盛行以前,界面设计指的工作岗位往往是由一位设计师独立承担的,这就是广义的UI设计师(User Interface:用户界面),那时的UI设计师主要负责的设计任务就是网站的界面设计,他们的工作核心就是“实现功能”——把产品经理在范围层划定的功能实现到界面上来。

但是在2008年移动互联网盛行以后,UI设计师的工作职责就逐渐开始细分起来了,国内的互联网行业以北上广深这些一线城市的名企为首,把UI设计师彻底分为了交互设计师和视觉设计师,交互设计师负责信息架构和界面框架,视觉设计师负责视觉效果和切图,我们在几年前常听到的“UI设计师”就是指一个人就把界面从交互到视觉都实现出来的设计师,现在基本上已经划分为交互和视觉两大块了。

所以大家在读这本书的时候尤其要注意,不要把书里的界面设计师和现在我们所讲的界面设计师混为一谈,它们名字一样,负责的岗位职责却各有不同,你要搞清楚自己干的活到底是框架层还是表现层,关键看你到底做了那些事,而不是你的岗位名称叫什么。

读书会第二期:《用户体验要素》(下)

2
导航设计

导航指的就是指引用户前往他想要去的地方的指路牌,产品里的导航形式有很多,每年也都会有些新的导航出来,它在框架层也是设计框架的要点之一,大家最常见的就是分类导航和分面导航,这点没什么可说的。

读书会第二期:《用户体验要素》(下)

书里提到了很多导航的逻辑形式,比如全局导航、局部导航、上下文导航、网站地图等等,我认为新手学习导航最好的办法就是多画信息架构,你在网上或者应用商店找那么几十个产品画出他们的信息架构,临摹下他们的导航展示形式,自然就慢慢摸会了。

不要看不起这种笨办法,笨办法往往有奇效而且并不怎么降低你学习的效率,如果你总是琢磨这些逻辑性的东西,企图看懂了文章就掌握了技能,这只能骗骗你自己,将来下笔的时候还是不知道该怎么画。

3
信息设计

书里对信息的设计写了几页的篇幅,总共就提到了两个关键点:“信息排序”和“分类整理”。每个界面上呈现的信息都有重要程度上的排序,优先展示重要的信息,把不重要的信息隐藏起来,同类信息进行归类,这些都是我们常用的信息整理方法。

作者是根据网站的界面来写这篇文章的,所以他认为在做信息设计的时候要把整个界面的信息都结合起来考虑,但是在某些网站或者app里面,有时候一张页面里面可能会有多个设计团队分别处理里面的模块(大企业的分工制度很完善),比如整个首页一部分划给你做商城,一部分话给我做社交,这时候的信息设计就是局部的信息设计了,合起来的时候还是要考虑整体信息呈现的一致性的。

另外,对于条目的信息设计是更细致的功夫,这尤其考验设计师对用户的把握。比如商城的推送往往和价格结合在一起,文章的阅读经常会有阅读量的展示,游戏和应用是按照下载量在排行榜展示的,这些都是因为用户对这些数据比较关注,所以设计师才会把它们呈现在外面。

4
线框图

很多人会怀疑,线框图还需要专门练习吗,只要懂得绘制铅笔画,任何人都能用线框把界面绘制出来,这似乎是一种初上手就能学会的技术,这也是大多数人觉得交互设计师和产品经理入行不需要门槛的原因。

在这本书里,线框图的讲解只占了不到四页的篇幅,作者似乎并不看重它的作用,实际上线框图没有那么简单,它是把设计师对用户的了解、对功能的剖析、对界面的设计呈现出来的最终结果,我赞同作者的看法,线框图是对页面中所有组成部分最直观的描述,只要能把它画出来就算把功能落实了。

但是遗憾的时候,目前互联网行业的交互设计师还是需要练习绘制线框图的,不仅要练习绘制,还要懂得怎么把线框图变成完整的交互文档,这并不是为了更好的呈现想法,而是为了减少沟通成本。

公司的员工各司其职,你不能指望运营同事和研发同事能通过一张简单的线框图理解你的全部意思,完整的交互文档必须有完备的标注,考虑到各种异常情况的应对,页面跳转的关系,甚至是精确到像素级别的线框图形(部分大企业有这种要求,中小型企业的产品界面往往是落到视觉设计师手里的时候才会精确到像素级),这些详细的描述都是为了更好地减少沟通成本。

完备的标注能够削减大量潜在的风险,一方面帮助系统提前解决掉大量BUG,另一方面也能避免因漏洞产生的损失,这些都是很有必要的,线框图可以说是前面从战略层、范围层、结构层到框架层最终凝练出的界面成果,是产品成型的最后一道防线,希望大家不要掉以轻心。

读书会第二期:《用户体验要素》(下)

表现层

创建感知体验

作者眼中的表现层包含了所有用户能接触到的感官体验,包括拿到电脑的触感、耳朵里听到的开机声音、眼睛里看到的多彩画面,这些都属于表现层的一部分,对于工业产品来说表现层代表了用户对产品形成的印象,而对于互联网产品来说,考虑到表现层基本上只要考虑视觉效果就可以了

视觉焦点:人类的视觉焦点会随着界面元素不断移动,焦点的移动轨迹会沿着“动画 > 图片 > 关键字 > 普通内容”的顺序前进,优先会被动画吸引,其次才会被图片和标题吸引(由此你可以知道那些总在网页右下角弹出来的动画广告有多烦了吧~~屠龙宝刀,点击就送!),在阅读的时候会沿着“F型”的轨迹移动。

对比和一致性:视觉的对比和一致性在任何视觉教学课程、艺术学院的授课里都有详细的阐释,就连那些讲“PPT该如何制作”的视频里也充斥着各种讲解,对比和一致性的确是视觉领域最常用的概念,这就是老生常谈了,这里不讲。

配色方案和排版:整套的配色方案应该和品牌形象结合在一起,不懂得取色的可以用取色板调节,这些视觉的设计方法网上有超多的大神可以教授,就不用在这本书里寻求指路明灯了,与其在这里看它的文段,还不如在站酷上找个高手学两招管用呢。

值得注意的是,书里提到的网站栅格方法至今还有很多企业在用(因为真的很好用),即使是移动端的app也可以使用栅格的办法保持一致性。栅格只是一种让界面元素保持一致性的设计方法,并不是什么神秘兮兮的高科技工具,原理就是把整个界面切割成统一规格的方块,对初创团队来说没那么必要,有它过年没它也过年——但是视觉规范还是要制定的,可以大幅度减少后期的修改成本。

读书会第二期:《用户体验要素》(下)

读书会第二期:《用户体验要素》(下)

要素的应用

马拉松和短跑:书里提到的这两种产品形态,马拉松指的是长期迭代的产品(多供给于C端),短跑指的是一次性交付的产品(多供给于B端或者硬件设备),作者之所以在书中会对那些企业家举马拉松和短跑的例子,是因为传统企业售卖的产品往往是离手便交易完成的一次性交付的产品,比如买瓶水或者买个苹果,买定离手就算交易完成了,但是用户体验类型的产品需要“圈住”用户,网站要不断的有用户访问才会产生价值,所以作者用马拉松和短跑的例子劝说那些传统企业家,他做的网站和传统的商品是完全不同的两码事

目前互联网行业的产品大多都是“马拉松型”的,需要不断迭代才能维持住竞争力,一次性交付的产品大多是硬件设备或者针对B端的打包服务,但是随着竞争的愈发激烈,这种一次性交付的产品也逐渐向着迭代型产品过渡了。

比如原本买完就算交易完成的B端后台系统,现在从一次性买断变成了不断推出后续服务,签订长期合同;手机从十年前的买定离手,变成了买到手里后系统可以不断更新,只是更新频率没有app那么高,像苹果或者小米就总会隔段时间就来个更新,以前可没有这种事。这不是这些厂家主动迎合互联网浪潮产生的变化,而是市场竞争加剧,不这么变公司就活不下去了,所以产品的更新往往是因为市场的更新,作者在文中也是这个意思,产品从短跑变成了马拉松。

读书会第二期:《用户体验要素》(下)

最后总结

相信大家也看出来了,所谓的用户体验五要素的分层理论,其实目前的互联网企业里已经有了相当娴熟的应用,它就是你的日常工作,只是从范围层变成了俗称的需求文档,从框架层变成了俗称的交互文档,各方各面其实在工作中都可以看到它的影子。

这就是设计方法论,它提出的是一种概念而不是具体的指导方法,你可以从这些文章里学习到设计的理论,却不能从职场新手变为成熟的工作者,如果你想更好地完成交互设计工作,还是多积累些需求文档和交互文档的工作经验吧。

读书会第二期:《用户体验要素》(下)

读书会第二期:《用户体验要素》(下)

读书会第二期:《用户体验要素》(下)
相关阅读
读书会第二期:《用户体验要素》(上)

原创文章,作者:交互精选,如若转载,请注明出处:https://www.iamue.com/36445/

(0)
交互精选交互精选
上一篇 2018-04-12
下一篇 2018-04-13

相关推荐

  • ArtCenter 2018交互设计本科详解

    交互设计无处不在,从手机应用到游戏,再到可穿戴设备和数字环境。交互设计领域正在经历着巨大的增长,市场对有经验的数字设计师的需求也在激增。专业简介ArtCenter在交互设计领域的丰富历史跨越了平面设计、交通设计、娱乐设计、工业设计和媒体设计等领域,毕业生现在在苹果、谷歌、微软和IDEO等公司担任领导职位。ArtCenter的前沿课程致力于创新。我们的学习过程强调核心方法、工具和过程,使学生在新技术出现的时候能继续前进。但这一课程并不全是...

    2018-05-07
  • 叶云燕:不懂用户体验,没有互联网思维的代理人,迟早会被淘汰!

    第1937期|编发/保险论坛互联网时代,到处都在谈如何用互联网思维做生意。有人用互联网思维卖奶茶,销售额翻倍;有人用互联网思维开理发店,已获得数千万融资;有人用互联网思维卖衣服,年利润过亿;而当我第一次提出要用互联网思维卖保险时,很多人都感到茫然,认为这不过是赶时髦,蹭热点。保险代理人的新机遇事实上,互联网时代的到来,对保险代理人来说是一个前所未有的机遇,它让代理人的品牌形象更加丰满,展业渠道更加多样化。更重要的是,互联网思维的核心是以...

    2018-04-25
  • 纽约大学交互设计研究生

    恭喜马同学收到纽约大学(NYU)Interactive Telecommunications 研究生offerOFFER展示:学生作品展示:作品集要求:CREATIVE PORTFOLIOSubmission of a creative portfolio is optional due to the diversity of applicant backgrounds. Portfolio materials need not be ...

    2018-03-09
  • 交互设计连载1:什么是交互设计?

    三年前...当时我还是一名刚入行的UI设计师。在一个无聊的周末,看到一篇介绍交互设计的文章,一时间特别兴奋。这篇文章大致告诉了我什么是交互,什么是交互设计。从那以后,我把注意力的侧重点逐渐往交互上靠拢,以至于后来有机会转行成为了一名交互设计师。下面po出这篇文章:《从零开始成为优秀的交互设计师》,可以去网上搜一下这篇文章,干货满满。回到主题,什么是交互设计呢?交互设计英文称之为Interaction Design。你来我往视为交互。你点...

    2018-02-07
  • Sketch book 各种材质产品手绘表现-别人家的手绘本,拿走、收藏... [更新]

    ▲点击关注最不可思议干货今天给大家共享一波Sketch book 各种材质产品手绘表现...拿走、收藏...手绘飙车活动进行时,点击按钮加入...手绘零基础▼点击看>此方法,让零基础小伙伴们透视准确率达到98%...津美优设2017暑期1期课程|格物造型.第5天: 线稿基础-借体推敲Ⅱ点击看>此方法,让零基础小伙伴们形态推演能力爆棚!造型推敲、设计发散!津美优设2017暑期1期课程|格物造型课程.第6天:借体推敲Ⅲ点击看>此方法让零基础...

    2018-03-23
  • Axure RP入门第五篇——全局变量实现不同窗口加载

    产品经理入门:Axure RP入门第五篇——全局变量实现不同窗口加载

    2018-03-04
  • 【干货】在考虑入行交互设计之前,你必须搞清楚这些

    本篇文章来自知乎专栏:设计史论与设计哲学https://zhuanlan.zhihu.com/sheji-history-theory作者:乐可柯产品与交互设计师,设计史论学者现任阿里巴巴集团交互设计师毕业于同济大学设计创意学院设计学硕德国奥芬巴赫设计学院交换生今年,O’REILLY公司对全球范围内的“交互设计行业”做了一次调研,收集到了来自25个国家、1000多名设计师的反馈,虽然量不大,但其数据显示的结果可以作为参考,一窥整个交互设...

    2018-01-31
  • 交互设计申请关注度最高的5个问题,第一个就头疼.. | 大咖说

    说到交互设计很多同学的第一反应就交互思维、交互体验...准备申请交互专业的同学也是非常心焦!说起来容易做起来难,我们还是多和专业老师取取经。伦艺学姐回答的5个交互专业问题,收好哦~Q1:转专业学生申请应该注意什么?我觉得需要看这个问题怎么定义转专业,因为在一个设计类的学科,很多设计的思维方式和实践能力是共同的,我们可以通过设计的方式去解决问题。如果想要转到交互或者用户体验的专业,其实提供的是一种用交互的方式和研究结果解决现有用户的问题。...

    2018-04-26
  • 四个小故事 每一个都是“极致用户体验”的用心诠释(上)

    古老的印第安人有个习惯当他们移动得太快的时候会停下脚步,安营扎寨耐心等待自己的灵魂前来追赶而身为现代人的我们在开启一段旅程前最重要的事情莫过于挑选一家“想客户所想”的旅行社只有这样才能安心这次我们透过四个小故事向你娓娓道来为什么说驴妈妈客服是“极致用户体验”的先行者即便是大家族,也“一个都不能少”王女士来自苏州,今年40多岁,她十分看重亲情,每隔一段时间,就会带上全家出国旅游——由于出身于一个大家族,王女士每次在驴妈妈报团,几乎没有少于...

    2018-04-11
  • Sketchelp | 画笔是设计师的思考工具

    作为公众平台的第一篇推送~这不是一则成立宣言,而是一篇老友记。五年ACCD手绘教学实战+三年工业设计考研方法传授,期间无数沉淀,我们想用一种更纯粹的方式去记录。于是,Sketchelp这个名字诞生了。Sketchelp,顾名思义,秉持着助人的心态,提供国外知名设计学院ACCD扎实的手绘观念,结合设计师多年在造型上的实战经验,用浅显易懂、循序渐进的方式带给大众关于设计与手绘的知识。在此基础上,我们将根据行业需求及未来趋势,持续不断地更新及...

    2018-05-04