新手必看|快速制作H5的流程及相关操作指南

使用模板来制作自己的H5,可以更加快速创建作品。小MA哥将在本指南中展示使用MAKA平台快速编辑制作H5的步骤。


Step1 - 注册与登录账号


1.电脑登录MAKA官方平台(建议使用Chrome浏览器):www.maka.im, 点击右上角的【注册/登录】按钮,手机扫描二维码在注册登录。

2.如果已经有MAKA账号,请直接电脑登录MAKA官方平台(建议使用Chrome浏览器):www.maka.im, 点击右上角的【注册/登录】按钮,点击【使用其他方式登录】,确保登录原账号。

Q:如果登录的时候忘记密码怎么办?

A:可以点击【使用其他方式登录】,选择【忘记密码】重新设置登录密码。

 



Step2 - 选择和使用模版


1.登录MAKA账号后,点击首页上方的【模版商城】进入商城页面,或登录登陆www.maka.im/store进入。

2.在MAKA模版商城根据需求筛选模版,将鼠标移动至对应的模版封面上,点击【马上使用】。模版具有完整的行业结构逻辑,只需进行小小的改动即可立刻传播。

3.如果是免费模版,预览后直接点击【立即使用】即可。如果是付费模版,预览后点击【立即购买】,选择支付方式(余额/支付宝/兑换券)后点击【确认支付】购买模版即可。

 

Q1:如果筛选不到想要的模版怎么办?

A1:可以尝试在搜索栏输入关键词查找模版。

 

Q2:已购买的模版有使用期限吗?

A2:已经购买的模版是可以无限期使用的。

 



Step3 - 编辑文本


1.如果使用模板,点击文本框,显示为“文本”属性,直接双击文本编辑内容即可。

2.如果要新建文本,右侧导航栏【新建文本】,点击对应的样式可添加至画布,双击文本框可在编辑文字内容。

3.点击文本框,可在右侧栏修改包括字体大小、颜色、粗细、斜体、下划线、行距、透明度、阴影、旋转、对齐以及位置。还可以直接伸缩、拖拽文本框改变文本框位置,来调整文本的整体的风格和内容。

4.如果使用模板,点击文本框,显示“更换图片”。则该文字内容为图片格式。且如果想要更多的字体效果,小MA哥推荐一个自由生成艺术字的网站: http://www.qt86.com/。点击进入,在文本框输入需要展现的文字;择字体样式,大小,颜色,选择背景透明;点击【生成】下载到电脑中,就能作为图片上传到MAKA。

 

Q:为什么有部分文字不能修改?

A:这是设计师在将文本转为图片格式制作模版,点击文本,如果显示“更改图片”则需要添加文本或上传其他文本内容的图片来修改。

 



Step4 - 使用图片和形状


1.点击右侧导航栏【素材】,可点击相应的分类,再点击选择素材,即可添加素材至画布。

2.若想上传自己新的图片到素材库,点击【+上传图片】从本地上传到图片库。选中想添加的图片,单击右下角【确定】,即可添加图片至素材库。

3.点击右侧导航栏【形状】,可点击相应的分类,再点击选择形状或图标,即可添加素材至画布。

4.单击画布中的形状,在右侧栏可更改形状的颜色、透明度、旋转、对齐、大小和位置,还能点击【更换形状】更改其他形状。


Q1:可以上传什么格式的图片?

A1:jpg、png、gif格式的图片都可以上传。

 

Q2:为什么形状的素材可以修改颜色,自己上传的图片不可修改?

A2:形状内的所有素材结尾SVG格式,即可修改颜色,拉大缩小尺寸也不会模糊。

 


Step5 - 调整页面和编辑背景


1.点击左侧栏的“页面”,可按需求点击【复制】和【删除】,或点击页面拖动调整页面顺序。

2.点击画布的背景,可在右侧栏点击【更换背景】选择其他背景图片,还可以裁剪图片,添加背景颜色,调整透明度。如果想将此背景应该到整个H5场景,可点击【将背景图片应用到所有页面】。

3.点击对应的翻页效果,可添加使用该翻页,并在右上方的【预览】中查看效果。

 

Q1:可以每一页使用不同的翻页效果吗?

A1:此版本的编辑器暂时只能一个作品使用一种翻页效果。

 

Q2:页面背景的尺寸是多少?

A2:背景的尺寸为640*1008。

 



Step6 - 添加背景音乐


1.点击右上角【背景音乐】,有音乐列表,对于不同风格音乐都有描述。点击音乐旁播放按钮试听,直接点击音乐名字就可以把音乐添加进作品。

2.如果想上传自己的音乐,点击【背景音乐】,选择“默认”分类,点击【+上传音乐】,

