• 以指代步
社交账号登录
  • 首页
  • 博客
  • 模板
  • 源码
  • 壁纸
  • 视频
  • 软件
  • 文库
  • 学习
  • 创作中心
  • 关于我们
  • 招兵买马
  • 联系我们
  • 法律申明
  • 合作招商
  • 注册
  • 粉丝
  • 关注
  • 创作
  • 万字拆解!12306产品设计全方位深度解析

  • 在路上 2023-02-11 01:02:52 收藏
  • 文章标签: 用户 功能 乘客
  • 万字拆解!12306产品设计全方位深度解析

    有人说它是全世界最牛逼的 APP,因为它的算法难度和春运期间访问量几乎是全球之最;但有人说它是全世界最垃圾的 APP,因为在使用这个产品的过程中,遇见很多奇葩、愤怒的体验。关于这两种说法,众说纷纭,本期设计大侦探,就来全面拆解铁路 12306APP,一起来看看这个产品到底是如何设计的,用户体验如何。

    往期拆解:

    上线即爆火!3600字完整拆解微信键盘的产品设计

    微信键盘发布啦!

    阅读文章 >

    一、导读

    1. 内容结构

    全文 9700 字,分为六个部分,分别是导读、产品画像、出行服务、内容服务、思考总结和后记,你可以通过下面的思维导图对本文内容快速的了解。

    万字拆解!12306产品设计全方位深度解析

    2. 适合人群

    第一类,UI/交互设计师,可以跳出执行层,全方位体验 12306 的产品设计,多维度去思考和总结如何规避类似的陷阱;第二类,产品经理/运营,通过全面的产品设计拆解、体验反馈,获取产品设计参考;第三类,旅游及出行相关行业从业者,通过对 12306 的全面拆解,获取竞品设计参考。

    万字拆解!12306产品设计全方位深度解析

    3. 分析模型

    第一个,增长模型。由戴夫·麦克卢尔提出,包含用户获取、用户激活、用户留存、获取收入、用户推荐,分别对应用户生命周期中的 5 个重要环节,主要用于拆分和分析产品的功能价值。

    第二个,尼尔森十大可用性原则。尼尔森十大可用性原则是界面设计中最基础、最重要的设计原则,任何产品的设计,都可以通过这十个原则进行指导设计。尼尔森十大原则包括即系统可见性原则、环境贴切原则、撤销重做原则、一致性原则、防错原则、易取原则、灵活高效原则、易扫原则、容错原则、人性化帮助原则,通过这十大原则,可以对 12306 的产品设计体验进行全面的校验和侦查。

    用超多案例,帮你掌握尼尔森十大可用性原则

    尼尔森设计原则是人机交互学博士 Jakob Nielsen 于 1995 年发表的“十大可用性原则”。

    阅读文章 >

    第三个,设计心理学。包括常见的格式塔原理、费茨定律、巴甫洛夫反应、7±2 效应、席克定律等常见设计基础理论。

    万字干货!15个著名的设计心理学原理和应用深度解析!

    “除非有更好的选择,否则就遵从标准”你是否有在听别人说某某原理法则时一脸懵 B 的时候?

    阅读文章 >

    万字拆解!12306产品设计全方位深度解析

    二、产品画像

    1. 产品介绍

    铁路 12306 是中国铁路客户服务中心推出的官方手机购票应用软件,主要为全国各地的乘客提供火车票预定、机票预订、汽车票预订等购票业务,首个版本发布于 2012 年 10 月 16 日,根据易观千帆数据,截止到 2022 年 10 月,12306 月活跃用户人数 6,923.78 万。

    万字拆解!12306产品设计全方位深度解析

    2. 用户画像

    铁路 12306 的用户群体主要以男性用户居多,占比 65.04%,女性占比 34.96%;从年龄分布看,以 24-30 岁的用户群体最多,占比 36.52%,31 到 35 岁的用户占比 24.23%,36 到 40 岁占比 20.27%,41 岁以及以上占比 10.30%;从用户消费能力看,中高消费者占比 33.48%,中等消费者占比 30.43%,高消费者占比 14.70%;从地域分布看,新一线城市用户最多,占比 27.93%,一线城市占比 19.93%,二线城市占比 19.00%,其中广州用户最多,其次为深圳、杭州和北京。

    万字拆解!12306产品设计全方位深度解析

    3. 信息结构

    铁路 12306 的一级菜单包含首页、出行服务、订单、铁路会员和用户中心。「首页」主要为用户提供火车票、飞机票和汽车票的购买,其次还提供各种快捷功能入口和酒店预订等服务;「出行服务」主要为用户提供约车、酒店、订单等服务;「订单」是可查询和管理在 12306 的各种订单;「铁路会员」是 12306 的会员版块,提供车票兑换、会员活动等内容;用户中心提供个人资料管理、出行向导和常用功能等内容。

    万字拆解!12306产品设计全方位深度解析

    4. 重要迭代记录

    根据七麦数据统计,铁路 12306 的 APP 首个版本发布于 2012 年 10 月 16 日,截止到 2023 年 1 月 12 日,APP 版本已经更新至 V5.6.3 版本,近一年版本更新次数为 5 次。

    版本重要迭代记录

    2021 年 9 月,发布 V5.4.0 版本,新增无障碍功能、老人及障碍人士购票更便捷,即爱心版;

    万字拆解!12306产品设计全方位深度解析

    5. 产品生命周期

    作为中国铁路客户服务中心的官方购票平台,铁路 12306 距离首个版本发布时间已经过去 10 年。从易观千帆数据观察,截止到 2022 年 10 月,12306 月活跃用户人数 6,923.78 万,日均活跃人数 811.65 万。由于是国有企业运营,而且是垄断业务,12306 没有任何商业变现的压力,从产品发布时间和活跃用户人数看,目前处于产品生命周期的成熟期。

    万字拆解!12306产品设计全方位深度解析

    6. 竞争图谱

    截止到 2022 年 10 月,易观千帆数据显示,铁路 12306APP 在苹果的 APP Store 应用市场 APP 总排名 71 位,旅游类排名第一,汽车火车船票预定类第一,月活跃用户人数几乎是其他 APP 的总和。

    万字拆解!12306产品设计全方位深度解析

    三、出行服务

    作为 12306 最核心、最重要以及实现商业变现的服务,出行服务主要为用户提供火车票、飞机票的销售,其次还链接了众多第三方合作伙伴,为用户在出行的各种场景提供了便捷的服务。

    万字拆解!12306产品设计全方位深度解析

    1. 票务

    「票务」是 12306 最核心的服务,主要为用户提供火车票、飞机票和汽车票的查询以及销售,其次 12306 还对三种产品进行了组合,推出了空铁联运、铁水联运这样的服务。

    ① 火车票

    「火车票」就是为用户提供火车和动车的票务销售,用户输入出发站、终点站和时间以后,就可以进行查询,其次还支持对已购买的车票进行变更到站、改签和退票。

    1)售票

    售票页

    当用户输入目标站点以后,就进入了售票页。在这个页面,可以看到当天列车的所有车次,包括直达、中转、出发时间和剩余票数。在底部,有一个菜单栏,包含了筛选、耗时最短、发时最早、显示票价和候补下单五个功能,这主要是帮助用户快速寻找符合自己需求的车次,比如出发车站、出发时间等。

    万字拆解!12306产品设计全方位深度解析

    体验陷阱

    这个页面的操作体验不太友好,底部的菜单栏不仅没有实现全屏手机设备的兼容,而且几乎和背景的元素贴合在一起,不够醒目,如果用户不注意,根本无法发现底部竟然还有一排菜单栏帮助用户进行高效的检索。

    订单页

    在用户选择好车次以后,就进入订单页。用户需要选择座位的系别,包括硬座、软座、二等座、一等座、特等座等。

    万字拆解!12306产品设计全方位深度解析

    用户需要选择乘车人。添加乘车人的步骤比较简单,在输入用户的真实姓名、身份证号码和手机号码以后,即可添加成功。首次使用12306的用户需要进行身份核验,用户需要通过验证系统发送的核验信息才能添加成功。

    细节侦查

    「姓名」这里有一个非常友好的设计体验,那就是针对无法输入的生僻字、名字超过 30 个字符,以及外籍用户的极端情况都给出了详细的指导,针对用户可能出现的极端的情况给与及时的提示,这就是尼尔森十大原则中的容错原则,帮助用户从错误中恢复,将损失降到最低。

    在「选择乘车人」的右边,还有一个「选择受让人」的功能。这个功能有很高的学习成本,会让用户摸不着头脑。我也是通过百度查询才了解到这是一个用户权益功能,它主要是指用户可以把平时购买火车票获得的积分转让给指定的用户,积分又可以抵消火车票款,从而实现抵扣。

    万字拆解!12306产品设计全方位深度解析

    选择好乘车人以后,用户可以进行选座,就进入了提交订单、支付费用的环节。

    支付页

    订单生成后,用户需要在付款限定时间内支付火车票费用,否则订单将会取消。其次在支付页,也向用户推荐相关的保险服务,比如铁路乘意险,又分为平安险、行运险和顺意险,主要为乘客提供意外伤害疾病身故等保险。

    万字拆解!12306产品设计全方位深度解析

    「购买返程」其实一个非常便捷的功能,但12306设计的层级太深了,而且没有加上一键返回首页或订单页的按钮,用户如果想退回到订单页或首页,需要不断点击返回,操作路径实在太长。

    万字拆解!12306产品设计全方位深度解析

    体验陷阱

    底部菜单设计了三个按钮,违反了费茨定律的设计原则。用户在这个支付页的主要目标是支付费用,但是菜单栏的三个按钮权重设计得一样高,取消订单和购买返程这两个按钮,严重干扰了用户的选择,降低了操作效率。

    支付成功页

    当用户支付成功以后,「支付成功页」为用户提供餐饮预订、出行保险、酒店入住、网络约车等服务,非常便捷。不过内容的规划比较乱,体验稍差。

    万字拆解!12306产品设计全方位深度解析

    候补下单

    「候补下单」是一个非常方便的功能,这个功能主要解决在当前车次没票的情况帮助乘客自动排队,如果有其他乘客退票,就自动抢票,非常贴心。这个功能也被誉为黄牛的终结者,帮助乘客自主排队。

    2)变更到站

    「变更到站」是指乘客可以更改目标站点,进入订单详情页后,点击「变更到站」按钮,点击底部的「立即变更到站」就可进入变更页面。在变更页面,乘客可以重新输入目标站点,然后再次进入车票售票页,选中需要变更的车次以后,进入订单页提交订单,变更成功。需要注意的是,变更到站只能办理一次。

    万字拆解!12306产品设计全方位深度解析

    体验陷阱

    当用户点击「变更到站」的时候,如果不注意观察页面,根本感受不出原来需要在底部菜单栏进行操作,会让乘客陷入焦躁,不知道下一步从哪里进入。其次在变更到站页面,下半部分设计了很多快捷入口,比如车站大屏、约车、餐饮特产等,把用户的注意力分散了。这两个设计都严重了违反了费茨定律和席克定律,大大降低了用户的操作效率。

    3)改签

    「改签」是指用户可以更改出行的时间,改签的流程和「变更到站」相似,进入售票页后,选中需要变更的车次,进入订单页提交订单,改签成功。需要注意的是,车票改签只能办理一次,开车前 48 小时以上,退票费为票价 5%,24 小时至 48 小时之间为 10%,不足 24 小时为 20%。退票费最少 2 元起步。

    万字拆解!12306产品设计全方位深度解析

    4)退票

    「退票」是指用户可以退掉已经购买的车票,退票流程比较简单,点击退票后,进入退票确认页,点击确认退票成功。需要注意是,距离开车前 8 天以上的不收退票费,其他的时段将会根据列车开车前的时间收取手续费,最高 20%。

    万字拆解!12306产品设计全方位深度解析

    迭代建议

    在用户点击退票的时候,应该出现弹窗,再次提醒用户是否确认退票,这样能避免用户误操作。这就是尼尔森十大原则的容错原则,帮助用户从错误中恢复,将损失降到最低。

    5)购票后

    当乘客购买车票后,12306 的首页会加入一个行程的版块,向用户展示最近的行程详情,其次一级菜单栏「出行服务」内容也会同步更新。这个设计非常友好,直观醒目地告诉乘客最近的行程信息,通过外部触发避免乘客忘记行程。

    行程页

    这个页面从上至下包含四个部分,头部是乘客详细的车次信息,比如出发时间、经停站、天气等;中间是车票信息,包含检票口、座位号、车次和乘车二维码等信息;接下来按乘客出行前服务、车站/列车服务和到达服务三个场景为乘客推荐其他服务,比如餐饮预定、酒店预定等服务;底部是关于出发站、到达站的天气预报信息和优惠服务等信息。

    万字拆解!12306产品设计全方位深度解析

    细节侦查

    行程页把乘客的出行拆分为 3 个场景,出行前服务(提供重点客户预约、我要选酒店、我要去车站、我要订餐饮和禁带物品规定)、车站/列车服务(提供临时身份证证明、遗失物品查找、我要订餐饮和站内导航)和到达服务(遗失物品查找、我要订酒店、接站约车、旅游景点预定、投诉建议和站内导航),这就是以场景为中心的设计——将设计工作的焦点从“定义系统的操作”转变到“描述什么人将使用该系统去完成什么任务”。

    ② 飞机票

    「飞机票」就是为用户提供飞机的票务销售,用户需要输入出发站、终点站和出发时间,如果携带孩子或者婴儿,还需要单独勾选。飞机票同样支持改签和退票。

    1)售票页

    售票页的内容非常简单,在头部,用户可以左右滑动选择时间,页面内容以 Feed 流向用户展示详细的航班信息,其次还为用户提供了其他出行方案参考。底部设计了一个菜单栏,用户可以进行筛选设置,还可以根据价格高低和出发时间排序。

    万字拆解!12306产品设计全方位深度解析

    2)选择舱位

    选中航班班次以后,进入到「选择舱位页」,在这个页面可以查看到航班的详细信息,比如航空公司、起飞时间、值机柜台等。用户需要选择舱位等级,比如经济舱、商务舱和头等舱,选中后,即可进入预订流程。

    万字拆解!12306产品设计全方位深度解析

    拓展阅读

    为什么同一架飞机同一个经济舱飞机票价格不一样?这是因为一个飞机的不同舱位实际上是不同的产品,所以座位有不同的等级,故而价格有了出入。其次他们主要的区别包括但不限于退票改签的灵活程度、出票期限和目的地停留期限等等。

    3)订单页

    在订单页,可以查看到订单的详细信息,包括收费说明、退改说明等,在用户添加乘客以后,就可以提交订单。这里需要注意一下,如果乘客携带孩子或婴儿,需要添加儿童出行人。

    万字拆解!12306产品设计全方位深度解析

    体验陷阱

    当乘客勾选了「携带儿童或婴儿」的选项以后,在订单页准备支付的时候,系统提示乘客需要返回添加儿童出行人信息。但却并没有告诉乘客如何添加,或直接给出对应的功能跳转链接,这让用户点击「返回添加」后却找不到功能入口。这就违反了尼尔森十大原则的防错原则,不仅在用户犯错之前没有给出提示,犯错了还不给与指导,真的非常糟糕。

    ③ 汽车票

    「汽车票」为用户提供客车的票务销售,用户输入出发站、终点站和时间以后,就可进入售票页。汽车票的订单流程非常简单,在选中客车车次以后,添加乘客支付费用后,订单即可生成。

    万字拆解!12306产品设计全方位深度解析

    体验陷阱

    用户在选择「达到地」搜索框输入地名时候,应该提供模糊搜索,比如输入湖南的地名,应该为用户提示相关联的车站。

    ④ 空铁联运

    空铁联运,顾名思义就是把飞机和高铁这两个产品组合在一起销售,支持用户一站式购买“飞机+高铁”的联运行程,只需一次购票、一次支付。这个功能的使用场景主要是针对出发地和目的地没有直飞的航班情况下,为用户提供飞机+高铁的转运方案。这个功能对于乘客来说,支持一站式购买“飞机+高铁”车票,可以节省购票时间,非常友好。

    万字拆解!12306产品设计全方位深度解析

    ⑤ 铁水联运

    和空铁联运一样,这也是一个组合产品的销售,支持用户一站式购买“高铁+水运”的联运行程。使用场景、功能价值以及操作流程和空铁联运一样,我们就不必重复。

    万字拆解!12306产品设计全方位深度解析

    ⑥ 雪具快运

    12306 还推出了一个雪具快运的服务,为广大旅客提供多种个性化雪具寄送产品服务,还支持随车办理或上门办理寄送服务,目的是为用户打造滑雪的新体验。「雪具快运」的操作流程也比较简单,采用预约制,选中服务后,填写用户详细信息,支付成功后,订单生成。

    万字拆解!12306产品设计全方位深度解析

    ⑦ 小结

    作为 12306 最重要、最核心、最复杂的功能,从这个版块的内容拆解和实操体验来看,可以看出 12306 确实已经解决被誉为全世界最复杂的抢票算法逻辑(笔者通过实操测试,几乎都能买到票),特别是在春运这种会出现超过上亿用户抢票场景,真可谓非常不容易。不过从用户体验来看,非常一般,甚至有很多不合理的设计。

    2. 出行

    出行是 12360 结合了乘客在出行的场景中潜在产生的需求设计的服务,有结合车站商家的在线点餐,有结合当地地域特色的旅游服务,还有约车、保险、酒店等服务。这些服务,多数由第三方合作方提供。

    ① 餐厅特产

    「餐厅特产」是一个为乘客提供在线点餐的服务,在乘客输入列车车次以后,就可以进行点餐,支持外卖配送至列车和到店自取两种形式。这个功能设计得很友好,不仅解决乘客在乘车前的就餐问题,为车站的商家引流,还可以增加平台的变现方式。

    万字拆解!12306产品设计全方位深度解析

    ② 铁路游

    「铁路游」是 12306 结合旅游出行的场景,为乘客推出的一项旅游服务,包含旅游专列、跟团游、周末游和自由行等。这个场景的链接其实非常好,但是版块目前设计得比较简单,内容也比较少。

    万字拆解!12306产品设计全方位深度解析

    ③ 约车

    「约车」是为乘客提供接送站、接送机、打车和租车的服务。这是一个强刚需的需求,用户在出行的前后都有用车服务。为乘客提供约车服务,不仅能增加变现方式,还能方便乘客出行。通过实操体验,约车主要由第三方合作方提供服务,比如曹操出行、T3 出行等公司,为乘客提供出租车、品质专车和商务车等车型。

    万字拆解!12306产品设计全方位深度解析

    ④ 保险

    保险分为乘意险和出行保险。铁路乘意险分为平安险、行运险和顺意险,主要为乘客提供意外伤害疾病身故等保险,在乘客购买铁路的订单页就会向乘客推荐,乘意险价格低,保障项目包含意外身故、伤残、医疗费用、住院津贴等。出行保险由第三方公司中国太平洋保险提供,主要为乘客提供出行安心保、空铁联运险和旅程预定取消险。

    万字拆解!12306产品设计全方位深度解析

    ⑤  酒店

    酒店这个版块的内容相对夯实,不仅有新客大礼包这样的用户权益,还有商旅专区、今夜甩卖、高端酒店这样的内容。甚至还设计了专门的酒店会员 VIP,包含普通会员、银卡会员、金卡会员、白金卡会员和黑金卡会员,相对其他版块而言,这个版块花了比较多的心思。

    万字拆解!12306产品设计全方位深度解析

    ⑥ 铁路商城

    铁路商城是 12360 以乡村振兴·帮扶推介为主题打造的一个商城,包含了帮扶专区、优选好物、兑换专区、今日特卖等内容,其次还支持企业集采,批量购买。

    万字拆解!12306产品设计全方位深度解析

    ⑦ 小结

    从这个版块,可以看出 12360 其实结合了用户吃穿住行的刚需场景设计了对应的服务,有自主运营也有完全依靠第三方提供。不过整体的用户体验比较差,事实上可以参考像顺丰速运、智联招聘这些 APP,通过内置小程序的形式来设计,完全可以把这些版块让第三方单独设计和维护,同时还能为用户带来更好的体验。

    3. 会员

    铁路畅行会员是中国铁路统一对外会员服务品牌,开通畅行会员不需要花钱,畅行会员主要是用于会员用户积累乘车积分、用积分兑换车票等,主要包含积分权益,兑换车票、无票候补和会员活动四大会员权益。这个页面设计得比较简陋,也没有太多价值的内容,可以看出 12306 在用户运营方面比较欠缺。

    万字拆解!12306产品设计全方位深度解析

    4. 订单

    12306 的订单包含了火车票订单、餐饮订单、保险订单、酒店订单、空铁联运订单、计次定期票订单、约车订单、出站引导服务订单、铁路商城订单、汽车票订单、旅游订单和铁水联运订单多达 12 种订单,从这些订单类型可以看出 12306 的服务特别多。

    万字拆解!12306产品设计全方位深度解析

    体验陷阱

    这个设计实在太糟糕,严重违反了 7±2 效应。琳琅满目,花枝招展,让用户在这个页面几乎迷失。更糟糕的是,当你有一个非常重要的待支付订单,这个页面竟然没有角标提醒,最终你会因为这个糟糕的设计打乱自己的行程计划。

    四、内容服务

    内容服务是帮助产品实现用户留存和运营的版块,不过从 12306 的内容设计来看,整个产品的运营手段比较少,所以我把 12306 现有设计的功能拆分为便捷功能和向导功能。

    万字拆解!12306产品设计全方位深度解析

    1. 便捷功能

    以下这七个功能,对用户而言,是非常便捷、友好的功能,可以帮助用户在出行的旅途中获取很多帮助。

    ① 车站大屏

    「车站大屏」是一个非常贴心的功能,通过这个功能,可以为用户提供车站的实时列车信息,非常方便。大屏详情页可以拆分为三块内容,左上角可以切换全国各地的火车站,头部还有搜索框,为用户提供车次的查询,主体内容是当前车站向西的车次信息,包含发车时间、候车室、检票口和候车状态等。

    万字拆解!12306产品设计全方位深度解析

    1)车次详情页

    进入列车的「车次详情页」,可以查看当前车次的完整信息,比如检票状态、候车室、检票口和全程停靠站、停留信息。在这个页面,还提供了「关注列车」的功能(关注后并无关注数据,显得很鸡肋),以及直接预订当前车次的入口。

    万字拆解!12306产品设计全方位深度解析

    2)车站详情页

    「车站详情页」就像一个站点的主页,为用户提供完整的车站信息查询。这个页面可以拆分为四块,头部可以切换其他站点,并提供当前车站的天气情况以及车站基础信息。金刚区位 8 个功能入口,包含车站车次、站内导航、重点旅游、餐饮服务、周边酒店等。中间是当前车站的起售时间和换乘时间,底部是车站附近周边的酒店精选。

    万字拆解!12306产品设计全方位深度解析

    迭代建议

    这个页面把车站当做一个主体,聚合了一个车站完整的功能,其实挺有创意,但页面隐藏得很深,如果不去拆解,几乎很难发现,很是可惜。我认为完全可以提高权重,升级为一级栏目,代替会员,或者和出行栏目进行整合升级。

    ② 站内导航

    「站内导航」提供目标车站的 LBS 导航,对于乘客来说,到达一个陌生的站点,需要清晰的指引,这是一个非常便捷、温馨的功能,能帮乘客解决很多问题。不过这里有一个莫名其妙的设计,那就是进入这个功能之前,系统提示请摇“8”字校准手机,事实上这里是一个加载动画,但是画面和内容却误导了用户,我甚至每次进入都傻乎乎的摇动手机。

    万字拆解!12306产品设计全方位深度解析

    ③ 临时身份证

    临时身份证是一个非常重要的功能,12306 现在支持 APP 在线申请,极大方便了乘客的出行。申请流程也比较简单,填写个人信息,验证审核通过后,就可以生成电子证照使用。每个人每个月有 3 次申请临时乘车身份证机会。

    万字拆解!12306产品设计全方位深度解析

    ④ 遗失物品

    这是一个非常贴心的功能,如果你在乘车的过程中不小心丢失物品,可以通过这个功能登记,输入你的详细信息就能登记成功。

    万字拆解!12306产品设计全方位深度解析

    ⑤ 重点旅客

    这也是一个非常贴心的功能,主要为老年人、残疾人服务,通过填入你的信息,列车会根据你的情况提供优先进站、协助乘降等服务。

    万字拆解!12306产品设计全方位深度解析

    ⑥ 爱心版

    爱心版就是长辈版,专门为中老年用户设计的版本,在用户中心切换后就可进入爱心版。整个版本设计得非常简洁,操作步骤也比较简单,对中老年用户比较友好。

    万字拆解!12306产品设计全方位深度解析

    ⑦ 英文版

    英文版在用户中心的设置点击语言即可切换,整体的版本设计得直接简洁,用户体验不错。

    万字拆解!12306产品设计全方位深度解析

    ⑧ 小结

    从这个版块可以看出,一个产品如果以用户为中心去设计,是可以为用户带来很大的便捷和愉悦体验。比如像临时身份证这样的功能,过往我们只能提前出发去车站排队办理,但如今 12306 已经把这样的痛点解决,为用户节省了大量的时间。

    2. 向导功能

    以下 8 个功能,虽然属于出行向导,不过体验下来,感觉用户体验比较差,很多功能完全无法弄懂它的设计目的是什么,显得非常鸡肋。

    ① 快捷退票

    「快捷退票」这个功能的设计,让人摸不着头脑。从操作流程看,首先需要输入用户的详细信息,包括姓名、身份证号码和手机,其次需要进行人脸核验,到了第三步还需要选择车票的日期车次,在最后的退票操作页面,用户点击退款后,没有和用户再次确认就直接退票。整个流程体验下来,非常糟糕。

    万字拆解!12306产品设计全方位深度解析

    体验陷阱

    这个功能和订单页的退票感受不出来有何区别?如果用户要退款,不如直接去订单页进行退票,操作步骤简单,一目了然。其次不支持自动导入用户的购票信息实在太不方便,需要通过选择车票购买日期和车次,这个设计实在让人生气和愤怒(我在体验的过程中到了第三步只能退回到订单页把购票日期和车次截图下来,又再次重复前面两个步骤才到这个步骤)。

    ② 联系方式

    这也是一个看不懂的功能,进入页面后,需要用户输入乘客的详细信息,但是这个乘客信息和用户在购买车票时候需要添加到乘客信息有什么不同?更糟糕的是,当你把自己的电话号码、身份证信息填入后,系统会显示核验成功,然而当你再一次进入,页面内容还是和之前并无区别,你不知道自己是不是还要重新输一次?

    万字拆解!12306产品设计全方位深度解析

    ③ 时刻表

    「时刻表」主要为乘客提供查询列班车次的出发时间和到站信息,但这个功能「车站大屏」几乎已经包含了,这个功能显得意义不大。

    万字拆解!12306产品设计全方位深度解析

    ④ 查票价

    这个功能非常鸡肋,因为在火车票的售票详情页就可以清晰直观地查询到列车票价信息,相反在这个页面,根本无法看到价格,因为价格的字体大小只有 20px,乘客几乎很难注意到。

    万字拆解!12306产品设计全方位深度解析

    ⑤ 查代售点

    这个功能主要为用户提供全国各地火车票代售点的查询,不过在互联网技术发展到今天,火车票代售点越来越少了。从 12306 采集的信息来看,部分代售点缺少电话等关键信息,对用户来说,比较鸡肋。

    万字拆解!12306产品设计全方位深度解析

    ⑥ 起售时间

    这个功能为用户提供各车站每日的起售时间,属于一个低频功能,可以解决乘客某些极端场景的需求。不过在我体验下来,比如通过此功能查询 1 月 29 日的车票,显示北京站起售时间为 10:00,但是在火车售票版块,我也可以直接购买 1 月 29 日的车票,这让我比较疑惑这个功能的价值在哪里。

    万字拆解!12306产品设计全方位深度解析

    ⑦ 正晚点

    「正晚点」同样是一个鸡肋功能,而且还需要输入准确的车次才能进行查询,车站大屏已经完美可以取代这个功能。

    万字拆解!12306产品设计全方位深度解析

    ⑧ 列车状态

    「列车状态」比正晚点都还鸡肋,让人愤怒,因为你需要输入正确的出发地、到达地和出发时间,对了,还有正确的车次才能进行查询,这样的操作成本比下载 12360APP 都还麻烦。

    万字拆解!12306产品设计全方位深度解析

    ⑨ 小结

    从这个部分的内容拆解和操作体验来看,12360 的产品设计得不够细致和贴心,很多功能就像是硬生生塞进去一样,滥竽充数。其次从他们的产品迭代记录次数可以看出,近 1 年更新时间只有 5 次,也许每一次都是在做加法,没有想过做减法,所以导致这部分的功能显得鸡肋而且有很大缺陷。

    五、思考总结

    通过对铁路 12306 的全面拆解,接下来我将从内容层、功能层、体验层和视觉层进行总结。

    1. 内容层

    12306 整个产品的内容设计,用一句话总结,可以归纳为——心有余力而不足。可以看到12306围绕乘客购票、出行的潜在需求场景都设计了对应的服务,比如酒店、约车、点餐、商城等,甚至还有空铁联运、铁水联运这种多场景的组合售票方式,不过在实际的版块内容打造中,则显得比较空洞,体验一般。这个产品,可以说几乎没有创新点,这主要也是由于它是由国有企业设计运营,背景极其复杂,设计目标也飘忽不定。

    2. 功能层

    在 2015 年之前,铁路 12360 承担了被誉为历史上人口迁移最大的春运的抢票工作,那时候一票难求,春运去 12360 就像是一场噩梦。不过在经过多年的升级和优化以后,目前 12360 的购票效率非常高,经过笔者多次的测试和调研,目前通过 12360 购票已经不再是难事。而且还设计了候补抢票这样的功能,帮助用户解决买票痛点,可谓非常贴心、友好。

    3. 体验层

    铁路 12306 的用户体验,非常一般,我在这次的产品拆解中至少侦查出了 20 条体验陷阱,这些陷阱都会给用户带来极其糟糕和愤怒的体验。比如让我像个傻瓜摇动手机的站内导航载入页,这完全就是把用户当成傻子一样看待,其次还有一堆数不清的鸡肋功能,对用户的操作体验造成了严重的干扰。我甚至认为爱心版和英文版比标准版使用起来更愉悦,更能减少我的焦虑。

    4. 视觉层

    作为一个 UI 设计师,在拆解 12306 的产品过程中,我对整个产品的设计感到绝望。首先,没有做到统一性,整个产品毫无设计规范,比如卡片的圆角、品牌色、版块间距根本不统一,这样的视觉体验一眼望去就非常糟糕;其次,图标、活动图、橱窗图以及详情页的设计毫无美感,满满的山寨 APP 风格,特别是订单页的 ICON,花花绿绿、琳琅满目,连最基础的统一都没有做到。

    六、后记

    作为一款国民级用户 APP,铁路 12306 仿佛陪伴了 80、90 后的青春。还记得 10 年前老家是黑龙江和河北的大学室友,每年春运开启之前就为了回家的火车票犯愁,不仅要去遥远的火车站排队,很多时候还可能空手而回,那便是最初对 12306 的记忆。

    如今十年过去了,12306 解决了亿万人的出行抢票需求,让我们在春运的路上,可以轻松购买一张回家的票。但下一个十年,我更希望 12360 的产品团队,可以重视用户体验设计,让我们不再掉入那些体验陷阱。

    参考文献:

    1. 易观千帆-铁路 12360APP 数据分析
    2. 七麦数据-铁路 12360APP 数据分析
    3. 中国铁路 12306 官网
    4. 尼尔森十大原则
    5. 《设计的陷阱:用户体验设计案例透析》- 乔纳森·沙利亚特

    欢迎关注作者微信公众号:「设计大侦探」

    万字拆解!12306产品设计全方位深度解析

    本篇来源:优设网

    原文地址:https://www.uisdc.com/12306-app

    评论
    Artlist模板 广告