从「重新设计火车票样式」,谈用户体验设计

作者:无鹿森全文共 2522 字,阅读需要 6 分钟———— / BEGIN / ————“用户体验”是随着互联网的日益深化而变得越来越热的话题之一,它所代表的就是互联网产品和人性本身的相互共鸣,并且这种共鸣在今天而言,显得越来越弥足珍贵。从交互设计到视觉设计,怎么样才算是“好的用户体验”?一直以来,大部分情况下的论调都停留在主观意识层面上,这也使“用户体验”的话题本身显得更加难以拿捏和扑朔迷离。本文将从“重新设计高铁票样式”的角度来切...

从「重新设计火车票样式」,谈用户体验设计

作者:无鹿森

全文共 2522 字,阅读需要 6 分钟

———— / BEGIN / ————

“用户体验”是随着互联网的日益深化而变得越来越热的话题之一,它所代表的就是互联网产品和人性本身的相互共鸣,并且这种共鸣在今天而言,显得越来越弥足珍贵。

从交互设计到视觉设计,怎么样才算是“好的用户体验”?

一直以来,大部分情况下的论调都停留在主观意识层面上,这也使“用户体验”的话题本身显得更加难以拿捏和扑朔迷离。

本文将从“重新设计高铁票样式”的角度来切入举例,着重讨论一下用户体验设计的维度和标杆。

一、使用场景分析

高铁已经成为大部分国人出行的首选,一方面价位不算昂贵,另一方面速度确实足够快。

然而,从12306 的App到官网,这种上世纪90代风格的古老网站以及模板式的交互方式,能一直存在下去,也是侧面证明了国人的忍耐力。也因此,12306 App和高铁票经常被拿来当做用户体验改版的热手范例。

本文也不例外,不同的是:本文将量化改进目标,从更为全面的用户体验理论维度进行改进尝试。

在一般的高铁使用场景中,以车票作为核心要素的乘车流程应是:

从「重新设计火车票样式」,谈用户体验设计

乘车流程

在这样一个使用流程中,可以先提取比较重点的信息元素:

  • 用户侧:日期、车次、车厢、座位、时间点、检票口

  • 检票侧:日期、车次、身份证信息、检票口

在获取这些较为重要的信息之后,再看一下高铁票原来的样式:

从「重新设计火车票样式」,谈用户体验设计

高铁票样式

高铁票原样式可以认为存在以下的问题:

  1. 美观度不够;

  2. 信息层级区分不明确;

  3. 排版比较糟糕。

车票样式上存在的比较严重的信息就是:重点信息不明确,乘客需要耗费一定的时间才能得到自己想要的信息。

主要还是因为:信息层级不明确,留白区域不够,无法将对应的重点信息主动传达给用户

并且在实际场景中,务必要照顾到时间比较紧张的乘客,缩短阅读的时间成本和脑力思考成本是必须要考虑的因素。

这样就大致得出了改进的方向:

  1. 美观度改进;

  2. 信息层次区分需明确;

  3.  排版优化;

  4. 减少不必要的文字信息。

二、用户体验理论层面分析

根据前面的论述中所列举的高铁票中的重点信息和改进方向,这里可以采用的用户体验理论进行细化改进,包括:

  1. 信息设计;

  2. 可抵达性;

  3. 价值性。

其中信息设计是用户体验五层理论中的信息层的重点核心,可抵达性(Adoptable)和价值性(Value)是用户体验VADU理论中的A和V。

信息设计可解决的就是信息层次不明确的问题,这里可以采用的突出某些重点信息的方式有:

  1. 字号区分;

  2. 颜色区分;

  3. 粗细区分。

从「重新设计火车票样式」,谈用户体验设计

优化方案-1

可抵达性指的是用户get到信息的快速程度,使用户更加快速地“抵达”自己想要达到的“目的地”,可按照这个标准进一步剔除和归类不重要信息。

通过加粗字体,变大字号,增大留白区域突出显示对乘客而言比较重要的信息。

价值性即是突出对用户最有价值的信息,使用户在短时间内可以快速获取对自己最有价值的信息。

通过字号的变化来突出显示信息仍然不够,其他干扰信息仍然存在,这里将采用弱化干扰信息的方式来进一步强化车票传达信息的能力。

从「重新设计火车票样式」,谈用户体验设计

优化方案-2

总结处理方法:

  1. 辨别重要信息,字号加大,重要信息字体加粗;

  2. 根据信息类型归类,如车次信息、检票口信息、座位信息等都可以认为是和车相关的具体信息,而始发站、终点站和出发时间可以认为是和此次出行具体相关的信息,个人信息和车票相关的信息单列;

  3. 隐藏(对乘客而言)不重要信息、突出(对乘客而言)重要的信息。这里采用字体颜色弱化的方式来减弱不重要信息(即干扰信息)的存在感。

三、背面信息

从「重新设计火车票样式」,谈用户体验设计

高铁票背面

