陌北默

Sketch Material 是一个 sketch 插件,用于生成复杂的原质化设计风格的交互控件,比如表单、表格、标签等等。

 

开发者:Siddhartha

谷歌设计师一枚,这是他的个站?http://www.ccopus.com


下载地址

 

插件功能

一共有十个功能,并没有可视化面板,还请大家配合 Sketch Runner(http://www.ccopus.com)使用。

 

1.?按钮生成

选定文字图层后,使用这个功能可以生成两种类型(Flat、Raised)的按钮,每种类型支持三个状态(pressed,disable,normal)。生成按钮时,会自动将小写英文转化为大写。

Material Design 中关于 Buttons 的描述:[Buttons – Components – Material design guidelines]

 

2.?标签生成

可以设置容器宽度,这个关系到标签自动换行。在输入文字后回车以生成标签,大家可以根据自己的需要选择标签的状态。

Material Design 中关于 Chips 的描述:[Chips – Components – Material design guidelines]

 

3.?弹窗生成

弹窗生成器支持生成移动端和桌面端的弹窗,另外可以选择是否带有标题。弹窗中的所有文字元素均可编辑。比直接置入 symbol 后再做修改要省事多了。该功能非常良心。

Material Design 中关于 Dialogs 的描述:[Dialogs – Components – Material design guidelines]

 

4.?表单生成

支持添加包括单选框、复选框、输入框等五种类型的表单元件。另外,自由度非常高,所有可视字段均可在生成器右侧进行编辑。该功能同样非常良心。

1.7版本中部分字段没有限制字长,会溢出编辑框,我已在 Github 上向谷歌大大反馈。

 

5.?图标库

图标库比较强大,支持四种颜色的换色以及搜索,录入了几乎所有 Material design 里用到的图标。就算不是在设计 md 风格的产品,概念稿的阶段也可用这些图标来占位。

 

6.?吐司生成

吐司生成功能支持移动端和桌面端的吐司,所有可见字段均可编辑。另外,你也可以选择隐藏或显示按钮。

这里按钮的文字输入会有乱序情况,我也在 Github 上反馈了。

Material Design 中关于 Snackbar 的描述:[Snackbars & toasts – Components – Material design guidelines]

 

7.?表格生成

表格生成器支持从 Excel 和 Number 里粘贴复制数据进来,很惊艳。另外,可以选择是否有表头、复选框、投影以及换页按钮,也可以选择表格的尺寸是舒适或紧凑。

生成器的左下角还有个效果预览,挺有心。

 

8.?提示生成 | Tooltip

和 Buttons 功能基本一致,就是选择文字图层后将其生成为提示框。

Material Design 中关于 Tooltips 的描述:[Tooltips – Components – Material design guidelines]

 

9.?文字样式选择 | Typography

选择文字图层后,在样式选择其中选择对应的样式即可更改文字样式,这些都是 Material Design 中规定的样式。

Material Design 中关于文字样式的规定:[Typography – Style – Material design guidelines]

 

10.?浮高调整 | Elevations

当你选择一个图层或分组时,可以用该功能来调节其浮高投影,总共分了六个投影值。

Material Design 中关于浮高的规定:[Elevation & shadows – Material design – Material design guidelines]

 

总结

如果在做 Material Design 风格产品的设计,这款插件无疑是天上掉馅饼,省去了大量重复劳动的时间。让设计师能够专注于设计工作本身,而不是和 symbol 死磕。

当然,也有个小问题,就是使用这个插件后会把 symbol 页面弄的非常乱,这个还请大家使用前预估好风险。

再附赠两个谷歌大大的 Sketch 插件

Sync to Slides:?http://www.ccopus.com/websiddu/sync-to-slides

Symbol me:http://www.ccopus.com/websiddu/sketch-symbol-me

 

作者:徐小马?非科班设计(公众号)

feikeban

转载请注明:学UI网—UI设计师学习教程平台 » 实用!谷歌设计师开发的SKETCH插件

登录收藏

学UI就上学UI网!越努力,越幸运!

“学UI网www.ccopus.com?”最值得关注的UI学习平台! 每天发布高质量的设计教程和分享设计经验,服务于20万UI设计师,帮助初学者快速转型。每周六晚上免费YY公开课(36013311),给大家提供更多免费学习的机会。想成为设计师的你快来关注吧!

【特色推荐】

APP截图站app.ccopus.com” 海量APP截图,让你灵感爆发!国内最好的APP截图站。

UI作业网 zuoye.ccopus.com” 每一个作业题都尽量配有教程,交作业就有大神免费帮你点评作业,爽歪歪!

UI设计导航站 hao.ccopus.com” 专为UI设计学习者打造的资源+学习,双用途的网址导航站。亲爱的,你收藏了吗?

【学UI网 原创文章 投稿邮箱:tougao@ccopus.com,也可以找各个群的管理】

 
你可能喜欢的:
设计师必备!人工智能时代的配色方案?。凵衿鳎?/span>
八分钟了解未来的 UI 设计工具:InVison Studio八分钟了解未来的 UI 设计工具:InVison Studio
Sketch47 新技能:支持设计师之间同步Symbol组件啦Sketch47 新技能:支持设计师之间同步Symbol组件啦
Sketch Libraries功能图文详解Sketch Libraries功能图文详解
大合集!最新版iPhone X 展示模板样机下载!大合集!最新版iPhone X 展示模板样机下载!
最新版IOS 11设计规范,官方源文件下载!最新版IOS 11设计规范,官方源文件下载!
高达1440M!5套高质量UI KIT下载!高达1440M!5套高质量UI KIT下载!
5款漂亮的UI KIT合集PSD&SKETCH下载!5款漂亮的UI KIT合集PSD&SKETCH下载!
十分钟了解排行第一的 Sketch 插件 :CRAFT十分钟了解排行第一的 Sketch 插件 :CRAFT
干货合集!价值332美元5套ui kit!PS&SKETCH干货合集!价值332美元5套ui kit!PS&SKETCH
?