最新历史版本 :移动端模板制作指南 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

1. 概述编辑

在当今的移动办公环境中,移动端模板以其丰富的交互特性、即时的数据访问能力以及多样化的报表展示形式,为企业带来了便捷、高效和灵活的管理解决方案,正逐渐成为主流。因此,掌握移动端的模板制作与转换很有必要。

移动端的模板制作分为两种场景:

1)仅有移动端展示需求

2)PC 端和移动端都有展示需求

本文从两种场景出发为用户介绍普通报表和可视化看板的移动端模板制作指南。

1.1 仅有移动端展示需求

仅有移动端展示需求时,可直接制作移动端尺寸模板。例如,只需在移动端展示公司销售日报。如下图所示:

手机视频动图3.gif

1)普通报表

新建普通报表,点击菜单栏「模板>移动端属性」,勾选「设置为手机模板画布大小」,点击「确定」即可开始移动端模板制作,如下图所示:

2)FVS 可视化看板

新建可视化看板,设置画布大小自定义尺寸为常用移动端尺寸,如:390×844 px,点击「创建看板」便可以开始移动端模板制作,如下图所示:

1.2 PC 端和移动端都有展示需求

1.2.1 需求一致

PC 端和移动端模板所需展示效果一致时,可以共用同一张模板,只需将已有的 PC 端模板转换为移动端模板即可在移动端展示。

1)普通报表

打开 PC 端模板,点击菜单栏「模板>移动端属性」,勾选「设置为手机模板画布大小」。如下图所示:

点击「确定」后会弹出另存为弹窗,模板名称默认为「PC端模板名称_mobile」,如下图所示:

注:如果另存为弹窗选择「取消」,手机端模板功能不生效 。

2)FVS 可视化看板

打开 PC 端模板,点击「模板设置>移动端」,勾选「开启 移动端布局 」。如下图所示:

例如:电商销售实时大屏,PC 端和移动端所需展示效果一致。PC 端效果和移动端效果分别如下图所示:

    173.gif

    手机视频动图2.gif


    1.2.2 需求不一致

    PC 端和移动端所需展示效果、交互效果不一致时,需要分别制作 PC 端和移动端模板。

    注:移动端模板制作可参考本文档1.1节

    例如:xx集团经营管理驾驶舱,PC 端需要展示效果为深色,移动端需要展示效果为浅色。PC 端效果和移动端效果分别如下图所示:

    动图1.gif

    手机视频动图1.gif

    2. 制作与转换指南编辑

    应用场景帮助文档文档简介

    独立制作移动端模板

    • 只有移动端展示需

    • PC 端和移动端都有展示需求,但是 PC 端和移动端展示效果、交互效果不一致

    如何用App的思路设计移动端报表

    帮助用户运用 App 的设计思路,制作一张可随时随地查看和分析数据的移动端报表,使其更加符合移动设备的使用习惯和用户需求

    使用 PC 端模板

    PC 端和移动端都有展示需求,且PC 端和移动端模板的组件内容、样式基本一致

    普通报表:设置手机端模板

    FVS 可视化看板:FVS如何快速将PC模板转换为移动端模板

    帮助用户快速将 PC 端模板转换为移动端模板,需要注意的是,为保证一张模板在 PC 端和移动端均可正常浏览,在制作 PC 端模板时就需要考虑到移动端的显示效果