/一键生成样机？原来Figma还能这么用！
最新文章2023-09-03

一键生成样机？原来Figma还能这么用！

做项目汇报和作品集，在产品效果图上加上一些样机，能够让画面更加出彩。


开始时，大多用 PS 手动变形，效率很低。


后来出了很多样机工具，有的还能生成视频，效率高了，例如：推荐个免费的3D宣传片在线生成器





但是方案总是不停地改，需要反复从设计工具中导出 UI 图，再导入样机工具，很麻烦。


最近发现一款免费插件，可以在 Figma 里面一键把 Frame 直接生成样机，不需要导出图片。



我自己试用了一下，发现真的挺方便的：





这款工具自带样机，预览图里不带🔒的都是可以免费使用的：





安装地址在文章底部，下面先给大家快速介绍一下使用方法：





1. 首次登录


点开插件的窗口后，你会看到下面这个窗口。






你需要先点击第一个链接进入他们官网，进行注册。


然后点击第二个链接，找到你的 secret API key，复制到刚才的窗口。



回到插件窗口，点击 SAVE AND CONTINUE 按钮，就能开始用了。

2. 选择样机


完成首次登录后，你会看到很多样机。






没有🔒的都是可以免费使用的，选择一个点击一下，就能看到画布上出现了一个空白画板和一个空白样机。










3. 拖入画稿


你可以把已经做好的页面拖入那个空白画板待用。



如果尺寸不合适的话，可以点击左上角菜单右边的那个图标，把 Move 模式改成 Scale 模式（也可以直接按 K），然后再调整 Frame 大小。





如果担心来回改用麻烦，可以把编辑中的 Frame 创建成 Component，再把 Component 拖入空白画板。






4. 生成样机


保持刚拖入画稿的画板为选中态，然后在插件窗口点击 Render Selected Frame。






就会发现原来的空白样机上，按照画板里的图稿生成了界面效果图。





如果画稿有修改，再用同样的方法点击 Render Selected Frame 就能更新样机。






安装地址



对于经常用使用 Figma 做报告和作品集的小伙伴，这个插件比很多第三方样机工具都方便多了。



如果有兴趣试一试的话，我分享一下链接：




想要学习或者练习交互，但又缺少机会和动力的朋友，可以了解一下「体验设计学习社」。


无限制作品集详细点评+答疑+免费训练营&学习打卡等活动，更有各类大厂内推：




如果你只是想要多认识一些同行，也可以加入我们无广告的纯粹体验研讨微信群：


本文来自微信公众号“体验进阶”（ID：Advanced_UX）。大作社经授权转载，该文观点仅代表作者本人，大作社平台仅提供信息存储空间服务。

TAGS:

相关文章