一、实验目的

本实验依托前序《浏览器市场与用户画像分析-数据加工》实验产出的各类统计数据表，借助助睿Max数据大屏工具，完成浏览器市场行为分析可视化大屏的搭建与制作。

通过本次实验，能够熟练掌握数据可视化大屏的完整搭建流程，具体习得核心能力如下：

1. 结合实际业务分析问题，完成大屏整体布局规划与适配的数据图表选型；

2. 熟练将前期清洗、聚合完成的业务数据表接入可视化平台，实现数据联动展示；

3. 独立制作可交互、可视化效果完整的数据大屏，并基于大屏展示数据提炼有效的业务分析结论。

二、实验环境

本次实验依托助睿在线实验平台开展，核心使用助睿数智（Uniplore）一站式数据科学平台完成可视化大屏制作，平台可实现数据接入、ETL数据处理、机器学习建模、可视化展示的全链路零代码操作，适配数据分析教学实训与企业实际数据加工场景，平台官网：https://www.uniplore.com/。

1. 实验操作平台：助睿在线实验平台 https://lab.guilian.cn/

2. 核心可视化工具：助睿Max（数据大屏可视化工具）

三、实验数据

本次实验无需重新处理数据，直接复用上一实验已加工完成的大屏一（市场行为分析）目标聚合数据表，围绕浏览器行业核心维度，聚焦浏览器市场格局、用户使用行为、时段使用偏好、产品竞争关系四大核心方向开展可视化分析。各模块指标、展示组件及关联数据表明细如下：

模块	子模块	指标项	组件	关联数据表	备注
数据概览	浏览器市场	总使用时长	指标卡	browser_coverage	所有用户累计使用时长（小时）
		人均使用时长	指标卡	browser_coverage	总使用时长 / 覆盖用户数（小时/周）
		活跃用户占比	指标卡	browser_coverage	周活跃用户数 / 覆盖用户数
		重度用户占比	指标卡	browser_frequency_stats	使用时长>10小时/周的用户占比
市场格局	用户规模	用户数	柱状图	browser_coverage	展示6个浏览器用户数
	使用规模	使用时长	饼图	browser_coverage	展示各浏览器使用时长占比
	使用粘性	人均使用时长	柱状图	browser_coverage	-
用户行为	时间趋势	周活跃趋势	折线图	browser_weekly_active	展示第1-4周各浏览器活跃用户数变化
	使用习惯	使用频率分布	堆叠柱状图	browser_frequency_stats	轻/中/重度用户在各浏览器的占比
	时段偏好	全天时段24小时活跃分布	折线图	browser_hourly	X轴为小时，Y轴为活跃用户数，不同颜色代表不同浏览器
用户行为	周内对比	工作日vs周末使用时长	分组柱状图	daily_browser_detail	对比工作日和周末的浏览器使用时长差异
竞争关系	使用数量	浏览器使用数量分布	饼图	browser_multi_usage	展示用户使用1种/2种/3种及以上浏览器的比例

四、整体分析框架

4.1 核心业务分析问题

本次大屏搭建围绕浏览器行业运营分析的核心业务痛点设计，通过可视化图表直观解答各类业务问题，实现数据赋能业务分析，具体对应关系如下：

核心业务问题	对应分析维度
哪个浏览器用户数量最多？哪个浏览器用户使用时长最长？	市场格局分析
用户整体活跃度呈现增长还是下降趋势？	周活跃趋势分析
用户使用浏览器的活跃高峰时段是什么时候？	时段偏好分析
用户对浏览器属于重度使用还是偶尔使用？	使用频率分析
用户日常会同时使用几款浏览器产品？	浏览器使用数量分布分析
主力浏览器用户还会使用哪些竞品浏览器？	竞品重叠、竞争关系分析
用户工作日与周末的浏览器使用习惯是否存在差异？	工作日vs周末使用对比分析

4.2 大屏设计原则

本次数据大屏遵循标准化、可视化、业务化的设计思路，整体逻辑清晰、层级分明，具体设计原则如下：

1. 叙事逻辑清晰：严格按照从上至下、从左至右的浏览顺序设计，遵循“先整体概况、后局部细节，先趋势分析、后数据拆解”的叙事逻辑，符合用户阅读习惯。

2. 核心指标突出：在大屏顶部核心位置放置数据概览指标卡，集中展示总使用时长、人均使用时长、活跃及重度用户占比等核心关键数据，直观呈现整体业务概况。

3. 图表适配数据：根据不同数据特性匹配对应图表类型，趋势类数据使用折线图、对比类数据使用柱状图/分组柱状图、占比分布类数据使用饼图，保证数据展示直观易懂。

