欢迎参加木疙瘩HTML5模板设计赛（第二季）！
 
小伙伴们一定想知道，如何设计一个好模板，在众多作品中成功突围呢？
本宝典包含五大成功秘籍，收好不谢～
 
秘籍一
评委亲授视频教程，10分钟读懂《好模板是怎样炼成的？》   马上观看>>
 
秘籍二
明确大赛主题——模板，模板可用性是评分标准之一
做一个合格的模板就能成功一半，查看图文教程《木疙瘩模板制作规范》
 
秘籍三
参赛作品为5个主题任选，下面是每个主题的深度解析，点击查看：
1、模板深度解析——图文展示新闻
2、模板深度解析——答题测试类
3、模板深度解析——游戏类
4、模板深度解析——邀请函
5、模板深度解析——企业/产品宣传
 
秘籍四
本季大赛新增网络投票环节，所有入围作品将进行网络投票。
偷偷告诉你，投票分数占比30%，投票第一名将获得「人气奖」
发动你的朋友圈投票吧～
 
秘籍五
评委亲授视频教程，《详解模板如何制作》   马上观看>>
 

企业宣传、产品宣传是常用的模板类型，用于企业和品牌宣传、产品推广营销等。
 
此类模板要注意的是：
1、放置企业信息：如logo、企业名称、二维码等
2、图片易于替换：尤其是产品图片
 
下面来欣赏几个示例：
 
1、科技风企业宣传        观看模板>>
很通用的科技风模板，适用范围非常广。动画不算复杂，恰巧适合小白用户修改。

 
 
2、耳机产品宣传         观看模板>>
比较时尚、炫酷的产品宣传模板，围绕耳机产品做了各部分的介绍。中间的各部分解析页、图片切换页都是常用的表现方式，可以借鉴。

 
 
3、智炫汽车宣传          观看模板>>
一个汽车产品宣传，内容页很多，排版样式多变。制作多种排版效果，将产品文字、图片填进去，再配以适合的动画效果。好模板就这样完成了。

 
 
4、企业通用宣传            观看模板>>
这个风格是不是也很通用？此类模板就是需要适用范围广的风格，不需要太具个性，用户范围才广。
中间企业大事记采用了关联交互动画，很有意思，是模板的亮点。

 
 
5、交互性企业宣传           观看模板>>
这叫「长图拖动关联动画」，是常用的交互展示类型。通过上下拖动画面，控制动画的播放和页面的位置，效果很好。
感兴趣的同学可以学习一下。

 
看了这么多，总结2点：
1、风格要通用
2、用户好修改
 
如何做到模板好修改？看这个：
>>>查看模板制作规范>>>
 
 
 
 

邀请函模板非常普遍、通用，通常用于会议、活动、婚礼等。
 
内容要符合邀请函特点，通常必备信息有：
首页“邀请函”字样；
内容页放背景介绍、活动信息、日程表、嘉宾等；
结尾页包含活动地址、时间，提交表单（姓名、电话、参与人数等）。
 
下面就要认识一下邀请函模板～
 
先从一个简约版邀请函开始，简约、大气的风格，适用于多种场景，并满足了邀请函的基本需求。   观看模板>>

 
想做一个吸引眼球的邀请函，酷炫的视觉效果必不可少，这个模板就是以视觉取胜的：   观看模板>>
有AE基础的童鞋，可以制作特效序列帧导入木疙瘩，效果成倍翻～

 
下面的模板是前一阵超级火的抖音风邀请函：  观看模板>>
追赶热门的画面风格、交互形式是做模板的必杀技，这种模板短时销量最高。

 
纯展示的H5难免审美疲劳，用特别的交互方式能激活用户的神经：     观看模板>>
这个模板用水平拖动的交互方式，配合卡通场景和有趣的元素，将按钮放进太空场景中，点击后弹出邀请函的信息点，很有意思。

最后这个邀请函有震撼的视觉效果，以及高级的交互体验：    观看模板>>
长按手指开启太空穿越的动画，用计数器展示启动嘉宾数量，进入邀请函后，用长图拖动关联功能查看内容。

 
此外，还有婚礼邀请函这个方向，主要体现在设计风格和内容的不同：    观看模板>>
 
 
邀请函风格各异、动画形式丰富、交互方式更是多种多样，大家可以尽情发挥创意～
 
