h5红包雨代码_【多管闲事】非专业人士H5学习指北：从门还没入到放弃 | 叙一来闲...

0 文前狗头

声明：本文中“h5”，特指朋友圈里常见的、可以互动填表什么的那种伪·PPT似的h5。如，以下场景中的h5——

老师：最近我们这个XX活动要成果展示了，你做个那种能朋友圈转发的h5哈~

部长：最近咱们部要招新了，这是咱们部之前的一些资料，你做个招新H5，最后一页要收集姓名和联系方式…… 家长：最近隔壁你赵钱孙李叔叔阿姨朋友圈发了个音乐相册，真好看，你会不会做啊？ 给你照片，你也做个。

还有一些什么新品促销、什么会议邀请、什么公司宣传……

明确了本文中“h5“的定义，就开始我们今天的一路向北吧。 在这篇文里，PQLW将先大致介绍 一个h5的制作过程(毕竟想做个教程) ，再说明 “ 从门还没入到放弃“ 这个观点是个怎么回事。 1 一个 PPT H5的诞生：非专业指北教程 作为一篇勉强可算 不正经 教程 的东西，这里PQLW先来段H5的制作过程。

1.1 明确“甲方”想要的成品效果

先问清楚“甲方”，这个h5大概要做成个什么样，有没有以往的或同行的案例可以参考。大的，如作品的功能、风格、使用场景等。小的，如第几页放个什么表格、logo用长的还是方的、有没有指定用哪个平台做等。 弄清这些后，如果觉得在自己能力内，可以问甲方要素材了。 如果发现甲方要的功能自己做不出来，及时拒绝，不要逞(贪)强(财)。

1.2 挑选做这个H5的平台工具

作为非专业的打工仔，显然我们要做的是找个现成模板改一改，而不是从0开始学习写代码。 那么，如何选择合适的平台，在里面找到合适的模板呢？ 思路是， 先根据h5要实现的功能，看哪些平台能做成，圈出一个范围，再在这个范围里找便宜/能报销的、用着顺手的。 以下平台列举不代表全部。

1.2.1 会做PPT就差不多能上手的，如秀米、MAKA、易企秀等

用这类平台，做个相册、邀请函什么的足够了。 这些平台用起来，和做PPT的体验差不多，哪里要放图就放个图，哪里要放字就放段字，也有各种页面切换的特效，一些投票、表单收集的互动组件也够用。免费的模板虽然很多呆呆的，也能从中挖掘出一些好的来。

MAKA的部分互动组件

秀米的部分表单组件 有一点在这里不得不提一下，有些平台里的一些互动组件，不一定是真的能实时互动。例如，有些留言和弹幕组件，发布后显示的，并不是访客写的留言和弹幕，而是你在制作h5时自己写上去的撑门面的几条，永远就显示这几条。真正的访客写的内容，是会被储存到后台的数据库里，但不能反馈显示到h5上，没这功能。不知道我这么说说明白了没有。总之在 用这些组件时认真观察 。

1.2.2 能做牛x功能但上手难度高的，如ih5、Epub360等

用这些平台，可以 实现很多你想得到的想不到的功能 。如微信头像加工(头像戴口罩、云毕业照那种)、模拟微信对话体、抢红包等，甚至还可以做小游戏。(像不像年久失修 的flash？ ) 但这些更加专业的平台吧，往往让PQLW这种非专业辣鸡，第一眼就犯怵。

Epub360的工作台，看上去好像还不那么复杂

ih5的工作台，就开始让人有点迷茫了 它们的逻辑思路，也和PPT制作式的平台的不怎么一样。 例如，ih5中，有容器、横幅等需要学一学才知道怎么用的概念。同样是做一个收集姓名的页面，在1.2.1中的平台直接找现成的组件就好了，但在ih5，需要——

建个数据库，建个输入框，建个按钮，设一个当输入框中有文本时点击按钮就把输入框的内容提交到数据库的事件，再设一个点击按钮后把输入框中文本内容清除的事件……

好家伙，像编了个程。心累。 这些专业平台也有模板。但是，不先学习一下，甚至拿到了模板也不会改……

1.3 找个模板，套素材，做出成品

模板，最好找功能、内容、风格都和甲方要求差不多的那种，能省一点事，就省一点事。 (那些个人的充满创意的小心思，说不定就是甲方眼里最大的刺，哭哭。多么痛的领悟。)

易企秀的一些免费模板 要注意的是，模板里有的看似是艺术字的东西，说不定只是一张png。遇到这类情况，要么换个不用改文本内容的模板，要么自己重新做字。

