美文网首页产品设计
【数据界面】web端流量分析优化

【数据界面】web端流量分析优化

作者: 俏皮和汉子 | 来源:发表于2019-03-23 17:59 被阅读251次

为什么优化?

【整合】优化数据产品浏览体验中,提到云台助手app中本店数据和行业数据相割离,让用户无法方便的比较分析得出洞察。

同类数据的不同维度割离的问题,在web端数据产品中也存在,本篇尝试用相同思路整合优化。

注:为求清爽,优化页未使用原页面风格。

1.整合本店和行业

当前数据易道的行业数据集合展示在付费工具【竞争分析】中,而在其他版块未有任何露出。本流量分析页面仅展示本店单一维度的指标数据,没有任何参考信息,不利于用户分析。

其次,当前可视化图表中,将不同衡量单位指标融合展示,更会加剧用户的困惑感,降低其理解信息的速度。

Figure1.1 当前页面

优化页,针对单一指标增加更多维度:本店往期、同行对比,帮助用户比较分析。

Figure 1.2 优化后:整合本店和行业


2.内容转换:跳转→弹框

现阶段查看承接商品为跳转交互,但按钮较小不易被发现,且缺失导航指引(此页不在左侧导航栏中,页面上也无面包屑导航),让内容间的层级不分明,联系感很弱。

Figure 2.1  当前页面为跳转切换点击,来源明细    Figure 2.1  跳转至承接商品

为加强页面间的联系,优化页将原跳转页面改为遮罩弹框,点击叉号或遮罩处取消,突出内容层级,转换更灵活。

Figure 2.2  优化页面为弹框


3.指标:无差别平铺→可选择查看

原页面将所有指标平铺展示,通过横向滚动查看,体验较差。优化后将收集在下拉浮层中,用户自行选择想查看的信息。

Figure 3.1 当前页面通过滑动查看更多指标 Figure 3.2 优化页面用浮层收集指标并分类,用户可根据需要有选择的查看

4.图表:可点击的饼图→Tab样条形图

当前页面用饼图展示各类页面间的访客数差别,并通过右侧列表展示各大类的具体url流量明细。但此设计存在两个问题

1)此饼图与色块标注排布在两部分,用户视线将反复上下移动比对,浏览较为不畅。且饼图对于展示细微的面积差别较为困难,不利于比较。

2)饼图中的色块是可点击的,通过点击可切换页面类型查看。但此饼图并未给出任何可交互的线索,而让此功能被忽略,妨碍用户查看更多细节。

Figure 4.1 当前页面

针对此两点我的优化方案是

1)用条形图替代饼图,并用纵向列表明确表达各类页面的流量排序。

2)用tab切换不同页面,此展示方式更符合用户一般习惯,不易被忽视。

Figure 4.2 优化页面

更多

更多控件状态细节如下。

Figure 5 控件

相关文章

  • 【数据界面】web端流量分析优化

    为什么优化? 在【整合】优化数据产品浏览体验中,提到云台助手app中本店数据和行业数据相割离,让用户无法方便的比较...

  • 滑动时候警告:Unable to preventDefault

    移动端Web界面滚动性能优化 Passive event listeners 最近更新了ios11.3,项目上发现...

  • 【商业化分析】QQ音乐商业化模式分析

    以下分析的内容数据来源为2017.07.01止的最新qq音乐的web端、ios端,网易云音乐的web端、ios端。...

  • 前端黑科技:美团网页首帧优化实践

    前言 自JavaScript诞生以来,前端技术发展非常迅速。移动端白屏优化是前端界面体验的一个重要优化方向,Web...

  • 移动开发中的一些术语

    A端是开发界面B端是商家界面C端是用户界面 A端就是后台,管理员所接触的界面。B端就是浏览器界面,依托于web界面...

  • 移动端滚动体验提升:passive event

    直接先贴一个链接有比较详细移动端Web界面滚动性能优化: Passive event listeners 总结一下...

  • iOS 底层原理:界面优化

    界面优化无非就是解决卡顿问,优化界面流畅度,以下就通过先分析卡顿的原因,然后再介绍具体的优化方案,来分析如何做界面...

  • iOS 底层原理:界面优化

    界面优化无非就是解决卡顿问,优化界面流畅度,以下就通过先分析卡顿的原因,然后再介绍具体的优化方案,来分析如何做界面...

  • Web缓存分析

    前言 不论是在移动端还是前端,web缓存(Http缓存)都是很重要的一部分。在移动端,对于用户流量控制的优化,we...

  • 网站分析实战

    本书主要讲,如何对网站的流量内容做数据分析,给网站优化提供建议,数据分析方法论和指标篇幅占比比较大。 分析方法上,...

网友评论

    本文标题:【数据界面】web端流量分析优化

    本文链接:https://www.haomeiwen.com/subject/jyvsvqtx.html