来源:站酷  翻译:徐小鸣Juliebug

原文链接：https://articles.sketchtricks.com/5-simple-steps-to-perspective-mockups-in-sketch-f15513d659cf

这篇文章也发布在我自己的博客上，欢迎大家来浏览：juliebug.xfym.info

以下是正文：

我已经有一年多没有在Photoshop中设计用户界面了，而且我一点也不怀念。自从我迁移到 Sketch中后，我的工作流程大幅改善。

我喜欢Sketch的一切（除了一些奇怪的bug）。我仅仅是在为我的设计做mockup的时候才会去打开Photoshop。但是这种情况现在要改变了。

James Tang发布了一款叫做 “Magic Mirror”的Sketch插件，让你可以从一个画板中创建透视图像。他把它描述为Sketch中简单版本的Photoshop嵌入式智能对象。这改变了一切！

Step1

双击插件文件下载Magic Mirror并安装。你也可以把它拖拽到Sketch dock图标上安装成一个特定版本。

Step2

拖拽图片到Sketch dock 图标上，以此来建立一个新的Sketch文件。然后新建一个与图片一样大小的artboard。首先选择图片，然后点击“A” 或者是Insert > Artboard。在右边的检查器中再新建一个artboard。我已经把artboard的名称改为“Mockup Image” ，你可以更改为你喜欢的名字。

Step3

复制你的UIartboard并粘贴到你的透视mockup文件中。

Step4

选择Vector工具(V)，然后用四个点描出屏幕。每个点都在屏幕的顶点上。这很重要：重新命名你刚刚新建的图层，让它和你想要替换的artboard名字完全一样。在这里我把它命名为 “01-timelines-mainScreen”。

Step5

选择你想要替换那个图层，然后点击Plugins > Magic Mirror > Magic Mirror! (⌃⇧ M)。

瞧！就是这样！导出artboard，然后享受你新创作的mockup吧！

如果你觉得这个教程很有用，希望你能够推荐它，让更多的人受益。

我很高兴可以看到你们的作品！Tweet me at@xzarexhc.

Originally published atmarkovuletic.comon August 1, 2015.

PS: 这是我自己翻译的文章，大家也可以来我的个人博客浏览：juliebug.xfym.info。可能翻译的还有一些不妥的地方，欢迎大家来讨论。谢谢！