文章主要客观分析一下两个产品的交互和视觉!
视觉
本狮选择了路线详细页做分析比较。
-红蓝对比
红蓝、黄黑、蓝白对比是容易做出彩的几组颜色。这两个都主要采用红蓝对比。蓝色代表公交路线,红色代表地地铁路线。但发觉百度地图的两个主色在色彩的协调度上面并没有高德那么友好。特别是红色的是纵轴线与红色色块之间的相互关系,打开PS看了下色值,发现两个颜色跨越了好几个阶,跳跃度太大,再看高德的色彩选取上就平稳很多。
-利用色彩拉开层级
在iOS10的系统中,本狮最喜欢是下拉通知栏的改进。利用卡片的形式把功能模块化,层级关系清晰明了。同样的从这个角度出发去分析两个页面。
首先我们看下两张图片的布局,百度利用行程路径线把交通工具和路线详情分割开来,形成左右两块区域。高德把纵向内容横向显示,整体形成上下布局。第一层:利用色彩区分交通工具;第二层:卡片内利用颜色深浅区分标题和内容。可见,高德页面层级关系更明确。
-视觉顺序
信息排布影响到视线的浏览顺序。两个页面是两种不一样的阅读方式,谁能更快的捕捉信息呢?本狮认为还是高德,移动端的长宽比限制,从上到下的阅读速度是比Z 字型的阅读速度更快的,也更方便记忆。在用户使用地图时,最好的体验应该是:当下查询,当下记忆。
交互
针对显示详情到切换交通工具这个流程中,本狮发现了两个产品的操作流程有些许不同。
-百度
人们都会有突然改变交通工具的场景需求,当公交路线显示完全后,用户可以在当页通过导航栏自动跳转到步行的交通路线,灵活性更强。然而高德必须返回上一页面才能切换步行路线。
这种场景一般会发生在距离目的地较近的情况下,公交和步行都可取。
-高德
本狮也思考了为什么高德不这么设计。从页面设计能找到的答案是,高德突出的是到站提醒功能,以及同一个交通工具下不同路线的切换。
欢迎大家一起讨论!
详情请查看 https://www.zhihu.com/question/51634453/answer/126835197?from=profile_answer_card
网友评论