技术文章

您可能知道开发人员 Guilherme Rambo 作为义务警员的工作，他打击了 Apple 的秘密，并通过他们的漏洞赏金计划帮助他们修复 macOS、iOS 和其他操作系统中的安全漏洞。

但早在 2016 年，Guilherme 就失业了，正在寻找一个可以与插画家 Ewerton Lima 合作的项目。他们知道自己拥有正确的技能组合来做出伟大的事情，他们只是不确定是什么。但这一次，苹果在同年的WWDC上宣布了iMessage的App Store，从而拯救了Guilherme。

“他们展示的演示之一是iMessage应用程序，用户可以通过组合不同的配料将冰淇淋蛋筒组装在一起。就在那时，我萌生了做类似事情的想法，但用chibis而不是冰淇淋，“Guilherme解释道。

Ewerton立即加入。“我一直很喜欢画画，所以创造其他人能够以不同的方式组合起来创作自己的资产的想法很诱人。”

这就是ChibiStudio的诞生方式，这是一款面向动漫和赤壁艺术爱好者的角色创建应用程序。您可以通过从鞋子和发型等各种物品中制作不同的头像来表达您的创造力——所有这些都不需要擅长绘画！

如果你知道你的苹果历史，你可能知道iMessage App Store失败了，但它并没有让ChibiStudio失望。值得庆幸的是，该应用程序的 iOS 版本找到了它的利基市场，我们在这里讲述它的故事。

ChibiStudio的制作过程

对于 Ewerton 来说，创意就在 Sketch 中开始。“[我将开始]主要使用矢量工具，到处使用一些原始形状。这是可能的，因为这些图纸都是从平坦的正面角度绘制的，因此直接在 Sketch 中绘制它们可以非常有效地完成，“他解释道。

但是，他的ChibiStudio工作流程与其他项目的不同之处在于，他需要强调构建和组织文档。因为他正在使用可定制的头像，所以他需要密切关注他如何对用户将尝试的不同项目进行排序。

为了让事情井井有条，他将为每个物品包创建一个新的 Sketch 项目。然后，他将使用图层组来包含单个项目，并使用命名约定，如 hair-1、hair-2、shoes-1、shoes-2。他还将按填充颜色组织项目，因为它们稍后将成为用户可以在应用程序中自定义的颜色插槽。

和 Ewerton 一样，Guilherme 也长期使用 Sketch 来设计用户界面和网站。他知道它对 SVG 有很大的支持，而 SVG 是 ChibiStudio 的支柱。“我们希望在应用程序中为用户提供尽可能多的自由度，我们还希望我们的资产能够适应更高分辨率的屏幕和媒体，因此从一开始就想通过应用程序发布基于矢量的资产。”

为了实现这一点，他创建了一个插件，将文档中的所有图层组导出到单个 SVG 文件，并根据组命名它们。他还使用内部 Mac 应用程序工具来组装项目包并编辑一些元数据，以包括用户可以在应用程序中编辑的颜色插槽。

为了获得最佳性能和成本效益，他们使用内部工具将 SVG 转换为核心动画层，这是 Apple 平台原生的技术。创建包后，此工具会将包编译到应用附带的资产目录中。

“这个工作流程允许我们保留所有矢量数据，从 Sketch 开始，到 SVG，一直到 iPhone 上运行的应用程序，在那里它们成为核心动画层。这样一来，应用程序可以非常高效地运行，但我们保留了使用矢量资产的所有好处，包括用户自定义项目各个部分的颜色的能力，“Guilherme 解释道。

以用户为原则

当然，实现梦想的工作流程并非一蹴而就。ChibiStudio 二人组首先必须克服许多挑战。“至少对我而言，它正在考虑每个单独的项目如何与其他项目整合。我们有十几个物品包和数千个物品，但它们必须像拼图一样组合在一起。不能有任何奇怪的剪裁或重叠，“Ewerton说。

他的目标之一是确保他仔细地为图层中的每个项目分配位置。这样，当用户将一个项目添加到他们的角色中时，它将准确地显示用户期望它相对于其他项目的位置。虽然用户可以在应用程序中自定义位置，但默认值必须有意义。

他们还努力为应用程序的画布做出用户界面决策。“我们有很多功能和想法，但我们不想让应用程序太复杂，因为那些只想挑选一些项目并在几分钟内完成一个漂亮的头像的人。”

但是，他们发现了简单性的另一面的另一个挑战：功能可发现性。例如，用户总是能够点击赤壁上的项目来选择和自定义它们，但许多人没有意识到他们可以。“作为妥协，我们最终引入了一个工具栏，可以访问以前隐藏在手势或菜单后面的许多功能。”

理念，遇见发展

为了提供最佳体验，ChibiStudio 团队专注于创建流畅的交互、酷炫的功能和大量可供选择的头像项目。但是性能呢？

“作为开发人员，处理应用程序必须处理的数据量一直是一个挑战。我不想让用户在应用程序中购买新包后等待资源下载，因此从 1.0 版本开始，直到今天，我们都会将所有库存与用户从 App Store 下载的应用程序一起发货，“Guilherme 解释道。

Guilherme 依赖于传统技术（如数据压缩）和技巧（例如不对某些元数据片段进行编码）的组合，这些元数据可以在运行时以其他方式推断。您还可以在 Guilherme 的博客中了解他们如何创建轻 App，让用户无需下载和安装完整的 App，即可试用 App 创建角色的主要体验。

收获回报

虽然经济上的成功通常是应用程序创建者所追求的，但除了财务自由之外，还可以获得更多。

“我一直对自己的工作非常自觉，所以我一直在寻找外部的认可。因此，当我们从用户那里得到关于ChibiStudio如何帮助他们发展角色和锻炼想象力的反馈时，我就会为我们所做的工作感到自豪，“Ewerton说。

“正如 Sketch 团队可能知道的那样，使用创作工具有一些非常特别的地方。我们根据某些想法和用例来创作艺术作品和开发功能，但我们的用户总是对他们想出的东西感到惊讶，“Guilherme 解释道。“我最喜欢的事情之一是，我们了解到美国的一些教师在课堂上使用ChibiStudio，让他们的学生将历史人物描绘成chibis，以便在他们的演讲中使用。”

自 2016 年以来，Guilherme 和 Ewerton 与 ChibiStudio 合作取得了长足的进步，我们为他们使用 Sketch 创作的作品感到自豪。如果你想尽快开始自己的项目，Guilherme的建议是始终保持简单。“这样你就可以在可预见的未来维护工作流程，或者至少在它适合你的时候。试图变得花哨通常最终会导致一个难以管理的工作流程，你开始偏离这个工作流程。