4. 视觉统一规范：为6款主流浏览器设置固定专属配色（IE蓝、Chrome红、360绿等），全程统一色系，降低视觉识别成本，提升大屏美观度。

5. 支持交互操作：配置浏览器筛选功能，支持查看全部浏览器数据或单一浏览器细分数据，满足多维度精细化分析需求。

4.3 大屏布局草图

本次大屏布局参考标准可视化大屏版式设计，整体分区规整、模块独立，各分析模块分区排布，兼顾美观性与实用性，具体布局参考官方示范草图及成品展示效果。

五、实验步骤

登录助睿在线实验平台后，点击平台左侧菜单栏“数据大屏”选项，即可进入助睿数据大屏可视化子平台。该平台是低代码可视化搭建工具，无需编程，通过拖拽式操作即可制作专业数据大屏，适用于业务监控、数据展览、趋势分析等多种场景，具备丰富组件库、多数据源适配、自定义样式、蓝图高级编辑等核心能力，广泛应用于各行业数据分析场景。

5.1 新建空白数据大屏

1. 进入数据大屏平台

2. 点击页面“+新建”按钮，选择“新建大屏”功能；

3. 在模板选择界面，选用“空白模板”，自定义大屏搭建画布；

4. 在名称输入框中填写大屏名称“市场分析”，点击下一步，系统自动跳转至大屏编辑制作界面，完成大屏初始化创建。

5.2 大屏基础样式设置

5.2.1 背景样式设置

大屏所有素材图片均通过oss-browser存储调用，本次实验所需素材链接已统一整理，可直接复用。进入大屏编辑页面后，右侧为页面设置面板，默认画布尺寸为1920×1080，可根据展示设备灵活调整。复制指定背景图链接，粘贴至“背景图片”输入框，替换默认背景，其余页面参数保持默认即可，完成大屏整体背景设置。

5.2.2 顶部标题设置

1. 在左侧组件列表中找到“媒体”分类，添加“单张图片”组件至画布，右键将组件重命名为“标题banner”；

2. 选中组件，在右侧基础属性面板调整图片长宽、位置等参数，复制官方指定标题图片链接，替换组件默认图片资源；

3. 完成设置后点击保存，可随时点击预览按钮，查看标题展示效果，确保样式合规、显示正常。

5.2.3 导航跳转设置

为实现多屏联动跳转，本次实验配置双大屏导航按钮，具体操作如下：

添加“单张图片”组件，重命名为“市场分析按钮背景”

粘贴导航背景图片链接，调整组件大小与位置

在左侧文字组件中添加“通用标题”，重命名为“市场分析”

匹配背景组件的尺寸与位置

修改标题文字、字体、字号及颜色

刷新数据完成文字渲染

点开文本样式，可以设置字体、字号、颜色和粗细

完成效果如下

复制整套导航组件

分别重命名为“用户画像按钮背景”和“用户画像”

调整横坐标位置，修改文字内容与样式，区分当前页面选中状态与其他页面未选中状态；

刷新组件数据，保存并预览效果

最后选中所有顶部标题、导航组件，右键选择“成组”

命名为“顶部”，方便后期统一管理。

5.3 内容布局与各模块样式搭建

根据大屏布局草图及参考效果图，依次搭建各个数据模块，每个模块统一采用「区域背景图+标题背景图+通用标题+数据图表」的组合形式，保证整体版式统一。

5.3.1 浏览器用户数模块制作

添加单张图片组件作为模块区域背景，调整尺寸位置

粘贴对应背景链接

再次添加单张图片组件作为短标题背景，适配模块布局；

添加通用标题组件，设置标题为“浏览器用户数”，调整对齐方式、字体样式；

选取“基础柱状图”组件

重命名为“浏览器用户数柱状图”，调整图表大小位置

开启图例居中展示

微调图表边距优化展示效果

将该模块所有组件编组，命名为“浏览器用户数”

保存当前页面设置

预览

5.3.2 浏览器使用时长占比模块制作

复制“浏览器用户数”整体组件组，重命名为“浏览器使用时长”

拖拽至指定布局位置，刷新组件数据避免内容空白；

修改模块通用标题为“浏览器使用时长”，删除原有柱状图组件；

添加“多维度饼图”组件，调整大小位置

取消饼图外圈展示

开启类目标签显示

为6款浏览器依次配置专属色值，统一视觉规范，将饼图纳入组件组后保存设置。

5.3.3 浏览器人均使用时长模块制作

