![After Effects 移动UI动效设计 案例精粹](https://wfqqreader-1252317822.image.myqcloud.com/cover/597/22691597/b_22691597.jpg)
案例4 制作光盘装载动态效果
01 打开After Effects,在项目窗口空白处单击右键,导入PSD自制素材图层,导入种类为【合成-保持图层大小】,图层选项为【合并图层样式到素材】,单击【确定】。
![](https://epubservercos.yuewen.com/A28FB4/11261877703072306/epubprivate/OEBPS/Images/figure_0057_0002.jpg?sign=1739103094-OpEdCDvvcuAHbR7M9NcirpESoY7foMwc-0-6650d221921a44dbe92aaa9a36af9ddb)
02 将导入的素材拖曳至After Effects面板下方的项目窗口中,并双击打开素材。
![](https://epubservercos.yuewen.com/A28FB4/11261877703072306/epubprivate/OEBPS/Images/figure_0058_0001.jpg?sign=1739103094-Zx65KixyUfiLxmumyxWG7FIylU4MSzzW-0-37c84c98276f9e86f5a67f2df265dd37)
![](https://epubservercos.yuewen.com/A28FB4/11261877703072306/epubprivate/OEBPS/Images/figure_0058_0002.jpg?sign=1739103094-8ZhWVjUrFyyO1xezhPk7VGvypI3nM1ws-0-33b9bc24b28fa41e31f94d097410a207)
03 将【时间指针】调节至零秒零帧处,单击“Dial层”,单击【变换】→【旋转】,单击【旋转】前的【小码表】标志设置关键帧。
![](https://epubservercos.yuewen.com/A28FB4/11261877703072306/epubprivate/OEBPS/Images/figure_0058_0003.jpg?sign=1739103094-TYWd1kxmyWxyOghMedWcEqRlqkYE5fNt-0-a20e13a6f6352cee96c0298d28a15411)
04 将【时间指针】调节至2秒处,此时修改【x数值】为【1】,即旋转一圈,此时箭头就会随着后来的数值变换而旋转,如图所示。
![](https://epubservercos.yuewen.com/A28FB4/11261877703072306/epubprivate/OEBPS/Images/figure_0059_0001.jpg?sign=1739103094-09KxWLhkTZpi3foD16Q43T37s5kI0UUA-0-cf46e10df3e8d1113f1c5f55c6c4f167)
05 选中“椭圆1”图层,然后在After Effects右侧【效果和预设】搜索栏里输入关键字【擦除】,下拉双击选择【径向擦除】,此时After Effects面板的左侧会出现径向擦除的效果控件。
![](https://epubservercos.yuewen.com/A28FB4/11261877703072306/epubprivate/OEBPS/Images/figure_0059_0002.jpg?sign=1739103094-maqWWIpG6pE0Q63gEND9gQbC3MWU7cUx-0-8150a1022758dabd17374aa074694cd1)
![](https://epubservercos.yuewen.com/A28FB4/11261877703072306/epubprivate/OEBPS/Images/figure_0059_0003.jpg?sign=1739103094-rqCkJ7lBhW30uEqvLNFJVHJsatFgaZ7T-0-c00cd12284d7c372b4b995b79a325e0e)
06 将【时间指针】调节至零秒零帧处,单击After Effects面板左上方中的效果控件中的【过渡完成】前的【小码表】标志,设置关键帧,此时【过渡完成】前的数值为【0】。
![](https://epubservercos.yuewen.com/A28FB4/11261877703072306/epubprivate/OEBPS/Images/figure_0060_0001.jpg?sign=1739103094-Y8O4exGgHqXnPqUzHdqRjLWb3jMZGjeJ-0-02f89e3ff8bfc9ba5d03ab0195b477b7)
07 将【时间指针】调节至2秒处,将【过渡完成】前的数值改为【100】,并将“素材之家”这一层拖动至“椭圆1”层之上,让黑色覆盖在蓝色之上。
![](https://epubservercos.yuewen.com/A28FB4/11261877703072306/epubprivate/OEBPS/Images/figure_0060_0002.jpg?sign=1739103094-frwN7HCcMGDrJIoeEpCskEb9fMYpPtZ7-0-4af4256cb3fd88f0b8117b327b65d910)
![](https://epubservercos.yuewen.com/A28FB4/11261877703072306/epubprivate/OEBPS/Images/figure_0060_0003.jpg?sign=1739103094-Yky7B3LWhrfXgeIJ7zPgNNcxmtfBcNrX-0-1a0ed42acfee1e825a54ff127b92cc8f)
08 按快捷键【Ctrl+Y】新建纯色面板,并单击【确定】。
![](https://epubservercos.yuewen.com/A28FB4/11261877703072306/epubprivate/OEBPS/Images/figure_0061_0001.jpg?sign=1739103094-v59flIgie4INNZsYdoeKsRetuXuWVHOB-0-aaafc494df414269a6bc5ab375d8fe10)
09 选中新建的“纯色图层”,在After Effects面板右上方的【预设和效果】里的搜索框中搜索【编号】,双击选择【编号】。
![](https://epubservercos.yuewen.com/A28FB4/11261877703072306/epubprivate/OEBPS/Images/figure_0061_0002.jpg?sign=1739103094-Q7J1pkI9URbUsDVLFbpqIlzmlZ7b1Sga-0-594cc9cb8e66ec2d763829fb18edb8e2)
10 在左侧的编号效果控件中,将【小数位数】改为【0】,将【时间指针】调整到零秒零帧处,单击【数值/位移/随机】前的【小码表】标志设置关键帧,并将数值调整为【0】。
![](https://epubservercos.yuewen.com/A28FB4/11261877703072306/epubprivate/OEBPS/Images/figure_0062_0001.jpg?sign=1739103094-F3TLL7DCELW2RFRQaPBRJ3H6qoWfH4Pv-0-14fa1a3c1eaeddc3a794c1af2058b079)
11 将【时间指针】拖动至2秒处,将【数值/位移/随机】改为【100】,之后可以根据需要更改【位置】后边的数值调节数字的位置,更改【大小】的数值可调节数字大小。
![](https://epubservercos.yuewen.com/A28FB4/11261877703072306/epubprivate/OEBPS/Images/figure_0062_0002.jpg?sign=1739103094-1LJng06doeL3Mi1XvKJRBJ6L0T7XiZiQ-0-580c8dff19be8f842a8acbed12fd9949)
12 在右侧【预设和效果】的搜索框中输入【阴影】,选择【径向阴影】,在左侧的效果控件中可以调节阴影与文本之间的【距离】以及阴影的【不透明度】和【感光度】。
![](https://epubservercos.yuewen.com/A28FB4/11261877703072306/epubprivate/OEBPS/Images/figure_0063_0001.jpg?sign=1739103094-118dhN1MbfeKajVQyWBsnTCGhfVrOcuq-0-2270ed6b7c3b9eb239b72e50c267223b)
13 选择【文本工具】,在空白处输入“%”,将其位置调到适当位置即可。
![](https://epubservercos.yuewen.com/A28FB4/11261877703072306/epubprivate/OEBPS/Images/figure_0063_0002.jpg?sign=1739103094-lQaxI8BLOzh76EqqtImF8Uuj4Ilj6whC-0-a49ade114d2f94979b17ad1dd95cecf0)
14 选择“浅灰色…”那一层,选中【效果控件】中的【径向阴影】并按快捷键【Ctrl+C】复制,打开“%”层,按快捷键【Ctrl+V】粘贴,使百分号和文本具有一样的阴影效果。
![](https://epubservercos.yuewen.com/A28FB4/11261877703072306/epubprivate/OEBPS/Images/figure_0063_0003.jpg?sign=1739103094-EATDIO9fR7SM4fRbvv4HucMMCQLX8BXh-0-0e7dd2d630288d25ff0bb0ecbd65f406)