背面信息一般情况下都是被忽略的部分,这里仅对背面信息进行排版上的优化,背面信息目前的样式很“偷懒”地把所有文字堆积到一起,在可阅读性上较差,这里厘清文字的段落,使之传达的信息更加明确:

从「重新设计火车票样式」,谈用户体验设计

高铁票-背面优化

四、视觉样式重设计

在重新界定了火车票上的所有信息之后,就可以开始“放肆”地进行视觉上的重新设计啦~

一般而言,火车票的视觉样式不宜大起大落,毕竟受众群体过于广大,太小清新不合适,逼格太高也显得违和,太俗的话,还不如不改。

以下本着“认真不负责”的态度进行几种样式的火车票(正面)设计:

从「重新设计火车票样式」,谈用户体验设计

极富“逼格”长条形

从「重新设计火车票样式」,谈用户体验设计

机票形

考虑到印刷成本,其实不建议在车票上采用图标样式。

还有一个原因:在车票上使用图标其实并不能对车票信息的识别度起到非常大的作用,一方面是因为可使用图标的元素较少,另一方面图标元素极易出现误导的情况。

如:检票口的图标,不论采用何种方式,都无法通过尺寸有限的图标进行表意。

五、总结

其实“重新设计火车票”本身就是信息设计的一个典型案例,而信息设计是用户体验中固有的一环。

很多设计师把火车票设计得更加花哨,或者追求好看将字号变小,都是某种意义上的“夹带私货”的行为。

使火车票重新回到它应该的样子,这可以说是用户体验的功劳,其实也可以说是设计精神没有普及开来的悲哀。

好的用户体验是可以量化的,具体的标准就是VADU理论的尺度标杆。VADU所代表的含义即:价值性(Value)、可抵达性(Adoptable)、欲望(Desire)和可用性(Usability):

  • 价值性可以通过比对解决方案和需求的重合度来进行判断,解决方案如果可以完全满足需求,那就可以说是价值性高;

  • 可抵达性即用户到达自己“目的地”的难易程度,如果用户可以在短时间内不耗费大量时间成本和脑力成本即可抵达“目的地”的,就认为是可抵达性好;

  • 欲望指的更多的是在视觉和主观感受上,譬如:产品的吉祥物或插画的作用,更大程度上就是为了迎合欲望,唤起用户的好感和认同感,当然好看的界面也会对此有所帮助;

  • 可用性则是所有产品的根基,可用性的好坏往往需要通过用户调研才可以得出结论,无法直接量化。

好的用户体验往往是这四个维度进行综合表现的结果,如果某个产品在这四个方面中的任何一项出现短板,都很难说它的用户体验是好的。

在火车票这个例子中,我们可以得见的是:好的信息设计会极大缩短乘客的时间成本,也可以让顾客不困惑于票面信息的含义;既达到美观的目的,也保证了乘客可以完全无误差地抵达“目的地”。

其实,对于火车票而言,清爽美观仅仅是最低级的需求,更高级的需求需要在信息层面上大做文章,而非为了美观而舍弃核心重点。

———— / END / ————

本文由 @无鹿森 原创发布于人人都是产品经理。未经许可,禁止转载

从「重新设计火车票样式」,谈用户体验设计

点击“阅读原文”下载APP

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

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