注意要符合模板制作规范～
 
>>>查看模板制作规范>>>

游戏是H5的一种高级应用，木疙瘩支持无代码制作很多种游戏，消除游戏、接物游戏、连连看、换装、竞速、找茬儿等等。
 
制作游戏模板要注意：
1、选用逻辑简单、用户好理解的做法
2、增强可用性：将修改说明文字放在画布外，注意为元件、图层命名，行为要添加描述。
3、添加logo、公司名称等信息，最好把logo或产品图片融入游戏之中。
 
来看一下具体示例
 
1、数羊游戏    观看模板>>
超简单的催眠游戏，H5也能数羊了。用户只需不停的向左滑动屏幕，就能数一只羊。制作时需要做一些数羊小动画，再更改文本值即可～

 
2、连连看    观看模板>>
再熟悉不过的小游戏，特别适合嵌入产品宣传图片，所以商家百用不厌。这个模板在赢得游戏后，才能打开邀请函，创意不错。

 
 
3、划龙舟吃粽子游戏      观看模板>>
游戏形式很常见，坠落接物型。用龙舟来接粽子的创意，让节日氛围很浓。而且小动效也很不错。

 
4、消除类游戏：CP消消乐      观看模板>>
创意很不错，适合情人节、光棍节营销。泡泡中依然可以嵌入产品图片，适合商家推广活动。最后生成排行榜。

 
5、场景布置游戏：你儿时房间什么样子？     观看模板>>
最近超级火爆的H5形式，无代码即可制作。通过拖拽物体布置房间，最终生成图片分享到朋友圈。

 
制作游戏类模板，一般要有些逻辑基础，不需要写代码，但思路要清晰。
 
>>>查看模板制作规范>>>

答题测试类模板最容易刷爆朋友圈，答题后将测试结果生成图片，再分享朋友圈，是时下最热门的营销手段。
 
制作答题测试类模板要注意2点：
1、内容有趣：有意思的内容才会促进用户分享
2、形式特别：文字题、图片题、音频题、视频题可以结合起来
 
接下来介绍几种常见的形式
 
第一种，极简型      观看模板>>
输入姓名，随机出结果。只要文案有趣，就有人分享～

 
第二种，文字题     观看模板>>
简单的二选一答题，优点也是足够简单，动画很可爱，用户易修改。

 
第三种，图文结合型     观看模板>>
这个模板技术含量较高，根据答题计算分数，算出是哪个年代。
每个年代都有独特的风格装饰，并把用户照片调整到这个年代的风格，非常好玩。

 
 
第四种，音频题       观看模板>>
作品内容知识量很大，根据声音选择是哪首古诗，选择后可查看该诗图文解析。

 
 
第五种，生成图片型      观看模板>>
这是类似网易说明书的模板，根据用户答题结果，计算出该用户的软件版本和安装指南。
最终生成图片，可分享到朋友圈。是目前最为火爆的形式之一。

 
 
答题测试的模板类型还有很多，只要你脑洞够大，不用担心没创意～
 
好的模板一定要让用户能用，注意要符合模板制作规范哦
 
>>>查看模板制作规范>>>
 

图文并茂的展示新闻内容，图文排版形式多样，物体动画形式多变。
模板内容自由发挥，可以将网上的图文新闻套入。注意选题要通用一些，这样受众用户多。
 
选择图文展示新闻的小伙伴，要注意把媒体信息放进模板中哦！
通常首页会放媒体logo、“某某新闻新媒体中心出品”字样，结尾页会放媒体logo、二维码、制作人员信息等，如：
策划：XXX
记者：XXX
设计：XXX
制作：XXX

那么，新闻模板到底长什么样子？

下面来结合示例分析：

