mmmotif

mmmotif

491
"mmmotif是一个国外的网站,可以生成非常具有形式感的等距图案,我们可以选择设定几何图案的样式、各距离、色彩等等 参数,生成独一无二的图案排列图片去使用,这些生成后的结果可以导出 SVG 格式的素材和代 码应用在实际的设计项目当中!
分类:

介绍

神器介绍

mmmotif 是一个国外的网站,它可以生成非常具有形式感的等距图案,我们可以选择设定几何图案的样式、各距离、色彩等等参数,生成独一无二的图案排列图片去使用,这些生成后的结果可以导出 SVG 格式的素材和代码应用在实际的设计项目当中! zz-0426-motif-02 跟它两个哥哥一样,mmmotif 也是免费、无需登录注册即可使用的工具类神器!下面马上开始介绍它的用法!

使用说明

下图即是网站的全部内容,由以下 4 个版块构成: zz-0426-motif-03 结果预览区没有操作项目,只用做展示,我们在样式设置区和基础形状选择区操作调整后的效果,会映射在结果预览区,就像这样: 现在开始说样式设置区吧,区域内有 7 项可设置项目,如下图: zz-0426-motif-05 Base Color 是定义图中形状的颜色的,我们可以直接键入 HSL 色值修改。angle 是调整形状的角度的,Scale 是形状数量的,translate X 是设置形状的 X 轴位移度,translate Y 是设置形状的 Y 轴位移度,skew X 设置形状的 X 轴偏移倾斜量,skew Y 设置形状的 Y 轴偏移倾斜量。 纯文字叙述可能不太直观,所以大家请看下图 GIF,样式设置区的各个按钮设置效果就一目了然了: zz-0426-motif-06 样式设置区右边的区域是基础形状选择区: zz-0426-motif-07 我们可以看到有 15 种形状供我们自选,切换的方式很简单,点击一下你想要的形状就会马上更换!

保存方式

通过上面的使用说明,相信大家也清楚图片的生成方法了,现在说一说保存方法。在页面右下角有「Save(保存)」和「Copy SVG(复制)」这两个不同的保存方式: zz-0426-motif-08 在上面介绍神器的时候我们不是说到结果图片本质是一个 SVG 么,SVG 一般会有两种保存结果,一个是保存为 SVG 图片,一个是复制 SVG 代码。「Save(保存)」和「Copy SVG(复制)」就是对应这两种保存结果的。 点击「Save(保存)」,会自动下载一个 SVG 文件到本地: zz-0426-motif-09 之后我们就可以拿着保存下来的 SVG 在任何设计软件里去再次修改样式了! 那点击「Copy SVG(复制)」,会复制出 SVG 代码,然后就可以去到任何一款设计软件/开发里粘贴进去使用,以 AI 为例,粘贴后会出现: zz-0426-motif-10 不管是保存下来的 SVG 还是复制粘贴进软件的素材,都同样可以再次修改样式,任你编辑~你看我一分钟不到就得到了一张重复形状的图片,要是用 AI,从创建画布开始算,做一个立方体都得一分钟吧: zz-0426-motif-11