跳出思惟圈，“类H5”助你市场推广一臂之力

HTML5，也就是咱们常说的H5，它是一种标记语言，主要用于网站的编写和Web App的开发。H5制做的网页能够说是如今网络推广、促销方面的利器。其优势主要体如今两个方面，一是丰富的动效支持，二是查看方便。H5近年来愈来愈受到人们的喜好。

可是，使用H5作开发，并非人人都能作的，须要大量的编程语言和开发的基础，而一些所谓的简单设计H5的工具功能又不完善。若是我不会js，不会HTML5语言，怎么能作出一个“类H5”的简单App呢？

做为产品小白的熊先生最近正在闷头作原型，在制做的过程当中突然发现，本身的设计其实彻底能够应用到H5网页这样的推广当中。最近正在作一个旅游相关的app，那么我就帮忙帮到底，作一个旅游活动推广的“类H5”推广原型吧。

开始以前，咱们须要肯定一个原型设计工具，就用Mockplus好了，最近一直在用，拿来也比较顺手。

而后，列好大钢，编辑项目树。良好的规划是优秀的设计中必不可少的一部分。

接下来，咱们开始页面的设计。

第一步：载入动画。

载入动画是H5页面标志性的效果之一，“类H5”固然也不能忘记这一点。

方法：导入须要的图片，根据页面的内容，设置某些组件为不可见；拖拽它们各自的连接点设置“载入时”显示本身的交互效果。而且给部分组件设置上移动的动画效果，使得整个页面更加生动。

第二步：设置交互效果。

使用原型设计工具来设置“类H5”网页最大的优点就在于：原型设计工具备更多的交互效果，你想要的总有办法能够实现。这里咱们先简单的设置一些弹窗的效果。好比，关于旅行社的介绍、导游的相关资质、旅游线路的介绍等等。

方法：拖拽出相应的弹窗组件，双击打开设计。而后拖拽页面中组件的连接点到弹窗上，最后设置弹出的效果。

第三步：页面跳转。

在用户比较感兴趣的内容区域设置页面的跳转，重点内容用新的页面来说解，减小其余内容的干扰，不只保证了吸引用户的眼球，更加保障页面运行的流畅程度。

方法：设置页面的跳转效果对原型设计工具来讲彻底是小菜一碟，Mockplus只须要一个简单的拖拽动做就能够搞定了。

第四部：在线发布。

设计作的再好，没人欣赏怎么行？但是，要怎么才能把这样一个“类H5”的原型项目发出去呢？

方法：发布。有了这个功能，你就能够把作好的做品上传到Mockplus的服务器，而后拿着这个连接分享给你的客户们了。并且，Mockplus能够很简单的就作到全屏演示的效果。怎么样，是否是很神奇？

设计的内容比较简单，主要是但愿你们可以明白这个意思。

熊先生以为：市场也好，设计也好，咱们更注重的是获得的结果，而不是手中的工具。虽然使用原型设计工具来实现H5网页彷佛有些风马牛不相及，可是只要可以解决实际的问题，何须要墨守在固定的模式里呢？