复制已有模块组件组，重命名为“浏览器人均使用时长”

调整摆放位置

刷新数据

修改模块标题内容，保留原有柱状图组件并完成重命名；

微调图表样式、边距，保证整体版式协调统一，保存模块设置。

5.3.4 数据概览指标区制作

复制基础模块组件组，重命名为“数据概览”

调整整体组件尺寸

替换长款标题背景图，修改模块标题

删除原有柱状图组件，添加装饰图标图片组件，配置对应图标素材链接；

添加数据翻牌器组件

分别搭建总使用时长、人均使用时长、活跃用户占比、重度用户占比四大指标卡，逐一修改标题、后缀、字体样式及对齐方式；

总使用时长配置如下

之后其他指标卡替换对应指标图标素材，微调所有指标卡位置，将各指标组件分别编组，完成数据概览区域搭建。

5.3.5 工作日vs周末使用时长模块制作

复制基础模块组件组，重命名为“周内对比”

调整布局位置、刷新数据；

替换长款标题背景图，修改模块标题为“工作日vs周末使用时长”；

删除原有图表，添加“分组柱状图”组件，调整尺寸与样式

自定义系列柱图颜色，完成模块样式优化并保存

其他样式参考：

5.3.6 24小时活跃用户数分布模块制作

复制周内对比模块组件组，重命名为“24小时活跃分布”

整摆放位置并刷新数据

修改模块标题为“24小时活跃用户数分布”

删除原有分组柱状图

添加区域图组件，参考规范色值调整图表样式，优化可视化展示效果，保存设置。

5.3.7 浏览器周活跃用户数变化模块制作

复制已有模块组件组，重命名并调整布局位置，修改模块标题，替换为对应趋势图表组件，微调样式参数，完成周活跃趋势可视化模块搭建。

5.3.8 浏览器使用频率分布模块制作

复制基础模块组件组，重命名为“使用频率分布”，调整位置与标题，将图表替换为垂直基本柱图，适配使用频率数据展示需求，优化样式后保存。

5.3.9 浏览器使用数量分布模块制作

复制上一模块组件组，重命名为“浏览器使用数量分布”，修改标题与布局位置，替换为基本饼图组件，调整饼图展示样式，完成竞争关系模块搭建。

所有模块搭建、样式调整完成后，整体保存大屏设置，预览完整大屏展示效果，完成本次静态大屏布局全部操作，后续可通过蓝图编辑器完成数据接入与动态联动。

六、实验总结

6.1 实验收获

1. 掌握可视化大屏搭建全流程：本次实验从零完成了数据大屏的创建、样式美化、布局排版、图表配置、组件管理等全套操作，熟练掌握了助睿Max数据大屏的拖拽式搭建方法，学会了空白大屏的初始化、素材资源配置、组件重命名、组件编组、样式微调等基础操作，具备了独立制作可视化大屏的能力。

2. 掌握图表与业务数据的适配逻辑：深入理解了不同数据维度对应的可视化图表选型规则，明确趋势数据、占比数据、对比数据、指标数据分别适配的图表类型，能够结合浏览器市场分析的业务场景，合理搭配图表，让数据展示更贴合业务分析需求。

3.建立规范化的大屏设计思维：掌握了“先整体后局部、先趋势后细节”的大屏设计逻辑，学会统一大屏配色、版式、组件样式，注重可视化作品的美观性、逻辑性和实用性，同时了解了大屏交互设计的基础思路。

6.2 实验平台整体评价

助睿数智（Uniplore）一站式大数据智能服务平台整体适配教学实训场景，实用性与易用性极强，是适配数据分析学习的优质平台。平台采用零代码、拖拽式操作模式，无需掌握编程知识即可完成数据可视化大屏搭建，操作门槛低、上手速度快，非常适合数据分析初学者入门实训。

平台功能体系完整，覆盖数据接入、ETL处理、AI建模、可视化展示全链路功能，组件库丰富多样，包含各类常规图表、可视化素材、交互组件，能够满足多样化的数据分析与大屏制作需求。同时平台支持自定义样式、素材导入、组件编组、交互筛选等功能，兼顾基础教学与进阶实操需求。

此外，平台界面简洁清晰、功能分区明确，操作逻辑贴合用户使用习惯，组件复用、一键刷新、编组管理等功能大幅简化了大屏制作流程，有效提升了实验效率。整体稳定性良好，能够顺畅支撑教学实训、数据加工、可视化分析等各类场景，不仅可以满足课堂实验学习需求，也能贴合企业基础数据可视化的实操场景，教学实用性与落地性兼备。