Figma入门-填充、描边、效果、导出
Figma入门-填充、描边、效果、导出
前言
在之前的工作中,大家的原型图都是使用 Axure
制作的,印象中 Figma
一直是个专业设计软件。
最近,很多产品朋友告诉我,很多原型图都开始用Figma
制作了,并且很多组件都是内置的,对各种原型图的制作及其友好,只需熟悉一下基本的操作即可上手。
所以我打算一探究竟,听说的终究是听说,自己上上手才是真的。
所以接下来的文章我打算记录从0开始上手 Figma
的过程。
本系列直接从实操开始,有所错漏或者操作错误,还请大家指正。
如果有更高效的使用方式,也欢迎交流。
本篇文章我们来讨论填充、描边、效果、导出。
以之前的登录按钮为例,进行尝试。
填充
选中登录按钮,在右侧的最底部,点击填充右侧的加号
即可选择填充的颜色、比例、是否显示、删除
我们可以进行多个颜色的填充
这个几乎就等于前端开发中的 background-color
属性了
比较特殊的是文字的填充是字色
描边
跟上面的操作相同,描边相当于是前端开发中的 border
属性
描边也有颜色、百分比、可见性、删除按钮
比填充还多了一个位置,可以选择外部、内部、居中和字重
字重相当于是这个描边的厚度
我们点击右边的设置按钮,还可以设置描边的样式等等属性
效果
同上操作,我们新增效果
可以看到有投影、内阴影、图层模糊、背景模糊等可选项
配合不透明度等属性,就可以做出一个类似磨砂玻璃的蒙层效果
导出
导出在这种大型的无边画布里面是很有用的,毕竟不可能用截图去截取整个页面
我们将登录按钮和文字做成一个组,然后连点三次导出的加号,可以看到如下:
导出后可以看到如下结果:
总结
填充:相当于背景色或者字色
描边:相当于边框
效果:投影、内阴影、图层模糊、背景模糊等
导出:可以对多个元素打组,然后统一导出为图片
– 欢迎点赞、关注、转发、收藏【我码玄黄】,各大平台同名。