给为多个应用程序提供支持的辅助文件类型创建一个通用的调色板。比方说，Photoshop和Illustrator应该使用同样的·PNG文件类型图标，而不是拥有各自的规格(Photoshop的·PNG是蓝色的，Illustrator的·PNG是橙色的)。

　　一组旧文件类型图标(反例)

　　我们开始考虑这个新框架的草图。

　　早期的一些草图

　　重新设计这些图标的主要目的之一是，要在不削减它们本身含义的前提下，尽量简化去除过多的不必要的元素。我们去掉了之前的tag，然后把文件类型的字母放在了图标的底部。我们还删除了图标右上角的页面折角来简化设计，创造出更现代的视觉语言。

　　Adobe文件类型图标的演变

　　另一个非常重要的目的是制定一套Adobe的UI设计规范。为了达成这个目的，我们先把文件类型图标放在一边，而是先创建了一个象征物图标数据库，今后的图标设计要么就使用这个数据库中固有的形象图标，要么就创建出与数据库里形象风格一致的新图标。

　　Adobe体系图标数据库

　　最后，我们在文件类型图标中加入了明亮的色彩轮廓，以配合我们产品LOGO的现有品牌特色。这种变化不仅使视觉更聚焦，并且新的图标能够更好地在黑暗的界面中展示，而我们的旧图标在黑暗的页面里几乎会被淹没。

　　在黑暗页面上的UI颜色对比研究

　　第三步：迭代和完成

　　在确定了设计方向之后，我们在整体的产品环境中中测试了新的文件类型图标。在初步的审计阶段，我们调查了每个文件类型图标会出现在哪些不同的操作系统和我们自己产品的哪些领域中。我们还查看了在每个使用环境中每个图标使用不同尺寸和分辨率的适用性。

　　在Mac和Windows电脑屏幕上，我们需要根据不同的尺寸列出一个网格视图的图标列表(最小16px，最大512px)。还有“亮和暗”的UI问题，比如Mac桌面上的“最近的项目”或“Spotlight搜索”。

　　然后我们查看了我们产品的文件图标在产品体系中会出现的地方，比如：素材面板，媒体浏览器对话框，还有你第一次启动程序时出现的欢迎界面。

　　可以想象，这个过程很快就把我们带到了那些文件类型图标会出现的却被我们忽略和遗忘的角落。这是一个很有价值的过程，我们必须更加全面地去思考，一遍又一遍地去查漏补缺。

　　出现在不同环境中的文件类型图标(部分)

　　最后是要查看文件类型图标在Web端和移动端所提供的服务中的UI实现，比如：Adobe Acrobat和Creative Cloud Libraries中。由于这些服务也由不同的设计团队管理，我们不得不去协调很多人，推进我们的计划来修改文件类型设计系统。

　　我们对最终的结果感到自豪，因为新的设计语言更清晰、更一致，代表了Adobe视觉品牌系统进化到一个新的阶段。

　　Adobe全新的文件类型的图标系统

　　第四步：设计新的工作流

　　我们创建了一个新的工作流程，利用脚本，只需按下一个按钮，就可以自动输出 ·PNG文件。这个新的工作模式为我们节省了几十个小时痛苦缓慢的手工工作时间。

　　我们还需要一个更便捷的方法将这些栅格化的 ·PNG文件转化成成 .ICNS (Mac) 和 .ICO (Windows)文件。

　　在过去，我们使用从IconFactory下载的IconBuilder插件配合我们的工作。但是，在新的工作模式中，我们希望有更灵活的方式来解决我们的需求：可以任意拖拽 ·PNG文件，并能自动转换输出为正确尺寸的.ICO 和 .ICNS格式。

　　在多方尝试了很多第三方工具之后，我们决定还是劳烦我们的工程师给我们做一个内部使用的工具，专项定制解决我们的需求。他们做了一个非常神奇的工具，我们喜欢叫它“Captain Icon”，我们使用它打包了所有我们的新版图标。(Captain Icon目前还在内部测试阶段，我们的工程师希望在近期将它分享在GitHub上，供我们的开发者社区使用!)

　　Adobe’s内部的 .ICO and .ICNS 编译器

　　第五步：实施