恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
自由行页面改版设计
0.0°
2015-04-07 原创文章 经验/观点 原作者: 原作者 举报 2583 7 4 0

自编自译,英文原版请见本人博客:http://belle-m.tumblr.com

去年11月底,本人刚刚换了新工作,携程旅游事业部,仍然是视觉设计师。

在一系列的和公司视觉规范统一风格的小修小改中,我领悟到本人作为一名“死美工”继续跟着大部队这么走,貌似解决不了根本问题。

因此我打算自己编写一份用户测试,分析目前界面里出现的问题。同时也可以治治自己的懒癌,把设计博客赶紧写起来。那么现在开始:

自由行界面改版设计:搜索 & 浏览 & 订购 (上篇)

任务:

目的:通过浏览订购流程找出界面痛点
目标用户:经验丰富的海外旅游爱好者,灵活出游控制预算的国内旅游爱好者。(测试5人,目前3人已完成测试。)
具体任务目标:为2个成年人订购一份12天行程,从上海到拉斯维加斯的自由行
测试平台:(iOS)6.2版本,(Chrome)手机端 6.3版本 (以下截图均截自chrome平台)

有顺序的任务测试:

1. 以拉斯维加斯作为目的地进行搜索。

2. 浏览多个旅游项目然后选择一个自由行项目。

3. 自定义一个2个成年人,12天,去拉斯维加斯游玩的自由行行程

4. 订购12天内的往返机票和酒店住宿

测试过程:

1. 以拉斯维加斯作为目的地进行搜索。

入口一:首页 - 搜索页 - 搜索结果页

入口二:首页 - 旅游首页 - 搜索 - 搜索结果页

入口三:首页 - 旅游首页 - 自由行首页 - 搜索- 搜索结果页

2. 浏览多个旅游项目然后选择一个自由行项目。

3. 自定义一个2个成年人,12天,去拉斯维加斯游玩的自由行行程

4. 订购12天内的往返机票和酒店住宿

痛点记录:

·  搜索的入口非常多,但每个都有些不同。

·  有时候城市名后面有国家缩写代码,有时候又没有。

·  在同一个目的地的情况下,选择了某个相似的行程,进入了行程详情页,需要修改行程长度和人数的时候,却找不到可以修改的地方。必须要返回上一级从自定义行程的入口进入才能选择。

·  对于国内游客来说,在行程详情页,想找到签证信息或者特别需要注意的事项非常困难。

·  “在我进入行程确认页后,要想修改行程长度和酒店日期是一件非常困难的事,酒店的选择是分了好几页的,需要进入到最底层然后一步一步确认才能修改成功。”

·  “我非常想知道,当我选择出境游的时候,我第一天选择的酒店入住日期是否是我当天航班落地的日期,目前没有看到任何提示”

·  “当我修改行程长度为12天的时候,我只选择了一家酒店,那么为什么酒店入住时长还是1天,他们应该是一起变化的吧”

·  “我在手机端搜索输入的时候,都是直接打字,直接按确认的,很少看提示词语,但是当我这样做之后,我找不到任务里说的旅游项目,却到了一个目的地介绍页面,但在这个页面又没有旅游项目可以选择。”


搜索 & 浏览 & 订购 任务中的分析:

用户:期望通过信息中的行程/目的地特色,行程长度,价格,来快速选择旅游项目

有哪些是我们可以在短期内考虑提升的:

在以上的测试,任务1搜索行为中,测试用户除了一些小困扰(例如城市名称有无国家代码,搜索联想词提示),基本可以完成这步任务。需要做的是对此过程的细节改善。

任务2中,行程详情页的用户体验有些问题,行程特色看不到很有吸引力的地方,还缺少一些国内游客必须知道的签证信息和其他建议。需要改善的有信息优先级和交互结构。

任务3、4中,如果一开始日期没有选择正确,修改行程长度对用户来说是很困难的操作。短期内可以考虑先将此入口放在行程详情页中,后期需要调整交互结构。

其他可以参考的观点:

最近读过robbin写的一篇文章《移动互联网创业还需要做APP吗?》,他里面的一些观点我觉得比较有意思,这里截取一些。

“用户常用的APP不超过5个,微信、淘宝、点评,新闻阅读就差不多,你的APP要想挤占用户的使用时长,也是非常困难的事情。”

“如果我们把一个完整的互联网产品(无论是PC Web产品,还是APP产品)的用户交互界面抽象再抽象,抽象到最后,就是三个界面:首页(首屏),列表页,详情页(着陆页)。这三个页面是不可或缺的,否则产品就是残缺的。”

“但在微信公众号里面,你做的HTML5应用,首页点击率是很低的,列表页几乎没有点击,只有详情页才有大量的点击,而且详情页几乎没有来自于列表页的点击,99%都来自于从微信朋友圈分享直接访问。”

“HTML5产品自己的首页和列表页本来是承担详情页入口和导航作用的,但是在微信里面,微信的产品架构就承担了详情页的入口和导航作用了,首页和列表页已经没有存在的意义了。微信的产品架构和信息组织架构决定了,你只需要做详情页,每个或者每组详情页完成一个独立的功能,并且在每个或者每组详情页内部完成所有的用户交互。”

可以考虑排期迭代的计划:

根据测试结果,和微信用户的习惯(这一部分用户也刚好是我们的目标用户),这里做个简短的概括:

1. 当前的界面展示信息的时候,是从资源持有者的逻辑来展示的,所以在信息架构方面需要重塑。当用户想随便逛逛的时候,一层一层的界面加上复杂的信息架构,使他们非常容易迷失在某个层级中。

2. 在同一个目的地的旅游行程中,如果提供的行程长度不是用户的第一选择,那么修改/自定义行程的需求优先级应该是这样的顺序:出行时长(航班往返日期),酒店住宿时长,具体的酒店,具体的航班,出行人数。

1关注的点集中在内容和信息架构上,2与信息架构也高度相关,但关注的点更多集中在信息元素和交互行为上。

本文参考:

[1] Usability Test on Quora: Browse & Search Results 
https://medium.com/new-media/usability-test-on-quora-browse-search-results-392f4587eaf3

[2] 移动互联网创业还需要做APP吗?
http://zaodula.com/archives/13487.html?weixin_user_id=2aofE_IjkQdQmrTdB08rERMhbI_9YM

下篇会集中讲根据本次测试结果和结论推导出的设计过程和结果,尽请期待!

本文仅是作者最近在整理设计方法的具体实践,如果有不合适的地方请指正。英文版请见本人博客:http://belle-m.tumblr.com/post/115655670094/last-year-i-changed-my-job-at-ctrip-com-still-as

谢谢大家!

更新:2015-04-07

收藏

7人已收藏

BelleM

https://dribbble.com/Belle_M

  • 10

    作品

  • 38

    粉丝

  • 7

    关注

  • 自由行页面改版设计 - 交互动效展示
  • 自由行页面改版设计 (下篇)
  • RICOHCam UI
  • 2014 个人标识—— 作品集准备
相关标签

    猜你喜欢

      2015-04-07 原创文章 经验/观点 原作者: 原作者 举报 2583 7 4 0

      自由行页面改版设计

      0.0°

      你确定要举报自由行页面改版设计

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2015年04月07日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      4
      7
      0

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录