首先，看一个基本的图文展示新闻模板。  观看模板>>
每页的平面版式都差不多，但平面上添加了跟多装饰元素，做动画时就有了一定的发挥空间，设计师做了很多的出现动画，每页定格后都有循环的元件动画，选用的运动方式都很恰当，整体视觉效果非常好。

 
接下来这个模板，注重展示形式的设计。    观看模板>>
平面很下功夫，每页排版、内容形式都不同，使用了不少异形图片。

 
除了分页展示图文以外，还有很多动画和交互形式可以发挥我们的创意！下面看一个创新形式：            观看模板>>
用手指滑动来控制汽车行驶，每到达一个目的地，都可以点击道路两侧的热点来查看文字，是不是很赞？

 
最后分享一个特别的交互形式，利用陀螺仪操控画面：      观看模板>>
开头添加了操作提示界面，非常注重用户体验。用户左右转动手机，就能看到所有内容，点击按钮查看图文详情。
创新的形式总能让人印象深刻～

 
看到这里，是否对图文展示新闻类模板有了自己的认识呢？
其实，只要有策划、有创意就不愁好作品。
大家可以将预置动画、关键帧动画、路径动画、遮罩动画结合起来，可以实现非常多优秀的动画效果。
此外，交互设计也有很大发挥空间，木疙瘩有点击、滑动、摇一摇、擦一擦、陀螺仪等超级多的交互形式，就等你来解锁哦～
 
>>>查看模板制作规范>>>
 
 

 
>>>进入官方页面>>>

一、个人/企业报名参赛 
面向木疙瘩平台所有用户，设计师任选模板主题，按照模板要求制作模板，不限参赛作品数量，填写参赛表（本文附件），发邮件至contact@mugeda.com；
 
二、院校、培训机构团体报名参赛
请加微信“feiguo1278”获取团体参赛入口。
 
 

杨竹，木疙瘩模板征集赛一等奖获得者，火星时代教育北京校区学员。
获奖作品：《我们毕业了》   观看模板>>
指导教师：刘胜喜
专家评语：作品充满故事性，创意、设计都很好，非常用心。
 
>>>进入火星时代教育空间>>>
 
>>>观看视频专访>>>

 
Q1: 您好，杨竹同学，非常感谢您能参加我们这一次的采访。麻烦您做一下自我介绍。
大家好，我叫杨竹，毕业于山西大学。已经毕业一年了。之前大学本科学的是室内设计专业。然后毕业以后选了一个自己更感兴趣的专业。就是在视觉与新媒体这个方面。

Q2: 那您为什么要选择做设计呢。
一开始在大学填志愿的时候就报了这个专业。就一直做下去了。是一个自然而然的过程也没有必要的选择。就走到这一步，然后继续走下去。

Q3: 众所周知涉及对美，是有追求的，请您谈一下对美的独到的见解。
我之前学过的大学必修课当中。就有美学。我认为美是一个非常玄妙的东西。主要是使你感觉舒服，他就是一个美的东西。然后咱们设计师所从事的工作也是一种使人感觉舒适的事情。所以它也是一种美的东西。

Q4: 请问您做出了这么好的作品，您是有经历过专门的设计类的培训吗
我是在2月份的时候进入了火星时代，进行UI/UE设计的培训。在5月下旬的时候，接触了木疙瘩这个软件，我非常的感兴趣。并且非常荣幸的参加了这次木疙瘩的比赛。并且荣获了一等奖。这也是我第一次参加这种比赛。也算是一个很好的开端。

Q5: 那请问您在设计的过程当中有什么心得体验需要传授给学弟学妹们，或者是其他的新手设计师们吗？
设计这个东西，其实你设计出来的所有东西都是你自身阅历的展示。不管你经历了多少，都会在你的设计当中展现出来。它是你内心的一种体现。如果你想在设计的道路上走的特别从容，你就需要看特别特别多的东西。主要还是一个积累的过程。我现在还是感觉到自身的阅历有些不足，希望可以和大家一起进步吧。

Q6: 请问在你的设计当中是怎样融入理念与想法以及让人有很好的用户体验的呢？
如果要做到自己的设计，使用户有更好的体验的话。你需要把自己当成一个用户。你希望在设计当中想要得到些什么？看到些什么？以自己为代入做一些调查。才能使设计作品更符合人性化的体验。

Q7: 那接下来说一说在你的生活或者是工作过程当中一些高兴或者是心酸的一些事儿。
其实我在这个过程当中是很开心的。我是一个热爱学习的人。只要在学习过程当中吸收到新的东西，我就很开心。在火星时代培训期间。每天都可以接触到新的东西。老师也特别有耐心。这次的作品也算是一种成果吧。

Q8: 那做了这么长时间的设计，您最后想给大家分享些什么？
这个我要借鉴一下火星时代电脑桌面上的一句话。比别人多一点执着，你就会创造奇迹。