准备好学习视觉叙事课程了吗？根据他们在Afterpay 为人们设计动画故事的经验，广告公司vi设计公司分享一个分步指南，以帮助您的设计团队创建自己的引人入胜的商业故事。

经过数月的试验和辛勤工作，广告公司vi设计公司成功地创建了Dovetail 和Afterpay 的故事，这是一段关于构建澳大利亚历史上增长最快的消费者技术平台的动画之旅。

这是我们整理的指南，旨在帮助其他想要创建自己的引人入胜的商业故事的设计团队。

第1 步：头脑风暴概念

一旦你决定创建一个引人入胜的商业故事，第一步就是进行几次白板会议，对这个概念进行头脑风暴，以确定你将要制作的究竟是什么。

在这个阶段，您应该已经在考虑要分享叙述的哪些部分......

在这个阶段，你应该已经在考虑要分享故事的哪些部分，以及是否有任何数字或统计数据可以真正帮助提升故事的影响力。写完所有想法后，花点时间将这些想法缩小到最好的几个。现在你要把它们写成一个简洁的设计简介。

第2 步：创建简报

设计简介是您可以在整个过程中不断参考的事实来源，以确保您不会忽视大局。

尽管您可能还没有最终确定所有的设计决策，但一份好的简报可以确保团队中的每个人都在同一个页面上。这是存储您在网上找到的与您想要实现的目标一致的所有灵感的好地方。你可以把这份简报当作一份活的文件，随着某些决定的制定而更新。

广告公司vi设计公司很早就决定要制作一个单页动画网站，并记录该决定有助于指导我们未来对该项目的所有设计决策。

第3 步：情绪板

有了设计简介，您现在可以开始为项目生成视觉方向。这是我们开始情绪板的地方。

情绪板是一种物理或数字拼贴画，可将图像、材料、文本和其他设计元素排列成代表您想要实现的设计风格的格式。它使您可以直观地传达您希望在故事中采用什么样的风格方向，并为您的所有灵感建立一个存储库，以便您的团队可以协作。

情绪板的美妙之处在于它仍然允许您考虑多个设计方向并找出最能引起共鸣的一个。

情绪板的美妙之处在于它仍然允许您考虑多个设计方向，并找出哪个方向最能引起客户（或者在这种情况下，是您的内部团队）的共鸣。

当广告公司vi设计公司开始策划Afterpay故事时，我们不知道是否应该做插图，或者我们的故事是否会是照片拼贴。因此，我们的设计师在等待最初的副本被写出来的同时追求两个方向。

第四步：确定设计方向

在开始编写内容之前，您需要确定设计方向。这是您开始将所有情绪登机融合到一个非常具体的主题、风格和配色方案的地方。

开始将您所有的情绪板融合到一个非常具体的主题、风格和配色方案中。

此时，您应该参考您的设计简介并澄清您的故事的主题（如果您还没有的话）。一旦你确定了一个明确的主题，设计方向就可以从那里开始。对于Afterpay 的故事，我们受到该公司打破现状、在短时间内实现惊人增长以及将自己定位为新的时尚支付选择的能力的启发。这给了我们三个不同的短语作为我们故事的主题：颠覆、增长和“对老顾客来说是个谜”。

一旦你有了一个或一组主题，就该回到你的情绪板并决定你正在考虑的哪种风格最适合这些主题。

广告公司vi设计公司开始研究不同类型的拼贴风格，包括粗野主义和相关的中间方法，但我们认为这不会像插图风格那样补充我们选择的主题。我们选择的平面矢量样式是对上世纪互联网的一种认可，当时新的设计“趋势”会出现并破坏传统的Web 样式。

第五步：写内容

一旦确定了设计方向，您就可以让其他团队成员开始编写将构成您的视觉叙事支柱的副本。

您可能希望以较小的文本块书写，让观众有机会轻松浏览以查找有趣的统计数据、引用和项目符号。

制作视觉商业故事还提供了必须在副本旁边创建设计的额外限制。这意味着您可能希望写入较小的文本块，让观众有机会轻松浏览以查找有趣的统计数据、引文和要点。这也是您应该乐于在初稿准备好后立即将内容移交给设计的主要原因。作为设计师，您将对需要在哪里修剪内容以最好地支持视觉效果有意见，并且一旦您开始拆解副本，这个协作步骤就开始了。

第6 步：拆分内容并创建故事板

一旦内容被移交给设计，要处理一个很长的故事会让人感到非常艰巨。我们的设计总监甚至说，“当那个副本刚进来的时候，这感觉就像一个看起来很吓人的项目。”

为了不被淹没，重要的是把故事分成几个部分，一次一个地看。当您获取副本的不同部分并考虑将补充该文本的视觉元素时，实际上还有另一个头脑风暴期。做大量的草图，最终拿出你最好的想法，制作一个最初的故事板。故事板需要考虑在标准笔记本电脑视口中可以消化多少信息以及视觉效果。

故事板需要考虑在标准笔记本电脑视口中可以消化多少信息以及视觉效果。

如果某些内容不符合故事的设计，这仍然是重新调整某些内容的好时机。作为设计师，您可以在这里相信自己的直觉，向文案团队提出更改建议，并共同完成文案。在开发团队参与之前进行更改更便宜、更容易。

第7 步：开始设计

有了最终的设计方向和故事板，是时候最终为您的故事创建图形了。

虽然动画对于制作精心设计的商业故事并不是必不可少的，但它确实可以提供更具吸引力的体验。您和您的团队需要进行成本效益分析，以确定是否值得额外的设计和开发时间。Afterpay 故事的整个项目成本中约有一半是对不同的基于网络的动画解决方案进行反复试验。

虽然动画对于制作精心设计的商业故事并不是必不可少的，但它确实可以提供更具吸引力的体验。

就像我们在完成副本之前就参与了设计一样，我们在设计完成之前就让我们的开发团队参与了进来。

第8 步：开始与开发团队合作

对于这样的项目，您需要尽早让您的广告公司vi设计公司参与进来。当你的设计变成代码时，在这个阶段会有很多来回。

即使您设计了一个工作原型，与开发团队坐下来并引导他们准确了解过渡和动画的行为方式也很重要。准备好寻找具有与您想要的相似的交互和动画的网站，以便您可以将它们发送给您的开发人员以获取灵感。

与开发团队坐下来，引导他们准确了解过渡和动画的行为方式。

一旦您的设计最终确定并且您的开发人员有一个可以遵循的方向，关注他们的进度仍然很重要，因为您可能必须进行改进（并且还需要发现错误！）

当广告公司vi设计公司开始开发Afterpay故事时，我们希望尽可能多地制作SVG / CSS 动画，而在我们做不到的地方，我们引入了精灵表。然后有一堆关于精灵、关键帧和插图的实验，以使动画与响应式网页一起工作。