Dooring3.0可视化搭建平台使用指南

简介: Dooring3.0可视化搭建平台使用指南

来源: 趣谈前端公众号

image.png

H5-Dooring目前已经发布3.0版本, 从技术和产品功能上做了进一步的优化和迭代, 从2.0.0到3.0.0, 大大小小差不多迭代了100个版本, 接下来就和大家分享和介绍一下H5-Dooring以及3.0版本的一些变化.

H5-Dooring可视化搭建平台介绍

H5-Dooring是一款拖拽式制作web页面的工具, 它可以轻松帮我们制作灵活且功能强大的H5页面, 我们使用它几乎没有任何成本, 拖拽式的基础上还提供了丰富的组件, 让我们可以开箱即用. 不管你会不会编程, 都可以轻松使用它实现自己的H5制作需求:

image.png

这里我总结一下它的特点:

  • 所见即所得(实时编辑, 实时预览, 还支持多模式预览)
  • 多模式搭建(支持智能网格布局和自由布局两种模式)
  • 丰富且持续更新的组件物料(提供的组件基本满足各种使用需求)
  • 设计辅助能力(支持参考线,网格线, 支持创建自定义参考线, 内置色彩搭配画板)
  • 表单收集和可视化分析能力(对收集的表单信息进行数据可视化分析)
  • 实用的快捷键支持
  • 图层管理面板和可调控的页面尺寸设计
  • 支持下载代码, 轻松部署到自己服务器
  • 支持页面本地化版本管理

image.png

当然还有很多功能, 大家可以慢慢挖掘. 接下来和大家分享一下3.0版本的更新内容.

H5-Dooring3.0 更新内容

1. 页面管理模块UI升级

image.png

之前的页面列表略显单调, 目前升级成卡片模式, 多页面的复制链接, 编辑, 复制页面, 删除页面做了更好的视觉控制设计, 方便我们进行使用.

2. 顶部菜单功能升级

image.png

由于之前顶部菜单功能项较多, 所以看起来很紧凑, 最近又添加了一些功能键, 所以设计了常用操作下拉按钮, 我们可以在下拉菜单中发现很多实用的功能, 比如:

  • 新建页面
  • 下载/上传json
  • 生成海报分享图
  • 网格线开关
  • 参考线开关
  • 新建参考线
  • 清空参考线

后续随着功能的迭代, 会增加更多常用功能, 最更好的分类设计.

3. 属性编辑器功能迭代

image.png

2.0版本是固定在左侧的, 对于创建PC端页面, 会对画布视线做一定的遮挡, 影响搭建效率. 在新版本中对交互做了进一步升级, 属性面板支持自由拖拽位置, 并支持手动控制展开和收起:

image.png

上图我们可以看到, 收起状态下几乎不占用空间, 保证了画布的最大视觉空间.

4. 下载代码能力

之前版本也支持下载代码能力, 最近对出码模块做了升级, 可以支持代码下载后本地一键访问, 无需本地启动服务器.

image.png

5. 组件埋点统计, 更好的感知用户对组件使用情况

image.png

埋点统计时候可视化搭建平台的辅助能力, 但是对产品规划和后续产品迭代有非常好的指导价值, 方便后续做数据分析和精准迭代.

6. 表单收集和表单数据分析能力

image.png

这块主要是对表单数据进行更多的业务操作, 比如导入数据, 导出数据, 生成可视化分析报告等.

7. 页面本地化版本管理能力

image.png

页面版本管理可以方便用户对每一次的保存做记录, 以便后面想回退, 可以一键回退. 这样做可以最大限度的帮助用户降低误操作的可能性, 提高用户页面制作的安全性.

后期规划

对于零代码或者无代码搭建平台来说, 尽可能的覆盖更多的场景,满足更多的用户使用场景是个不错的方向, 同时也要把每个场景做深做透, 才能让用户更好的使用和产生价值.

未来dooring会在如下几个方向做进一步优化:

  • 丰富行业场景模版, 让用户更高效的制作页面
  • 开发小程序容器, 支持一键导出小程序容器代码
  • 支持更强大的表单搭建能力
  • 打通营销活动, 助力个人或者企业品牌营销
  • 上线数智化模块, 让Dooring更懂用户需求
目录
相关文章
|
JSON 移动开发 缓存
20+个可视化搭建工具,一次玩个够
无论大公司还是小公司,我们开发前端工程时候,项目工程又很多类似的功能或者页面,开发经常是加班加点搬砖去做一些无成长反复操作的工作,看键盘上 ctrle 键已经被磨掉了漆,C 和V 也马上磨白了,那对于开发如何把这些重复的工作用机器去解决?在前端资源紧缺的情况下,是否可直接有工具直接就可以搭建出我想要的前端页面?于是业界的页面可视化搭建工具就出现了,本文会介绍目前最流行的页面可视化搭建工具,也会提供一些开源的可视化搭建项目供大家参考。
1811 0
20+个可视化搭建工具,一次玩个够
|
3月前
|
JSON 移动开发 数据可视化
用第三方拖拽库快速撸一个可视化搭建平台
用第三方拖拽库快速撸一个可视化搭建平台
69 3
|
3月前
|
移动开发 数据可视化 前端开发
制作酷炫可视化大屏利器--分享10种比较流行的开源免费的图表库
制作酷炫可视化大屏利器--分享10种比较流行的开源免费的图表库
231 0
|
3月前
|
资源调度 数据可视化 前端开发
基于mathlive从零将公式编辑器集成到可视化搭建平台
基于mathlive从零将公式编辑器集成到可视化搭建平台
126 0
|
3月前
|
JavaScript 算法 数据可视化
antv/g6使用教程及图配置
antv/g6使用教程及图配置
807 0
|
数据可视化 前端开发 数据处理
AntV G6新版源码浅析
本文旨在通过简要分析G6 5.x版本源码来对图可视领域的一些底层引擎进行一个大致了解,同时也为G6引擎的社区共建共享提供一些力量,可以更好的提供插件化功能的编写。
383 1
AntV G6新版源码浅析
|
SQL 数据可视化 Oracle
JNPF可视化平台的搭建及使用
JNPF可视化平台的搭建及使用
374 0
|
缓存 数据可视化 关系型数据库
漏刻有时数据可视化大屏phpstudyPro环境部署配置中的常见问题
漏刻有时数据可视化大屏phpstudyPro环境部署配置中的常见问题
83 0
|
数据可视化 数据挖掘 BI
Excel最佳替代品!免费好用功能全,一键制作可视化报表|伙伴云
Excel最佳替代品!免费好用功能全,一键制作可视化报表|伙伴云
|
存储 移动开发 监控
从零开发一款可视化大屏制作平台
几个月前开源的H5页面制作平台H5-Dooring 收到了很多热心的反馈和交流, 顺着笔者之前的规划, 我们又做了一款可视化大屏编辑器V6.Dooring. 接下来笔者就来带大家一起看看我们的方案设计和技术实现.
565 0