Spline 新手3D入门！NO.03 变脸机器人交互动画

教程作者：Splinedesign（授权转载）

spline中文版：https://cn.spline.design/

交作业：微博搜索话题 #优设每日作业# 进入话题页即可发布作业

文章编辑：@十豆

一、关于教程

欢迎来到全新的Spline新手3D入门课程！在第 3 集中，你将学习到交互动画！

在本教程中，我们将以小机器人为 3D 模型案例，来实操学习：

• 让小机器人始终面向鼠标运动
• 添加鼠标点击/鼠标悬停
• 结合 2D UI 面板更改小机器人外表
• 结合表情包更改机器人表情

学完本次教程，你会发现交互动画原来很简单！

小机器人素材：https://app.spline.design/file/f09aef0f-3b4e-436e-a05a-e97945e2490a

二、关键步骤提示

图文内容简概为视频内容的提炼总结，想要了解详细教程内容，请观看文章顶部完整的视频教程。

#01 面向交互与鼠标悬停

• 面向交互：选择机器人并添加“面向”事件，使其头部始终面向鼠标或指定对象。
• 减震值调整：增大减震值，让机器人转动更平滑，像有减震效果。
• 面向球体：让机器人面向并跟随球体运动，而非鼠标。
• 鼠标悬停：选中机器人，创建第二个状态，调整大小，实现鼠标悬停时变大并带有弹性效果。

#02 鼠标按下与颜色变化

• 鼠标按下：设置机器人在鼠标点击时改变大小，通过“切换”模式实现点击后返回原状。
• 颜色变化：选中机器人，创建不同颜色的状态，通过复制状态并更改颜色来实现不同颜色的机器人。
• 颜色面板：添加颜色面板和鼠标点击交互，通过点击不同颜色的按钮改变机器人颜色，并添加点击反馈。

#03 表情材质与交互动画

• 表情材质：上传不同表情的图片作为机器人的材质，并创建不同表情状态。
• 鼠标悬停表情：为表情包添加鼠标悬停交互，实现悬停时机器人表情变化，如生气或微笑。
• 交互动画：探索更多交互动画，如WASD控制机器人移动，或点击跟随鼠标等。

欢迎关注「Spline」的微信公众号：

学完这篇教程的人还在学…