DARVA – 活动助手

DARVA 是一个可爱的动画机器人，它会在活动中为我们提供帮助，通过与人聊天，这样我们就不必过多地重复自己。

DARVA 是一个可爱的动画机器人，它会在活动中为我们提供帮助，通过与人聊天，这样我们就不必过多地重复自己。

有趣的事实：DARVA 是“D”的首字母缩写激活A nalog R obot V 虚拟 A 助手”。

第一步是创建一个模拟机器人，或者任何你觉得动画化的东西。我画了一个机器人并用纸制作了零件。一旦我对整体外观感到满意，我就把所有东西都剪掉了。

提示：在开始切割之前先拍下完整的毛毡片，您可以将它们用作动画的背景！

好的，现在进入最耗时的部分：缝纫！我沿着所有边缘缝合，使 DARVA 具有手工制作的外观和感觉。有些部件是双层毛毡，使其更具弹性。确保将您想要制作动画的所有部分分开，这将使您以后的生活更轻松！

是时候将您刚刚制作的模拟产品数字化了！在独特的背景上展开所有部分，因为这样可以更容易地将所有部分切成部分。最好拍一张包含所有元素的照片，这样零件的比例将保持不变。

提示：按照您在动画中组织它们的方式旋转所有部件，因为这将使所有部件的照明角度保持相同，并在最终版本中真正将它们整合在一起。

将图片加载到您选择的照片编辑软件中，并剪下所有部分。以支持透明度的文件格式（如 PNG）使用透明背景单独保存它们。

为了切出零件，我使用了 Photoshop 中的快速选择工具。结果实际上比我预期的要好，我只需要手动擦除少数图片中的东西。

现在你有了一个可以制作动画的数字化模拟物！

为了让 DARVA 栩栩如生，我用 HTML 画布和 JavaScript 创建了一个网页，因为它可以在任何平台上运行。通过下载所有库，它还可以离线工作，这很重要，因为众所周知，事件在提供可靠的互联网连接方面很糟糕……

简而言之：通过 HTML canvas 元素，您可以使用 JavaScript 将图片、形状和文本等图形添加到网页中。为了简化此过程并添加流畅的动画，我使用了 Create.js 和 Tween.js 库，您可以在此处找到。

代码在附件中添加，其作用如下：

一些动画添加了一些随机元素，使 DARVA 更加逼真。嗯，当然可以像机器人一样栩栩如生。例如，仪表旋转到随机位置，眼睛在随机时间内随机向左或向右看。

其他动画的计算量更大，例如每 5 秒更改一次的对话气泡中的文本。

最后，一些动画是通过点击或触摸屏幕的某些部分来激活的，在这种情况下是 DARVA 的头部和腹部。

最后，让我们在 Raspberry Pi 4 上运行 DARVA！为什么？好吧，为什么不呢？这么小的东西可以处理这些类型的动画真是太棒了！

为了显示 DARVA，我们使用了纵向模式的触摸屏。虽然您可以轻松地在 Raspberry Pi 上设置屏幕旋转，但触摸屏仍然反向工作......经过大量试验和错误后，我们决定让 Pi 在横向模式下运行并仅旋转所有动画。

旋转和重新定位所有图像并重做动画是一场噩梦，所以最好在开始编程之前弄清楚这部分。

除此之外，在 Chromium 中运行网页在开始时会产生一些令人迷惑的效果。当一切都完成后，我们再次尝试，不知何故问题解决了？？？编程的魔力……？

虽然动画在 Chromium 中是最流畅的，但它在 Firefox 中也能很好地工作，只是速度慢了一点。

多啊！我们有它，DARVA，一个可爱的小动画机器人，它将在活动中帮助我们！

资料来源：DARVA – 活动助手

制造工艺