自己多做预览、测试，有bug自己先发现并改好。

1.4 与甲方皇城PK巅峰对决

进一步完善自己的h5作品 ， 直至被甲方放过。 如有 收集的数据信息，及时提交。

以上差不多是一个孤独的非专业打工仔如PQLW制作h5的过程。专业团队显然不能这么草率。如果读者老爷有制作h5的经验，欢迎分享；若读者老爷有做h5的需求，可以适当参考上文。

不过，看到这里，读者老爷你可能想说了，那这做个h5不也和做个PPT差不多么，不就找个平台套模板么，不就替换素材加点特效么，为啥你还说“从门还没入到放弃”呢？ 2 从门还没入到放弃 PQLW个人，个人，个人， 不建议花过多时间在学做h5上 。能做个“伪·PPT”，多数时候够用了。不是很有必要再深入了解更多知识。

2.1 做一个H5到底能学到什么

学会了做“伪·PPT”么？学会了套用模板替换素材么？学会了做朋友圈装x利器么？但这些内容，扯个其他会做真·PPT的人来，他能不会做？他不会做，你教不会他做？ 我不认为我做几个什么报名表、什么邀请函，就能在哪个领域入门了。也就收获一点在小学信息技术课上，用金山画王画幅画的那种快乐了。 一些更加专业的h5制作平台，有一些平台特有的逻辑思路，或许能与其他设计和编程的相关知识融会贯通。但问题是，我好像本来就没多少设计、编程的相关知识。 有些专业的h5制作平台，他们的官方教程，时长堪比B站上一套html+css+js基础教程。要等我先学学，甲方的ddl快架到我脖子上了。

为了方便展示时长，这里列举部分B站上搬运的ih5教程。 看到这个教程时长，爱我你怕了吗？ 2.2 H5制作自带的劝退属性 是你不适合学，还是它不适合学，是个问题。

2.2.1 制作平台太多，不方便非专业团队合作

ta说ta用兔展，ta说ta用人人，ta说ta用秀堂，ta说ta用pp匠…… 而且这些h5制作平台吧，还不像公众号推送排版用的秀米、135这些，最终起码都可以复制到微信公众平台那后台，统一编辑。跨平台合作这种h5，别打起来。

2.2.2 好上手的平台，功能不一定OK

一个例子是，前面1.2.1中提到过的，虚假的留言、虚假的弹幕。 还有就像，现在安卓机屏幕比例五花八门，而有一些平台做h5，对这些屏幕们的适配，简直让人感到不适。更别提横竖屏切换什么的了。

2.2.3 制作平台太贵

诚然，平台不同收费标准不同，的确有不付费也功能齐全的平台，顶多有些广告；但也有平台，不付费就只能体验阉割后的功能。更有甚者，发布的作品只要有人看就要钱，所谓付费投放。 (这一点也可以成为咕咕咕的绝妙理由) 2.2.4 教程难找 知乎一搜，各个平台在打广告；B站一搜，出来一堆网课大合辑。

2.2.5 没太多机会给非专业的你做H5

如果是做这种不很专业的h5，那些好上手的平台，只会让也不很专业的你，受到更加廉价的劳动力的排挤。况且，这种h5的出场频率着实不那么高，宣传展示有公众号图文等形式，数据收集有问卷星等工具，h5有时候就是这么 不尴不尬 的。 如果是做官方的、专业的h5，像我这种小辣鸡又怎么做得出来……哪轮得到我呢。 3 最后的哔哔 作为一个专业不是设计及计算机相关的、但经常与所谓“新媒体”玩耍的外行打工仔，PQLW也只能写出这个层面的理解了。再高瞻远瞩高屋建瓴我哪写得出来。本文仅代表个人意见，也希望读者老爷们有自己的思考。 “多管闲事”这个栏目，为什么叫“多管闲事”，就是因为，PQLW不是一个积累了很多专业知识、锻炼了强大专业能力的人。也就在一些与新媒体有关的学生组织里摸个鱼。平时误打误撞有了点啥收获，就在这里写一写。所以，也只能算是多管的闲事了。 我也不知道这个栏目的内容，能否给其他同在做这些内容、但经验相对不足的朋友萌一点帮助。 我写的这些东西，放到真正的大佬眼里，肯定幼稚得很。 但只要有一点意义，也行。 下期水点什么呢…… 依旧是没有人 | 给我打钱 葩奇老污 | 各种杂活