你正在阅读摹客全新内容栏目**【一节摹课】**。

本栏目会经过一些风趣的、有用的、美观的、新潮的实操事例,共享摹客“规划1+2”产品矩阵 —— 「1个协作平台+2款规划东西」的具体操作妙计!

带我们一步一步地解锁摹客协作、摹客RP、摹客DT中的巨细功用。

一节摹课的方针是:用摹客,让天下没有难做的规划和难交付的问题!

一节摹课 Vol.3
做张圣诞贺卡

小时候最喜欢过节,期盼在课桌里边翻出小伙伴们偷偷塞的贺卡。

一开始仅仅一般对折页,之后逐步升级成立体可拆卸、打开会唱歌等贺卡方式,再后来,贺卡如同消失了。

一节摹课丨做会动的电子贺卡,当懂浪漫的成年人

过了20岁,过节就不能再像小孩子相同等着收礼物了,想重拾日子的惊喜,需求自己动手预备。今日小摹教我们做一张会动的电子圣诞贺卡,而且能够在线发给小伙伴, 气氛感直接拉满。

DEMO

规划内容:圣诞贺卡

中心作用:点击敞开惊喜,圣诞雪花旋转,跳转圣诞祝愿

制造东西:摹客RP

一节摹课丨做会动的电子贺卡,当懂浪漫的成年人

* 看!具体操作

在规划圣诞贺卡之前,需求先大约整理规划框架,比方:想要几个界面、有哪些惊喜元素需求放入、有哪些作用想要展示。

小摹做贺卡的规划思路是:1.我想要一个能够敞开贺卡的仪式感→2.敞开后的惊喜进入贺卡主页面,而且页面丰富有动效→3.最终能够有独自的祝愿语。

依据规划思路,拆解具体操作。

1️⃣ 按钮交互,敞开惊喜

主画板上添加想使用的敞开元素,在摹客RP内有3000+的组件和图标能够挑选,能够是一个组件也能够是一个图标。

小摹这儿选的「开关」,双击或许拖动即可使用。

一节摹课丨做会动的电子贺卡,当懂浪漫的成年人

经过顶部菜单栏的「辅佐画板」创立以一个和主画板同等巨细辅佐画板,并在辅佐画板上完结惊喜敞开后的页面规划。

小摹在辅佐画板上画了一颗圣诞树。

一节摹课丨做会动的电子贺卡,当懂浪漫的成年人

拖动「开关」按钮右上角的红圈,并链接到辅佐画板(留意,一定是衔接画板,不是画板上的某个元素),链接后完结交互设置。

小摹这儿的设置是「敞开」→「显现画板」。

一节摹课丨做会动的电子贺卡,当懂浪漫的成年人

摹客RP内置的交互动作有几十个,能够依据自己的需求挑选设置。

2️⃣ 让雪花转起来,圣诞气氛拉满

点中辅佐画板名称选中画板,在操作界面右侧为画板添加交互,并将交互方针选中辅佐画板里边的雪花图层。

完结方针挑选今后,相同开始设置交互动作,这儿也能够依据需求能够挑选放大缩小/躲藏/滚动等各式各样的交互命令。

小摹挑选的旋转,调整旋转视点和速度,即完结交互设置。

一节摹课丨做会动的电子贺卡,当懂浪漫的成年人

对每个雪花重复相同的动作,就能得到一张能够动的圣诞贺卡页!

一节摹课丨做会动的电子贺卡,当懂浪漫的成年人

3️⃣ 蒙版弹窗,发送节日祝愿

首先,需求在辅佐画板里边绘制一个元素,用于交互命令的触发。然后再创立一个辅佐画面,在画板上规划节日祝愿所需的相关文字和内容。

小摹这次是将圣诞树上的一个圆形装饰作为触发点,在新建的辅佐画板上写上Merry Christmas文字。

一节摹课丨做会动的电子贺卡,当懂浪漫的成年人

相同拖动圆形右上角的红圈,链接到对应的画板

衔接后,经过交互设置完结交互。小摹的设置是:显现画板→居中→挑选显现遮罩→设定遮罩色彩。

(注:显现遮罩是将底色整块覆盖在主画板上,是否遮罩依据需求挑选。)

一节摹课丨做会动的电子贺卡,当懂浪漫的成年人

悉数设置完结,点击界面右上角的「演示」按钮,就能够完好浏览贺卡啦!

4️⃣ 把惊喜,共享给兄弟姐妹

当然,贺卡要送出去才有意义!

演示界面,点击下方的共享按钮,将共享链接一键发给好友,在线就能查收贺卡。乃至还能够约请兄弟姐妹共同在线规划贺卡,这必定让友谊之花越开越浓。

一节摹课丨做会动的电子贺卡,当懂浪漫的成年人

今日的功用学会了吗?

回顾一下本节课的4个知识点:

1.按钮组件的交互

2.让图标旋转

3.页面跳转,蒙版设置

4.在线链接共享

当然,这个实操事例仅仅小摹不成熟的规划,学会里边的交互,你能够玩出各式各样的贺卡风格。

赶紧来试试吧→用摹客RP做贺卡

下节课想学什么,能够留言告诉小摹哟~

下课!