美团往返机票流程重塑

用户头像
深圳/设计爱好者/5年前/11090浏览
美团往返机票流程重塑

本文旨在对美团机票预订流程重塑的探索,仅作为学习交流~



前言

 

本文将站在用户的视角,对美团交通页面发起改版,通过产品分析、用户访谈、构建用户体验地图等形式,深入了解用户需求,找到改版思路。

 

近年来,在线交通预定市场的交易规模在不断增长,人们的出行也越来越依赖在线交通App的各项功能,相信下面这些场景你一定遇到过:

1、和闺蜜计划旅行时,打开App看看近期的机票;

2、马上要登机了,打开App扫码登机;

3、近期有出行计划,手机负一屏自动弹出提醒;

 

这些功能的出现改变了人们的出行方式,也让我们开始反思产品的功能是否能够在每一个环节方便到大家。

 

 

分析调研

 

数据显示,在线机票预订主要群体集中在20-39岁,其中男性占57.65%,女性占42.35%。机票预订基本与美团主要目标群体吻合。由此可见,机票预订业务可完美兼容美团交通平台。


undefined

 

在线交通作为重要预订入口,对于酒店住宿、度假旅游等细分领域具有显著导流作用。美团App庞大的用户规模并没有很好的助力在线交通类产品的业务增长。我们将从用户的视角,探索和发现产品机会点,对美团交通页面进行优化。

 

访谈


本次用户访谈分为:面对面访谈和调查问卷;

 

面对面访谈:本次访谈共采访6位目标用户,通过观察用户实际操作美团交通预订机票的流程,以及用户对各个页面的使用感受,初步了解用户在预订机票过程中的痛点和期望。


undefined

  

对每位用户采访的时长保持在30Min内。访谈中,尽可能避免出现引导和暗示的词语干扰用户,对用户的表情、动作、声音等举止信息进行及时有效的记录,便于后期绘制用户体验地图。

  

undefined

 

问卷调查:由于面对面访谈的目标用户存在局限性,因此,在收集到存在的问题后,需要进一步验证。 

undefined

 

当发现产品的问题点后,可以将问题点的内容提炼,并融入到问卷调查中。通过对目标用户发放问卷,可以在短时间收集大量数据,通过对问卷内容的统计,更好的验证用户访谈的痛点。


undefined

 


用户画像

 

通过前期的问卷调查总结,我们对用户进行了分类,并为每类用户创建角色模型,包括用户的基本信息,目标、动机、痛点。


用户体验地图

 

我们根据访谈记录和问卷得出用户购票习惯和操作路径,以叙述故事的方式描述用户在使用产品时遇到的痛点,从而提炼出产品设计上的机会点改进产品体验服务的一种产品分析方式。可以直观地了解到用户在使用的产品购票过程中的整体感受,帮助寻找新的机会点来提高购票过程中的用户体验,帮助用户实现目标,和确立优化产品功能的方向。   


undefined



分析调研总结



竞品分析及视觉输出

 

我们选取6个竞品(飞猪、途牛、携程、  航旅纵横、智行火车票、中国国航),针对3个主功能页(购票入口页、航班选择页、信息总览页),进行交互、功能等维度的分析对比。

通过对比交互的关键差异点,发现:

1、在购票入口页,用选项卡切换往返的方式,出现频次更高;

2、在选择日期界面,通过点击确认按钮退出,容错率更高;

3、在选择往返航班界面,当前页面同时预览往返航班,更便捷。

    

undefined

       

我们在保留美团自身特色的前提下,根据功能对比结果,建议优化方向:

1. 增加往返时间间隔、航班低价提醒、航班经停、餐食提醒等信息; 

2. 提炼标签,提高层级和阅读效率。      

undefined



登机入口

 

目前的美团交通,整合了火车、机票、汽车票,在视觉上采用三种颜色区分,加上顶部的运营Banner,导致页面首屏层级不清晰,视觉观感较差,用户在首页进入无法直接的进行操作,我们通过色彩降噪和层级优化两个方向进行了改版探索。



时间选择

 

在日期选择上,我们发现美团的流程逻辑较复杂:

 

