Scanner Pro 自 2009 年起就登陆 App Store，多年来已从一款简单的扫描 App 成长为真正复杂的专业工具，功能之多，大多数用户都未必会全部用到。这样的成熟是一种优势，但团队希望，它在作为严肃专业工具的同时，依然让人感到亲切、有温度。

Scanner Pro 近期的全面改版，正是为了弥合这道距离。 

改版中一个看似低调的决定，最终却成了最引人注目的亮点之一：Scanny，一个由光构成的小小蓝色立方体，如今就住在 Scanner Pro 的世界里。 

我们与 Readdle 设计负责人哈莉娜·沃洛沙年科（Halyna Voloshanenko）聊了聊 Scanny 的诞生过程。

与用户建立情感连接

打造 Scanny 的构想随着改版自然而然地成形。“主要目标是在全面改版期间提升品牌认知度，并加强与用户之间的情感连接，”沃洛沙年科说，“我们希望焕新与用户的沟通方式。借助吉祥物，传递营销信息、吸引新用户都会容易得多。”

Scanner Pro 的“年龄”让这项任务更具挑战。 

上线近二十年后，这款 App 早已超越基础扫描，成为功能密集的专业工具：强大，却未必让人一见就亲近。“我们希望让这款复杂的专业产品更容易理解，更有情感，也更有人情味，”她解释道，“正是这个愿望，催生了这次改版，也促使我们寻找为 App 注入情感的方式。我们意识到，吉祥物能帮上忙。它不会重塑产品本身，却能让产品亲切得多。”

按照团队的定义，这项任务非常具体：让界面更容易上手，并让每次新版本发布更像是有人带您四处参观，而不是递给您一份更新日志。

Scanny 是怎样诞生的

团队并非一蹴而就地找到了 Scanny。“我们总共做了四套完整的概念方案，”沃洛沙年科说，“最终选定了第四套，因为它最能体现我们技术的本质，又不会喧宾夺主。这个方向和产品再契合不过：简洁、现代、极简。”

在这些概念方案诞生之前，团队先把目光投向了外部。“我们做了市场调研：研究了 Duolingo 的猫头鹰、Monobank 的猫，还有 Headspace 和 Gentle Streak 的角色，”她说。他们希望先了解吉祥物可以扮演的不同角色，再决定哪一种适合 Scanner Pro。“我们感兴趣的是分析吉祥物具体用在哪里、在产品中扮演什么角色，以及活跃在哪些沟通渠道中。 

在很多这类 App 中，整个品牌都围绕角色打造。而我们则在寻找属于自己的完美平衡：让吉祥物担任配角，只是含蓄地为我们这款工具严肃的界面锦上添花。”

Scanny 究竟是什么

请沃洛沙年科用几个词来形容 Scanny，她选择的是沉稳，而不是可爱：“Scanny 代表着沉稳、可靠、现代，以及温和的引导。”每一个视觉选择都既要好看，又要承载其中一种特质。

选择圆角立方体的造型，是为了让他更平易近人。“为了让严谨的技术更有人情味，我们选择了极简的造型，但舍弃了尖锐的棱角，”她说，“这些柔和的圆角让普通的立方体变成了亲切、乐于助人的助手，也在视觉上呼应了 iPhone 主屏幕上图标的形状。”而深蓝色则起着相反的作用，让 Scanny 始终与严肃的专业工具紧密相连。“为了保持严肃专业工具的质感，我们使用了深蓝色。这直接延续了我们的视觉风格，有助于建立用户信任。”

光，是 Scanny 唯一真正的表达方式。“他主要的互动工具是一束光，”沃洛沙年科解释道，“一方面，这是对扫描过程本身直接而清晰的隐喻；另一方面，那柔和的光芒也是他表达关心的方式：用视觉告诉您，他正在守护您的文档，帮您让日常工作更轻松。”

就连他的身世也与产品息息相关。“扫描和优化图像的过程是一步一步、一个像素一个像素完成的，”她说，“所以 Scanny 最初只是一个普通的平面像素，后来才有了生命，变成了一个立体、灵动的立方体。”

团队舍弃了什么，和保留了什么同样重要。 

Scanner Pro 的用户以 30 岁及以上的成年专业人士为主，这从一开始就划定了设计边界。“我们尽量避免过于孩子气、卡通化和过度夸张的表现，”沃洛沙年科说，“为了不把处理文档变成娱乐，也为了维护用户对严肃工具的信任，我们放弃了经典的拟人化设计：手臂、腿和复杂的面部表情。”

从 Crazy 8s 头脑风暴到 Figma 和 Rive 

最终的立方体经历了三个截然不同的阶段。 

第一阶段是调研：梳理竞品在哪些地方使用吉祥物，以及 Scanner Pro 自身有哪些触点可以承载吉祥物，从而为后续的探索确定技术限制和评判标准。 

