iOS端 12306重设计

自12306官方APP诞生的那一天起,就注定了它要饱受诟病。截至目前,苹果的iTunes上1493条评分,综合后的分数接近于1星。虽然主要的问题还是集中在开发身上,不过APP界面设计仍有些过于随意,有很多需要补足改进的地方。

本文针对目前的官方APP,就如何明显提高用户的购票效率及便捷性加以分析及改进。部分吐槽可能会有些激进,望您理解~

车票预订界面

存在问题
  1. 首页查票的作用被标题下四个功能严重干扰,而且放在了占据重要位置的顶部,反而成了四不像,这四个功能完全可以放到个人中心界面中。

  2. 出发日期、时间及席别的排版过于随意,根本没有对齐,而且为什么出发时间和席别行距搞那么大呢,三者本身属同一层级。

  3. 乘客为什么又突然换了个橙色,而且还独占一行局左,包括常用线路也同样局左,界面空白并没有合理利用。

  4. 底部的标签栏蜜汁灰底白字,如果以图标+文字的方式呈现会相对更为直观清晰。

改进
  1. 四个略显尴尬的功能放到了个人中心。

  2. 以增强代入感的纸质票的形式将必要元素呈现给用户,调整层级关系。

  3. 底部以开口线性icon+文字代替。

  4. 弱化了最近常用线路,并且重新布局。

车票预订界面

时间/地点选择界面

存在问题
  1. 状态栏信息颜色不知道为啥和标题颜色不一样,很脏,降低辨识度,看着很闹心。

  2. 车站选择采用了tab式分组,虽然增加了用户短期记忆的负担,但这不是重点,重点是用户无法通过滑动手势切换页面,只能用手指一个一个的戳!

  3. 出发日期界面痛点同上,戳戳更健康。

改进
  1. 状态栏信息颜色正常了(包括后面的界面)。
  2. 地点信息和日期信息各自整合到一个页面中,卡片式分组,再也不用戳了。
时间/地点选择界面

车次界面

存在问题
  1. 导航栏下的“前一天”btn与“返回”离得太近了,用户很容易误操作。

  2. 底部的工具栏干扰了车次信息的正常浏览。

  3. 每个车次距离太近,显得很拥挤,部分非必要信息可以去除。

改进
  1. 时间btn位置做了调整。

  2. 底部工具栏整合到了右上方菜单中。

  3. 卡片式布局车次,车次内部层级调整,清晰直观。

车次界面

订单确认界面

存在问题
  1. 时间在预订及车次界面已双重确认,订单界面中显得很多余。

  2. 底部的蜜汁工具栏没有必要放在这里,多余。

  3. 订单信息层级关系不明显,另外添加乘客突然居中了,但看着还是闹心。

改进
  1. 去除了一切多余的信息

  2. 添加了学生票btn,重新调整了订单的层级关系,用户识别起来更快、更容易。

订单确认界面

支付界面

存在问题
  1. 这部分界面过于反人类,跳转页面太多了,增加用户记忆负担。

  2. btn太多了,很多不必要信息都一股脑网上放,支付完成界面还有个订餐服务而且还是首位,很难理解,可能是觉得用户花费大量精力购完票肚子会饿,可是。。。

3.支付完成界面订单详情内容直接在订单详情页中可以查看,多余。

改进
  1. 将支付方式整合到了确认支付页中,减少用户记忆压力。

  2. 去除了一切多余的裹脚布。

支付界面

订单详情界面

存在问题
  1. 终于到了最让人吐血的界面了。。。一个订单你需要犹如大海捞针一般查找,而且为啥要在tab下加个日期?

  2. 终于找到了订单,如果想要改签或退票还得继续12306的官方特色——戳,而且为啥又加了个订餐呢??

  3. 订单内部信息层级混乱,价格又诡异的用了醒目的红色,看着闹心。

改进
  1. 将有用的信息整合到一页中,提高用户查看速度。

  2. 订单内部信息层级调整,订单状态分别以红绿色代表待支付和待出行,同时在左侧加上竖条,直观易识别。

  3. 改签和退票通过ios特有的侧滑方式呈现。

订单详情界面

个人中心界面

存在问题

越写越激动,感觉有点止不住了- -镇静一下

  1. 个人中心看着很累。。。而且很多比较有用的功能藏在了“信息服务”的子界面中,过于隐晦。

  2. 纯红的New提示。。。不知道如何吐槽了

改进
  1. 用九宫格布局排列菜单,icon+文字,用户可以更快的获取信息。

  2. 只保留了常用功能。

个人中心界面

最后,很感谢你看完我的这些吐槽和建议,欢迎一起探讨交流!

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 202,980评论 5 476
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,178评论 2 380
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 149,868评论 0 336
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,498评论 1 273
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,492评论 5 364
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,521评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,910评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,569评论 0 256
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,793评论 1 296
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,559评论 2 319
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,639评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,342评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,931评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,904评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,144评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,833评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,350评论 2 342

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 171,380评论 25 707
  • 使用sketch最重要的一点是设计好控件的规范。 为做好设计规范需要对色彩进行编号,比如:color_a”_1,c...
    youyeath阅读 26,104评论 2 237
  • 写给在PHP道路上迷茫的你 第一次听说PHP是在去年的一次同学聚会上,来自于化工学院的我,只在大一的基础课上学过一...
    骑士恨煎蛋阅读 220评论 0 0
  • 自从拜到了黄小仙的门下,我成了一只快活的小妖。他是典型的金牛座,金牛座的人踏实稳重,作为我的师傅,我能说经历过的好...
    郝志阳阅读 692评论 2 0
  • 阳光明媚,风和日丽。春悄悄地来到了我们每个人的身边。刷朋友圈的时候看到了一条关于风车的活动。那是他所在的城,因为喜...
    夙殇阅读 373评论 8 13