1.用户从不同入口进入日期选择页,面临的选择流程不同。假设我们要完成往返日期选择这个目的,从返程日期进入日期选择页面。用户在当前点选去程Tab后,可以直接在一个页面里将两个日期都选择完。反之,如果用户直接在当前选择返程日期,还需要在操作后回到上一页,然后再重新进入,再选择去程日期。用户容易产生疑惑感,学习成本较高。

 

2.美团的日期选择有较多页面跳转,用户选择一个日期后自动跳回上一页,紧接着重新进入日期选择页,将返程时间选好。用户操作的连贯性不仅被打断,而且增加了用户误触成本,不符合交互减步长。


undefined

 

针对旧版的问题,我们在日期选择逻辑上进行了两点优化:

 

1.简化日期选择逻辑,用户第一次点选日期是修改去程日期,第二次点选即是在选择完去程中间没有页面跳转。用户易于理解,上手使用快。

 

2.允许容错,增加确认按钮,允许用户选择完往返日期后,再进行一次检查,减少误操作成本。   

   

undefined


在交互形式上,我们用弹窗取代了全屏。弹窗的跳转性较弱,用户在弹窗里即可不间断完成往返日期选择,达到沉浸式体验。

undefined

undefined


往返页面

 

1.针对原购票流程的页面跳转次数做了缩减;

通过将往返程展示在一屏内。

购票流程如下:

原版:去程——返程——机票预览3次页面跳转次数。

优化:缩减为去程/返程——机票预览 2次页面跳转。


undefined


往返一屏展示的好处在于:

1.用户在当前购票页面可直接往返对比选择。

2.允许用户修改机票选择,减少用户出错率造成行程时间点错误等经济损失。


2.多稿输出

在设计过程中,我们输出了多稿进行对比,通过雷达图对比优缺点,最终选择了第三稿。


undefined

 

3.增强趣味性,差异化设计;

将卡片流与检票闸式的轻拟物设计结合,利用恰到好处的轻拟物设计,有效的增加趣味性拉开与竟品之间的差异。


undefined

undefined 


往返预览订单


往返预览确定订单页,根据尼尔森F型视觉模型,用户首先按水平移动方式阅读内容区域上部分,接着用户视线向下移动页面,改变原版本的竖向信息布局,提高信息的阅读效率。其次在下单的底部增加品牌的品质承诺服务和信用背书,提升品质和保障服务性,有效的提升产品下单购买。   

    

undefined



登机牌


根据对用户问卷调研可知道,用户的出行目的旅游型用户居多。调查用户的出行目的,可准确的抓住用户的心理,从而能找到合适的场景进行搭建。 

      


利用4w分析了解真实用户使用场景,我们可以站在用户角度了解产品在使用过程中还有哪些提升空间,从而提升用户体验感。


undefined

 

智能场景是根据前期调研的魅力型功能和出行目的,进行模拟用户在订票流程中可能出现的情况。 


undefined

 

用户使用App在登机口展示登机二维码即可,无需再次打印纸质登机牌,减少用户时间成本。

  

undefined


登机牌展示(利用一维分析法拆分视觉层级、及时推送实时的天气,提前帮助用户建立认知,避免影响出行)


undefined 

undefined


4w总结:根据用户的旅行目的与体验感,结合用户需求,新增功能极大缓解了用户在登机过程中的焦虑感、减少了用户的时间体验成本。

 


全部页面

       

 

324
举报
|
442
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
加载中
推荐素材
钱包ui模板
盲盒APP UI设计
【新年UI图标】汽车icon
新拟态风格 UI设计组件库
Security Camera UI kit
抽象液态渐变UI背景模版
UI通用设计素材1
我的钱包-UI界面设计-app
UI应用平面图标
【新年UI图标】活动icon
【新年UI图标】钱包icon
【新年UI图标】旅行icon
拟物风质感写实UI卡片合集源文件
高级感金属拟物 UI设计组件库
【新年UI图标】秒杀icon
原创UIUX交互橙红渐变炫酷视觉平面设计作品集模板PSD
科技医疗透明柜UI界面设计
手表表盘UI系列
高级表盘系列UI源文件
智能家居中心 简约 UI设计组件库
UI 登录界面设计模板包
3D卡通UI界面图标可爱插画免扣素
UI界面 组件
新能源APP应用UIKit
你可能喜欢
相关收藏夹
EDC
EDC
EDC
EDC
EDC
84
大家都在看
登录注册