接着是头脑风暴：团队汇集了大家对扫描的各种联想，用 Crazy 8s 快速产出创意，并根据品牌关联度、UI 适配性、动效潜力以及在营销活动中的适应性等标准为结果打分。经过这轮筛选，留下了三个方向。

最后一个阶段交给了设计团队。 

“我们的营销设计师安雅做得非常出色，”沃洛沙年科回忆道，“她针对选出的三个方向分别做了概念方案，并向团队进行了展示。 

展示过程中，我们一起讨论了每个方案，逐一分析了利弊。”最终并没有哪个方案直接胜出，第四套概念是集三者之长拼合而成的。“过程中没有急转弯，更像是一个不断演进的过程，”她说，“在打磨完前三套概念后，我们发现没有哪一套单独来看是完美的。于是我们就从三轮迭代中挑出最成功的方案，把它们组合在了一起。”

据她说，最难的决定与其说是选哪个概念，不如说是 Scanny 应该承载多少细节。“我们一直在寻找一个微妙的平衡：要创造出尽可能简单、易于制作动画、不会让严肃的 UI 显得臃肿的造型，同时又要有自己的个性，不能显得乏味。”

早期草图是在 Crazy 8s 环节中手绘完成的，之后的一切都转到了 Figma 上，Procreate 则用于快速探索。 

动效团队加入后，更大的限制随之而来：Scanny 最终将以 Rive 交互动画的形式出现在 App 和网站上，而 Rive 能渲染的渐变、复杂光晕等效果，从 Figma 设计稿转换过来时未必能完整保留。“主要的限制是，在 Figma 中只使用动效设计师在制作动画时能 100% 精准还原的效果和视觉方案，确保角色在任何地方看起来都一致，”沃洛沙年科说。 

这意味着要反复测试和调整光束的光晕、造型的柔和过渡等细节，让它们始终保持一致，包括在浅色和深色界面模式下。

真正的跨职能项目

Scanny 并不是设计团队独自完成的。“我们组建了一个跨职能团队：产品负责人、产品经理、产品设计师，还有作为设计负责人的我，”沃洛沙年科说，“我们还邀请了公司的创意设计师和一位独立顾问，以获得来自外部的全新视角。”

尽管有这么多人关心最终结果，整个过程却出奇地没有冲突。“没有发生过严重或激烈的分歧，”她说，“因为我们从一开始就明确了限制条件，并就隐喻达成了一致，团队拥有共同的愿景。内部反馈更多是帮我们打磨细节，而不是改变整体方向。”

在最终确定 Scanny 的情绪表现之前，团队把他带出了办公室，用真实的 App Store 截图和营销素材在真实用户中进行了测试。“我们在 App Store 截图和营销素材上测试了这个吉祥物，”沃洛沙年科说，“测试结果是积极的，证实了我们的假设。在那之后，我们才开始最终打磨他的情绪和其他状态。”

名字的由来，以及他最先出现在哪里

这个名字简单到几乎无需多想。“Scanny 这个名字来自英文单词 scan（扫描），但听起来柔和友好，突出了他作为亲切助手的角色，”沃洛沙年科说。

在公司内部，大家的反响非常热烈。“团队都很兴奋，”她说，“Scanny 完美地凸显了我们更新后的愿景和界面。他为产品带来了绝佳的平衡：Scanner Pro 依然是一款专业工具，但现在感觉亲切得多，也更有人情味。”

Readdle 正在逐步推出 Scanny，一个触点接一个触点地上线。“我们选择了循序渐进的推出策略，以免在改版期间让用户应接不暇，”沃洛沙年科说。Scanny 将首先出现在 Scanner Pro 的网站和 App Store 截图中，随后进入产品本身，从付费墙开始，再逐步扩展。团队还为一些细节保留了悬念：“我们暂时不会透露所有细节，因为想给用户带来惊喜。”

回顾整个过程，沃洛沙年科最自豪的，是团队选择了不去做什么。“我最自豪的是，我们没有走带脸和表情的经典吉祥物路线，而是只靠 3D 立方体简洁的造型和光的动态来传达个性，”她说，“Scanny 的效果和我们设想的一模一样：低调含蓄。他不会把注意力从文档工作上抢走，而是非常自然地与界面融为一体。”

如果能重来一次，她想改变的并不是某个设计决定。“我大概会给过去的自己一个建议：把最初的时间预估至少乘以三，”她说，“一开始，我们觉得设计一个角色是件相当简单的事，很快就能搞定。但正如设计中常见的那样，把一件东西做得真正简单、易懂，才是最难的。”

她希望人们感受到的，最终也很简单。“我希望用户在 App、广告或网站上看到 Scanny 时，能从他身上认出扫描技术本身：聪明、快速、易懂，”她说，“我们希望吉祥物流畅的动作和柔和的光芒，能让处理文档时与 App 的互动更加生动。”

Scanny 已经出现在 Scanner Pro 的网站和 App Store 截图中，更多 App 内的亮相即将到来。敬请留意：他正在赶来的路上。