前段时间苹果发布的 tvOS 支持图标与 Banner 自带视差效果，给设计师们带来了新的设计维度与可能。苹果发布了一个小插件用以方便设计师，我通过制作一枚美柚的图标来与大家分享制作过程吧。最终的例子如下：
按照苹果提供的 Design Guide ，在一个图标上使用四个图层，每个图层放置不同的内容，使得图标在运动的时候有立体感。不同的层有不同的尺寸：
大概是苹果认为对设计师而言介绍文档太过枯燥了，动画效果只能脑补。所以，贴心的苹果官方最近放出了一个 Phhotoshop 插件以及一个预览工具造福大众。 下面我们来简单介绍一下这个小工具以及实现一个小例子。
第一步：下载 App icon Safe-zone Template
这是苹果官方预设好的一个 .psd 文件，打开之后我们可以看到几个已经命名好的透明图层，这就是你的画布，可以开始创作啦。在设计的时候想清楚不同图层的内容就好了。当设计基本完成的时候，就开始进入第二步了。
这里有几个小细节需要注意：
1. 不能超过五个图层。
2. 必须要有一个图层命名为 Background 。
3. 所有图层都要在 Art 文件夹内。
第二步：下载安装 Parallax Exporter beta
Parallax Exporter beta 是 Photoshop 插件，但是它仅仅支持CC 2014及以后的版本。可从搜索引擎下载压缩包，解压后会看到两个文件，安装 ParallaxExporter.pkg。然后在 Photoshop — Windows — Extensions — 选择 LSR. 如果可以打开，说明这个插件就在 Photoshop 里完整的安装好啦。
打开设计稿，然后打开我们的插件，就会看到这样一个工具页面。插件有两个功能，一是实时预览，在方形预览区域内移动鼠标，便可以看到我们设计的图片的视差效果。二是导出.lsr文件，这个格式即是 tvOS 使用的图标格式。导出的文件会同样保存在 psd 所在的文件夹。导出之后，苹果另外提供了工具方便大家预览。
第三步：下载安装 parallax Preview beta
Parallax Preview beta 目前仅支持Mac用户使用，下载安装之后打开软件。将刚才导出的 .lsr 文件拖入界面，在Preview的左侧栏是文件的分层，中间是同样可以使用鼠标操作预览视差图的操作区。右侧边栏是用以编辑指定图层的尺寸，以及位置。同时你可以更换预览区域的背景，使用苹果提供的几种背景，或者使用自己的。这样，你就轻易的做出了第一个苹果电视的图标啦。 ：）
END.
— 点个赞再走吧！ —
