1、【打开】Sketch软件,【打开】做好的Sketch素材文档。具体效果如图示。
![15086386253216.jpg](https://pic.huke88.com/upload/content/2017/10/22/15086386253216.jpg)
2、【打开】Principle,单击【文件】-【从Sketch导入】。具体显示如图示。
![15086386419048.jpg](https://pic.huke88.com/upload/content/2017/10/22/15086386419048.jpg)
3、【选择】删除按键组,【重命名】删除。按【Ctrl+C】复制,按【Ctrl+V】粘贴至左侧,调整图层至最顶层。具体效果如图示。
![15086386566497.jpg](https://pic.huke88.com/upload/content/2017/10/22/15086386566497.jpg)
4、【选择】左侧的第二个图素材图层,单击【按下】,拖动箭头至相应的图层。具体显示如图示。
![15086386696007.jpg](https://pic.huke88.com/upload/content/2017/10/22/15086386696007.jpg)
5、【选择】左侧的第二个素材图组,【重命名】选框。按【Ctrl+C】复制,按【Ctrl+V】粘贴至右侧对应的位置。具体显示如图示。
![15086386783332.jpg](https://pic.huke88.com/upload/content/2017/10/22/15086386783332.jpg)
6、【选择】右侧第二个素材图组,【重命名】2选框。按R键【新建】矩形框,调整图层顺序,放置合适的位置,【勾选】修健子图层。具体显示如图示。
![15086387026967.jpg](https://pic.huke88.com/upload/content/2017/10/22/15086387026967.jpg)
7、【修改】矩形框的背景色,按【Alt+Shift】键等比放大,【圆角】142。具体显示如图示。
![15086387175954.jpg](https://pic.huke88.com/upload/content/2017/10/22/15086387175954.jpg)
8、【选择】右侧边框背景图组,按【Ctrl+C】复制,【打开】左侧选框图组,按【Ctrl+V】粘贴至合适的位置。具体显示如图示。
![15086387329409.jpg](https://pic.huke88.com/upload/content/2017/10/22/15086387329409.jpg)
9、【选择】图层,【缩放】0,【打开】动效时间轴,调整时间至0.7秒,打开【动效菜单】-【缓入缓出】。具体显示如图示。
![15086387461646.jpg](https://pic.huke88.com/upload/content/2017/10/22/15086387461646.jpg)
10、【选择】右侧的黄色框,按【Ctrl+C】复制,按【Ctrl+V】粘贴至右侧选框图组下方,【不透明度】0。具体效果如图示。
![15086387631631.jpg](https://pic.huke88.com/upload/content/2017/10/22/15086387631631.jpg)
11、【选择】2选框图组,调整图层顺序,【垂直动态】拖拽,【水平动态】拖拽。具体显示如图示。