教程 | Sketch插件Confetti,一键帮你生成随机Ic
2017-05-14 本文已影响303人
西瓜设计研究所

Confetti 是 Yummygum 工作室新发布的一款Sketch 插件。轻量小巧方便。
有时做 Promotion 或 Landing Page 时,会需要设计一个随机的icons pattern作为背景。有了这款插件,设计师们终于不用一个一个 icon 地手挪,来制造“随机”了!
本篇文章阅读预计时间:5分钟。
使用教程

Step1 安装 Confetti 插件

链接:Confetti 插件下载 密码: xrxd
Sketch 目前仅支持 Mac 系统,所以这款插件也是仅 Mac 系统可用。双击安装包安装完成后,Confetti 插件就会出现在 Sketch菜单栏里。

Step2 创建画布,准备好 Icons 素材

链接: 教程Sketch文件素材 密码: 86vx
瓜田君创建了一个长 850px,宽 500px 的画布。并在背景上放了 8 个形状不同的 icons。

Step3 设置 Confetti 数值
选中这 8 个 icons,从 Sketch 菜单栏的 Plugins 里找到 Confetti,点击 Settings。

在弹框里设置期望的 Icons 分布的规则。

例如以上设置,则生成的 Icons Pattern 如下:

Step4 调整 Confetti 数值
若是希望 Icons 的分布紧密一点,则可调整 Columns 和 Rows 的数值。

则生成的 Icons Pattern 效果如下:

好了,是不是很简单?快根据上文,去下载插件和教程素材,自己动手试试吧。
更多精彩,下期继续。
喜欢就点个赞呗 d(^_^o)
西瓜设计研究所
互联网创业 | UI设计 | 开发资源 |教程
未经授权请勿转载,烦请私信作者获取授权
© uirush.com