即可上传自己喜欢的音乐。上传的话需要小于2M的MP3格式的音乐。


 

Q1:怎么实现音乐的自动循环播放?

A1:添加的背景音乐默认为自动并循环播放。如果添加音乐后不会自动播放,首先建议您确认一下手机是否开了静音模式,或调整音量大小;另外,切换一下网络,排除网络不稳定从而影响到音乐载入的情况;若同一个作品在安卓手机能自动播放而在IPhone不能,请确认这首背景音乐是否在苹果设备上兼容。

 

Q2:怎么取消模版中的背景音乐?

A2:点击右上角【背景音乐】按钮,选择“无背景音乐”即能取消背景音乐。

 



Step7 - 设置元素的动作


1.在画布中点击要设置动作的元素,然后在右侧的样式栏里设计动作效果。

2.除了动作设计之外,还可以通过设置“速度”以及“延迟”的时间来设计这个动作的具体效果。

“速度”是指元素完成整个动作需要的时间长度;

“延迟”是说翻到这个页面之后,什么时间这个元素开始动。

通过设置“延迟”,可以调整元素的出场顺序,延迟时间越短的元素出场越早,反之亦然。



Step8 - 添加链接和高级功能


1.简单的插入按钮可以通过在编辑页面直接点击【按钮链接】,点击对应的链接组件可在画布中会直接新增按钮。包括跳转按钮(跳转外部链接),呼叫拨号按钮(一键拨号),互动按钮(可以送花,喜欢,蜡烛和送花),以及倒计时按钮

2.点击画布中的按钮,可在右侧编辑页面修改按钮属性,比如说按钮的文本内容背景,链接内容,透明,阴影,圆角,旋转,边框颜色等等。

3.插入更多功能,可以点击导航栏的【高级功能】,点击对应的链接组件可在画布中会直接新增。包括视频(添加视频窗口),测试游戏(可添加心理小测试),表单(收集和查看用户报名信息),投票(添加投票选项),接力(激励用户分享传播),地图(定位导航),图组(添加多张浏览图片),抽奖(企业可激励用户传播并发放福利)。

4.点击画布中的组件,可在右侧编辑页面修改组件内容,比如说按钮的文本内容背景和颜色,链接内容,增减选项,更改地址等等。 


Q1:添加视频需要注意什么?

A1:添加的是视频的通用代码,不是播放地址,切勿复制错误。

 

Q2:可以添加哪个视频网站的视频?

A2:可添加开放了复制视频通用代码的3家主流视频平台:优酷、土豆、腾讯视频的视频。

 

Q3:如何使用抽奖功能?

A3:开通企业版后可以开启抽奖功能的使用权限,http://maka.im/expense

 



Step9 - 预览保存和分享作品


1.H5作品编辑完成之后,点击【预览】保存,系统会弹出作品二维码页面,用户可以点击【更新封面】修改作品封面,点击输入框编辑作品题目和作品简介,让作品更容易被传播分享。

2.在预览页面中,手机扫描二维码可预览作品,复制作品链接至微信好友或朋友圈可分享该作品。



Q1:怎么复制二维码图片?

A1:可通过拖曳二维码图片实现复制到本地,或使用截图截取。

 

Q2:点击保存按钮后加载很久或提示无法保存怎么办?

A2:如果出现这种情况,应该是网速问题或者是长时间没有保存。可以该页面重新打开编辑试试,为了防止制作的内容丢失,建议养成随手保存的好习惯。

 



Step10 - 查看作品流量和访问数据


1.在官方平台首页,点击右上角的【作品管理】,进入作品管理页面。

2.在作品列表中点击想要查看数据的作品栏右边的【数据统计】,进入作品数据页面。

3.选择查看的数据,包括数据总览传播数据(PV、UV和分享数据)、访客分析(微信内的访问来源比例、设备分布、地区分布),以及表单收集(带有报名表单组件的作品可在此查看表单收集到的用户信息)。

4.点击数据总览页面右上方的【导出excel】可将页面的数据导出表格,进一步统计分析。

关于数据查看的问题,一起来研究一下吧!~

Q1:什么是唯一身份访问者?

A1:唯一身份访问者表示在指定当天内不重复(仅计数一次)的访问者。如你今天多次访问你的作品,但只计算一次唯一访问次数。

 

Q2:服务器数据流量是什么意思?

A2:你的作品每次被阅读都会消耗服务器数据流量,例如你的某一项目(图片+背景音乐素材)大小为10MB,体验用户50GB数据流量约可以传播5000人次/月。

 

Q3:看不到作品的访问数据?

A3:你在点击【查看数据】后,系统会实时为你刷新并加载最新的访问数据,如遇较多用户同时查询,你的数据将会在稍后时间才能进行更新,请你耐心等待一天后再查看数据。