博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
新版百度地图界面背后的故事
阅读量:6005 次
发布时间:2019-06-20

本文共 1446 字,大约阅读时间需要 4 分钟。

 在2009年8月,Web版百度地图进行过一次大的改版,当时凭借着百度得天独厚的搜索优势,和地图简单易用的亲和力,在一个合适的时机,Web版地图市场占有率升至60%~70%,一直处于国内市场份额第一的位置。除了一些当时的环境因素外,产品本身的设计细节也决定了百度地图最后的成功与否。 

交互与视觉设计探索

在设计的过程中尝试了多套方案,每个小的细节的改变都有可能产生更大的进步。以公交方案结果页为例,主要目的就是要让用户第一时间,快速的获取最主要的路线信息,但也有很多辅助信息(如时间、距离、价格等)来更好的给用户以参考,为了便于人们在第一时间了解到不同方案路线,整体采用区块化的视觉展现形式,并将关键性的站点名称和车次名称突出显示,辅助性的参考信息居右弱化显示。通过颜色和图形形成一定的视觉层次,引导用户方便快速的提取各类信息。

问题

在使用百度地图的过程中,也会存在着一定的问题,通过多次的用户调研分析,调查问卷、眼动实验和沟通访谈等等,了解用户在使用过程中存在的真实问题。

新版界面改版的目标和结果

2010年末,决定重新设计百度地图界面。一是要解决现有存在的问题,二是要增强百度地图的功能和美化界面,进一步的提升用户体验,并为今后的发展打下一个良好的基础。

在交互设计上:通过简单易用的操作界面,让人们更加便捷的获取路线信息和地点信息,同时提供强大丰富的功能来满足人们日常生活中衣食住行的各种需求。

在视觉设计上:通过视觉语言,给人们营造出一种美观和简单可依赖的视觉感受,让人们在使用的过程中感到舒适和放松,努力使用户觉得是一种享受。

2011年7月,百度地图做了一次较大的变化,侧边栏从之前的右边移到了左边,同时将搜索标签移到了下方。经过2周的小流量测试,通过后台的数据分析、用户调研分析,很可惜最终得到的结果不完全是正面的。在收益并不明显,流量略有下降的情况下,还是决定保留已有的交互框架结构。

新的交互设计、视觉风格探索

在经过之前的一次改版尝试后,决定在现有大的结构基础上,进行新的交互和视觉设计。

灵感

在夏天的时候,有机会去参观了原研哉的设计展,对下面这幅无印良品宽广的广告留下了很深的印象,感觉非常的大气、清新和简单,后来在想是否能够把这样的感觉也融入到百度地图的界面当中。

新的交互设计

整合梳理工具栏,同时便于扩展
增加地图百宝箱(地图应用)
首页增加分类信息
收藏夹位置变化

新的视觉设计

文化习惯——秉承百度简单可依赖的文化理念,传达给人简单的感觉。
自身特点——作为工具性产品,给人以舒适放松的感觉。同时百度作为国内知名企业,要给人以专业、权威的感觉。
产品定位——传达给用户简洁、清新、现代、精致的感觉。

规范的制定

这次在设计的过程中,制定出了一套有效完善的设计规范,与开发人员密切配合,形成控件库,并最终做成网页版。不但缩短了开发时间,便于今后的查找使用,还使地图更加的规范和体系化。

结语

因为篇幅原因,只是大致的描述一下整个的过程,其中还有很多的故事和细节。这次改版的过程也有些曲折,但恰恰是这些大胆的试错,才能证明所做的决策是否正确,而不是对一些问题总是心存纠结,仅仅停留在主观判断的阶段,just do it。此外,这次整个的设计流程非常值得学习。

百度地图2009~2012

 

 

【本文首发于:】

 
本文转自百度技术51CTO博客,原文链接:http://blog.51cto.com/baidutech/775492
,如需转载请自行联系原作者

 

你可能感兴趣的文章
Riverbed发布SteelFusion 5.0,对NAS存储提供支持
查看>>
BTA | 朱佩江:Pallet项目,“细腰”链通互联网价值体系
查看>>
如何用App工厂一键生成电商应用 4步骤获得属于你的应用
查看>>
机器学习+云服务,一种互惠互利的结合物
查看>>
布局出行服务,大众集团还需更谨慎
查看>>
Android性能分析工具简介
查看>>
C#上位机串口控制12864显示
查看>>
制造不同尺寸纳米晶体新方法,或将用于生产柔性彩色显示屏
查看>>
Android Studio工具修理集
查看>>
SpringBoot使用WebJars
查看>>
easyapi
查看>>
Markdown中超链接增加_blank的方法
查看>>
机器人都能造飞机了,你还在呼呼大睡?
查看>>
linux 内核的链表操作(好文不得不转)
查看>>
《泛在服务 ,平台创新》移动电商生态研究报告
查看>>
JVM学习系列:了解JVM options参数配置 & 看懂GC日志
查看>>
12C 对表分区维护的增强
查看>>
算术运算表达式正则及分析
查看>>
linux tcpdump
查看>>
如何实现文件增量同步——算法
查看>>