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

作者:彼岸花开 | 创建时间: 2023-07-27
微信H5页面是基于html5技术实现webapp,像PPT一样滑动的移动微场景,以其低成本、炫酷、创新、方便等特点,受到了不少网友的欢迎,且近两年已有不少品牌企业把H5当做重要的营销工具。 目前,许多发展成熟的H5在线制作平台基本都能做到操...
PSD文件如何一键导入H5?轻松提升10倍创作效率

操作方法

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

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

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

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

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

点击“+”,添加PSD文档;

等待导入完成,点击完成;

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

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

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

点击展开全文

更多推荐