我以为能给站点请个会动的吉祥物，结果来了个 64×64 的方块人
内容提要
作者原计划为博客添加Live2D吉祥物，但素材为Minecraft皮肤，遂改用three.js实现3D方块人。尝试minecraft-skin-viewer后因头部控制受限，换用skinview3d，支持部件级操作。实现游泳系统：屏幕自适应距离、预计算反弹轨迹、侧身朝向、划水同步，并移除收起功能，支持拖动记忆。最终吉祥物具备眼睛跟随、呼吸、游泳和拖动功能，接受现实并做到最好。
延伸解读
技术选型：从“理想”到“可行”的妥协
作者原本期望使用 Live2D 实现二次元立绘，但素材是 Minecraft 皮肤，只能转向 three.js 生态。在尝试 minecraft-skin-viewer 后，因头部控制 API 不公开而改用 skinview3d，后者提供部件级操作和类型安全。这提醒我们，技术选型时需评估库的扩展性和可维护性，而非仅看初始效果。
游泳系统的实现细节
游泳系统看似简单，实则包含多个细节：屏幕自适应距离、预计算反弹轨迹、欧拉角旋转顺序（YXZ）实现侧身朝向、以及划水动画与位移速度的同步。这些设计避免了实时碰撞检测的抖动问题，并让动画与运动协调，体现了对用户体验的细致考量。
功能取舍：删除比添加更重要
作者删除了原本的“收起”功能，因为实际使用中无人点击，且吉祥物不遮挡视线。同时将拖动改为全画布并持久化位置。这提示我们，功能设计应以实际需求为准，砍掉无用功能能简化交互，提升用户满意度。
Q&A
为什么作者无法使用Live2D来制作博客吉祥物？
因为作者的吉祥物素材是Minecraft皮肤，即一张64×64像素的平面PNG贴图，而Live2D需要的是带骨骼绑定的.moc3模型，两者之间没有自动转换工具。
作者最初尝试了哪个库来渲染Minecraft皮肤？它有什么主要缺点？
作者最初使用了minecraft-skin-viewer库。它的主要缺点是头部控制不公开，无法直接操作头部部件，只能通过整身旋转和hack方式实现，且类型安全差，需要大量使用as any。
skinview3d相比minecraft-skin-viewer有哪些优势？
skinview3d提供部件级API，可以直接操作头部等部件，类型安全，无需hack，并且支持可插拔动画（如IdleAnimation和SwimAnimation）。
游泳系统中，如何实现屏幕自适应距离？
游泳距离通过屏幕对角线长度乘以一个随机比例（0.25到1之间）来计算，这样在不同屏幕尺寸下都能游得恰到好处，不会太短或超出屏幕。
游泳时如何避免撞墙抖动？
通过预计算反弹轨迹，在游泳前使用simulateSwimPath函数计算出从起点到终点的完整路径，包括撞墙反弹，然后按照轨迹移动，而不是实时检测碰撞。
为什么作者移除了吉祥物的收起功能？
因为收起功能毫无意义，用户不会主动收起吉祥物，且吉祥物半透明、位于右下角不挡视线，所以作者删除了该功能，并改为全画布拖动。
最终实现的吉祥物具备哪些功能？
最终吉祥物具备眼睛跟随（鼠标靠近时头转过来）、呼吸浮动、游泳（随机方向、屏幕自适应距离、撞墙反弹、侧身划水）以及可拖动（全画布拖动，位置记忆）等功能。
