PSD文件如何一键导入H5？轻松提升10倍创作效率【百科全说】

微信H5页面是基于html5技术实现webapp，像PPT一样滑动的移动微场景，以其低成本、炫酷、创新、方便等特点，受到了不少网友的欢迎，且近两年已有不少品牌企业把H5当做重要的营销工具。
目前，许多发展成熟的H5在线制作平台基本都能做到操作简便，功能也越来越多。因此对于一个H5创作者来说，如何高效地制作一个酷炫的H5至关重要。现在就教你可以迅速提升10倍创作效率的方法，从此，用PS、CRD等等软件做好的设计图，都能轻松导入H5啦，工作量少啦，而且借助其他设计软件做出的效果都可以完美地导入H5里，再也不用担心H5不够酷炫的问题！

操作方法

01

准备好制作H5的素材（用PS或其他制图软件做好的海报或宣传单等、素材网站上的图片、可做背景音乐的歌曲、需要插入视频的代码），如下图是已经在PS上做好的海报。
02

首先要用PS把素材的像素调成640x1008px，如果原素材尺寸比例不符，避免调整后变形，最好按照原尺寸比例调到接近数值。如，我的素材原比例是3543x5315px。
03

为了调整大小后不会变形，我就将高度调整为1008px,宽度则变为672px。调好后，文件就变小了几乎50倍，保存文档。
04

登录H5在线创作网站（这里以M A K A为例）。寻找适合的模板或者直接点击“新建空白”自己创作。（推荐使用谷歌浏览器，兼容性更好）
05

进入编辑页面后，点击“PS”。
06

点击“+”，添加PSD文档；
07

等待导入完成，点击完成；
08

导入完成后，就可以在编辑器上继续编辑了。而且，在PS里的图层，都可以完美地拷贝到H5中，你可以自由地移动各个图层。如下图是我对其中的文字图层进行了移动。另外，为了避免导入后的PSD出现效果异常，建议PSD为640X1008像素，大小小于10MB。每个PSD只能导入一个画板，不支持Photoshop CC 2015版本的多画板功能。
09

对导入的素材修改完成后，还可以继续制作你的H5。对文本、图片、背景音乐、按钮链接、形状元素、特效、高级功能等进行编辑创作。
10

创作完成后，点击右上角的预览，就可以修改作品的封面、名称。系统会自动生成作品链接和二维码哦。

PSD文件如何一键导入H5？轻松提升10倍创作效率

操作方法

相关推荐