H5场景制作包含多个步骤,创建者在构建时,不能省略一个步骤,今天,凡科微传单就来和大家探讨一下H5场景制作流程。
一、新建H5微场景
(1)登录后台管理系统,单击“凡科微传单-微场景设计”,进入微场景主界面。
(2)单击“新建空白微场景”,进入新微场景的编辑界面。
二、设计微场景
为了使演示更加直观,我们隐藏了编辑界面的网格线。
1、微场景设置
基本信息设置(设置微场景的标题,SEO关键字和SEO描述);
访问权限设置(设置微场景的访问权限);
共享设置(共享微场景时设置图像和ICON图像);
微场景的音乐设置(“打开微场景时将播放音乐”和页面切换器设置“打开微场景后可以在右侧显示页面切换状态”);
全局头/尾码(输入代码以控制微场景,此操作需要一定的代码知识);
单击“保存”完成场景设置。
三、页面设置
1、整体设定
(1)基本选项(复制到剪贴板:复制页面,在另一个微场景页面上按“Ctrl+V”粘贴模块;页面名称:用于页面名称);
(2)页面样式:
页面背景:有图像背景(以图像为背景),纯色背景(以纯色为背景),渐变背景(以两种或更多种颜色的渐变为背景)和纹理背景(以可变颜色的纹理为背景);
上下左右边框:设置页面上下左右边框线;
圆角:设置页面上下左右圆角;
(3)旋转页面(旋转页面,倾斜等操作,一般不需要设置)。
2、关于(请参阅此页面上的相关信息)
单击“保存”以完成页面设置。
四、设计页面
1、添加组件(此处以设置为红色的页面背景为例);
2、组件修改(更改组件中的图像,文本和超链接);
3、将组件拖动到适当的位置(您可以单击右上角的“更多”进行快捷操作,例如水平居中对齐,左对齐等),并调整组件的大小(宽度和高度)组件的数量不应超过电话界面上的虚线框,并且超出的部分不应显示在页面上);
4、组件的层次设置(如果组件和组件之间存在屏蔽,则可以改进组件的层次结构以使其更易于操作):
方法1:拖动左侧组件列表中的相应组件以提高或降低组件级别(随着级别的变化,右侧组件的遮挡也会实时更改)。
方法2:单击相应的组件,然后单击“上移”或“下移”以提高或降低组件级别。
5、为组件设置动画(有三种基本动画,自定义动画和共享动画)
(1)基本动画:走马灯、720°全景、画中画、一镜到底等;
(2)自定义动画:个性化设置动画路径,动画节点时间;
(3)共享动画:选择共享动画。
其余页面可以用相同的方式创建,但我们在此不进行演示。
五、保存并预览微场景
1、保存微场景(创建所有页面后,保存微场景并完成微场景的创建);
2、预览微场景(在手机界面中预览微场景)。
关于H5场景制作步骤和如何制作H5页面,凡科微传单便分享到这里了。