相关推荐

  • 美国交互设计“综合类&艺术类”院校申请差异对比?

    回复【交互】,获得专业老师一对一专业指导随着现今数字智能等高科技的发展,交互设计成为近些年众多艺术留学生的热门首选专业。但热门并不代表很多同学都对交互设计有所了解,比如,根据向汉艺咨询的学生情况分析,90% 的同学都分不清什么是到底什么是交互,只是很表面的认为交互就是各种“APP”、“UI设计”或者VR/AR。实际上,即使国外最顶级的院校,你也找不到一所专门设立“APP”的专业,“UI设计”严格上来说只能算是“平面设计”,而设立VR/A...

    2018-04-30
  • 设计×交互 | 在做交互的时候,我们可以从不好的设计与好的设计中学到什么?

    让人人都懂点儿设计设计史论全文字数 :4689 | 阅读 时长:12分钟今天史论君为大家分享一篇来自interaction design foundation的文章原文作者:TEO SLANG    |    翻译:于于于Jessica编辑:Sujay Wu转载后台回复 :史论君把不好的设计和好的设计的反面例子一起看,不仅有趣,而且为设计师们提供了重要的经验教训。它们突出了设计人员要避免的陷阱,并让我们理解如何将设计理论转化为在现实世界...

    2018-04-07
  • 4个关键词总结,如何把用户体验做到极致?

    作者:@烧包鹿全文共 4530 字 6 图,阅读需要 10 分钟———— / BEGIN / ————上周五约了朋友吃晚饭,提前约的顺风车。由于堵车,司机到了办公区的北门。经过沟通,我从定位地点过去找他。四扇车窗都是开的,他坐在驾驶位,烟刚抽了三分之二,后视镜旁还有未散尽的烟雾。他回头看见了我,我朝他微笑示意。确认了眼神,我是他的乘客。他马上把烟灭了,左手在空中挥了挥,右手向左转了一下空调按钮,抬起头在空中胡乱吹了几口气。隔着车窗看见副...

    2018-04-30
  • 【技术篇】AR应用交互设计时需要思考的3个问题

    首先我们要了解,AR增强现实通过实时的在现实环境中渲染虚拟数字信息,通过现实和虚拟的结合来帮助用户完成某项任务和活动。AR中的虚拟数字信息通过与现实环境以及用户的实时互动来向用户传递有价值的信息。相比“传统的”2D层面的交互(手机app,web等),AR可支持的是更加丰富的三维层面的交互方式;并且这种方式不再仅限于主动式的交互(点击,滑动)方式,它还包括用户行为的被动触发。本文将向大家介绍一些典型的AR应用以及它们的交互方式,并且和大家...

    2018-03-29
  • 国内大公司的交互设计实习面试经验总结

    沈天宇 :看着拉钩、脉脉上关于互联网岗位的信息,找一个交互设计的岗位几乎要面对100个人的竞争。想想我面前站着100个人,我要赤手空拳的打败他们,这画面简直不敢想。所以一开始我完全不知道我到底能找到一个什么样的工作,大概有一种「大爷赏口饭吃」的姿态去找实习。毕竟,我们实验室也好几年没出过阿里的人了,我也感觉我没那么优秀。面对如此严峻的就业形势,恩,首先还是开始找实习吧。这是一个最坏的时代,(一点也不好。),而且也许以后会更坏。对于找工作...

    2018-02-01
  • Excel表格常用快捷键大全之1-10个

    为了小伙伴能更懂Excel 快捷键的具体使用场景,小雅不是单纯的像网上看到的一堆快捷键堆上去就好,做了更详尽的解释,希望大家能喜欢!收藏一下,记住些Excel常用快捷键还是不错的!善用快捷键,新手到高手的蜕变!不废话,进入正题,本篇是1-10个快捷键,后续会陆续为大家呈现更多的Excel快捷键。第一,插入工作表默认情况下,我们新建一个Excel文档,只有3个工作表。3个sheet,即sheet1,sheet2,sheet3。如果这三个s...

    2018-03-17
  • 不好意思,简历有了它,你就领跑于820万毕业生

    又临近一年毕业季找工作成为了应届生们的头等大事但今年的就业形势依旧不容乐观来自教育部的数据2018年全国高校毕业生预计上升至820万人再创近10年毕业生人数新高▲教育部官网截图▲中商产业研究院数据显示:2010-2017年的毕业生人数按照2%-5%的同比增长率逐年增长,近7年间累计毕业生人数达到5706万人。年年都是“史上zui难就业季”并且每年的毕业生人数始终呈增长态势800多万的应届毕业生让“你竟是一个大学生”变成“你只是一个大学生...

    2018-03-27
  • 12个关于用户体验的界面设计细节

    点击上方"工信商务培训学校"↑文章列举了一些界面设计中的案例细节,希望对产品设计工作有所帮助。UI设计工作中,设计师们往往不喜欢将界面设计得与原型图一致,总会刻意的去寻求存在感与原型做出差别,那么对于UI设计师来说,更应该懂得用户体验,成为办个用户体验设计师。以下列举了一些界面设计中的案例细节,希望对设计师们有所帮助。一.图标1.统一图标的样式图标在界面设计中还是占着较大的比重,它的存在有利于平衡界面,也让页面看起来更加的美观,也有一定...

    2018-04-06
  • 【优秀作业展示】交互设计基础(一)

    《交互设计基础》是学习交互设计的重要课程,在大三上学期开课。任课教师是工业设计系的华梅立老师,通过老师的认真指导和对该课程的学习,大家对交互设计有了进一步的了解,在老师的引导下,同学们对高铁取订票界面设计进行了深入的分析和再设计,并选取了感兴趣的小方向进一步拓展。接下来就看看学完本课程后同学们的优业。优秀学生作业第一期周亦辂产品设计1511高铁取订票界面设计色彩选取字体:冬青黑体字号:18、21、24、28、30、32、36风格:利用从...

    2018-04-04
  • Axure RP 8 入门手册 – 第7章

    第7章母版管理第1节母版简介第2节添加/编辑/删除第3节添加母版到页面中第4节从页面中移除母版第5节拖放行为第6节自定义触发事件第7章母版管理第1节母版简介圆儿:小楼欧巴!小楼:圆圆好!圆儿:老师,我就一个圆!小楼:可是我喜欢两个圆啊!圆儿:老师…你正经一点儿好不好嘛!小楼:呃……你想问什么?圆儿:我想问,在做很多个页面的时候,如果每个页面中都有相同的内容,有没有办法不用每个页面都做一次?当然,我知道能够复制粘贴,但是,如果将来再发生改...

    2018-04-25