1、【打开】Sketch软件，【打开】Sketch文档。具体效果如图示。

2、【打开】Principle软件，单击【文件】-【从Sketch导入】。具体显示如图示。

3、【选择】画板2上关联素材，按【Ctrl+C】复制，按【Ctrl+V】粘贴至画板1，按【Ctrl+G】编组，【重命名】，调整组框至画板大小。具体显示如图示。

4、【选择】2哈组至合适的位置，【选择】2哈和金毛，按【Ctrl+G】编组，调整组框至画板大小，垂直动态【页面】。具体显示如图示。

5、按R呼出矩形，调整大小和颜色，放置画板合适的位置。调整背背景点素材，移动点素材至合适的位置。【打开】联动面板，【选择】点联动图层，移动时间轴至0刻度，【选择】点联动图层右击【添加】Y轴。具体显示如图示。

6、移动时间轴至-1334刻度，单击点2联动图层，【添加】Y轴联动层，移动点2素材至画面合适的位置。将点1素材移动至画板外合适的位置。具体显示如图示。

7、移动时间轴至0刻度，移动点2素材至画板外合适的位置。具体显示如图示。

8、按R呼出矩形，调整角度至圆角。【填充】无，【描边】黑色，调整合适的大小。按Alt键【移动复制】圆形，排列至画面合适的位置，【修改】描边颜色和大小。具体显示如图示。

9、【复制】椭圆，移动至合适的位置。单击联动图层，添加【透明度】联动图层，移动时间轴至-1334，图层7【透明度】0，图层2【透明度】100。具体显示如图示。

10、移动时间轴至0刻度，图层7【透明度】100，图层2【透明度】0。具体显示如图示。

11、使用相同的方法给狗的名字添加联动动画，【删除】多余的画板。【选择】画板1文字对象，单击选择【按下】拖动箭头至合适的方向。具体显示如图示。

12、【复制】画板1素材至画板2，【删除】画板2多余的素材。【选择】矩形图层，【重命名】阴影。【复制】阴影素材，【粘贴】至画板1，调整图层顺序，【透明度】0。具体显示如图示。

13、【复制】画板2文字和桃心素材至画板1，移动至画板1合适的位置，【不透明度】0。具体显示如图示。

14、【打开】动效面板，【选择】阴影动效图层，移动时间轴，添加【缓出动效】。具体显示如图示。

15、【选择】画板2文字关联素材，【打开】动效面板，【移动】关联素材动效时间轴至合适的位置，添加【缓出动效】。具体显示如图示。

16、【选择】画板2按钮素材，【选择】按钮缩放动效图层，添加【缓入动效】。具体显示如图示。

17、【选择】画板2素材，单击选择【按下】拖动箭头至画板1对应元素。具体显示如图示。

18、根据预览动画窗口，调整动效细节。最终效果如图示。