Sketch 插件介绍:Style Inventory(样式清单)

译者最近在做一个比较大的设计项目,才开始系统接触设计规范相关的内容,根据项目也需要生成一套样式清单供其他设计同事和研发团队使用。看到这款 Sketch 插件后发现有几个功能比较实用,比如能够一键汇总、导出所有项目/画板中所用到的颜色、字体样式信息。因此简单翻译了一下本插件开源地址的 Readme,希望有需要的朋友可以参考,原文地址如下:getflourish/Sketch-Style-Inventory · GitHub

注:原文页中有 gif 动图,因为专栏不支持动图显示,所以只截取了一帧,如果需要可以去 github 页面查看。

翻译:镇雷

设计需要自由,需要在一片混浊中探索出光明所在,但是设计同样也需要条理性和组织结构。Sketch 在自由与条理两方面都做的不错,设计师们经常需要清理画布与文档,把所做的工作整理出来(交付给其他同事),但要在一个硕大的工程中整理出字体样式、颜色等信息结构并非易事。 Style Inventory 就是帮助你做这样一件事的:能够纵览所有设计过程中使用的样式信息,并且帮助设计师将同样样式的图层进行合并。

软件最近更新于2015年4月26日,目前已支持当前最高版本的 Sketch3.3。具体安装方法可以在开源地址下载安装文件并拷贝到 Sketch 的插件目录下,或者也可以使用 Sketch Toolbox 搜索进行安装。

功能简介:

Generate(生成)

选中某一个页面后,使用本功能可以自动生成一个包含了所有使用过颜色、字体样式、符号在内的画板。

快捷键:ctrl + ⌘ + ⌥ + I

(Export Metadata)导出元数据

当在配置窗口中勾上「Export Metadata」选项后,Sketch 可以将你项目中的元数据和图片导出,这样就方便交付给开发同事了。导出形式:颜色(JSON)、符号(PNG)、字体样式(JSON)。

快捷键:ctrl + ⌘ + ⌥ + I

(Select Layers by Color on Artboard)在画板中根据颜色选择图层

选中一个图层之后,可以通过此功能将本画板内所有与当前图层具有相同填充或字体颜色的图层一起选中。

快捷键:ctrl + ⌘ + C

(Select Layers by Name)根据名字选择图层

选中一个图层之后,可以通过此功能将所有与当前图层名字相匹配的同层一起选中。此功能同样适用于复制图层时自动命名产生的数字结尾,如 Rectangle 1,Rectangle 2,…

快捷键:ctrl + ⌘ + N

(Replace String)批量替换字符命名

通过本功能可以将所有选中的文字图层进行统一命名替换。

快捷键:shift + ⌘ + K

最常用的功能就是下面两个了,再简单提一下:

样式清单

生成包含颜色、字体样式在内的可见样式清单,方便用户纵览所有设计要素,也可以将样式非常接近的内容进行合并,还可以将字体样式通过 CSS 文件导出。

生成字体样式清单

生成一个画板,其中包含了本项目中所有用到的字体样式。

时间: 2024-10-30 20:38:25

Sketch 插件介绍:Style Inventory(样式清单)的相关文章

25款轻巧实用的SKETCH插件大合集

  Sketch绝对是除了PS和AI之外在Mac 平台上最热门的设计工具,它更新迅速,功能完备,并且非常契合目前对于UI设计的需求,最重要的是,Sketch 小巧灵便不臃肿,还具有相当强大的可拓展性. Sketch 的优秀之处就是从它的可拓展性上延展开的,围绕着它的不仅有大量的设计师,还有一个活跃的开发者社群,许多优秀的免费插件都由此诞生.这些来自开发者社群的优秀插件从各个不同的角度完善.强化了Sketch的功能,让设计项目可以更加快速高效的完成.当然,在下载这些免费插件之前,请先装上Sketc

让你设计效率疾速提升的免费SKETCH插件

  尽管Bohemian Coding团队一直在尽力更新提高Sketch的易用性,完善功能和特性,但依然无法满足设计师和开发者的全部需求和愿望.好在开发者社区並沒有坐以待毙,而是积极地开始为Sketch开发各种各样地插件. 有些开发者打算用自己开发的插件替代系统预制的组件,旨在让GUI.图标和原型地设计拥有更大地定制空间,还有一些开发者则选择试图开发出提高工作效率,完善工作流程地组件,解决各种尚未完善地问题.如果你打算借助Sketch从零开始设计一个项目,那么下面介绍地许多插件和工具应该能给你极

常用Maven插件介绍(下)

转自:http://www.infoq.com/cn/news/2011/05/xxb-maven-8-plugin     我们都知道Maven本质上是一个插件框架,它的核心并不执行任何具体的构建任务,所有这些任务都交给插件来完成,例如编译源代码是由maven- compiler-plugin完成的.进一步说,每个任务对应了一个插件目标(goal),每个插件会有一个或者多个目标,例如maven- compiler-plugin的compile目标用来编译位于src/main/java/目录下的

Xcode7安装Alcatraz以及插件介绍

Alcatraz是Xcode的插件包管理工具,很多优秀的插件都能在上面找到,今天我就来说说如何安装Alcatraz以及推荐几个优秀的插件. 安装Alcatraz 1.关闭Xcode 2.如果你之前安装过Alcatraz,卸载它,运行命令: rm -rf ~/Library/Application\ Support/Developer/Shared/Xcode/Plug-ins/Alcatraz.xcplugin 3.最关键的一步,运行命令 find ~/Library/Application\

从零开始编写自己的C#框架(6)——SubSonic3.0插件介绍(附源码)

原文:从零开始编写自己的C#框架(6)--SubSonic3.0插件介绍(附源码) 前面几章主要是概念性的东西为主,向初学者们介绍项目开始前的一些知识与内容,从本章开始将会进入实操阶段,希望跟着本系统学习的朋友认真按说明做好每一步操作(对于代码最好是直接照着文档内容在你的IDE中打一次出来,而不是使用复制粘贴),这样对你理解后面的章节会有较好的帮助,如果你对我这种书写方式有什么建议或支持,也希望在评论中留言,谢谢你的支持.   SubSonic3.0简介 SubSonic是Rob Conery用

带你了解超好用的SKETCH插件

  通过上两节的文章,大家可能已经对sketch这款软件的基本操作有了一个大概的了解.但很多朋友可能会有疑惑,"好像sketch的功能也没有那么强大啊?""也就是个普通的矢量绘图软件吧?" 恩,你错了,因为你忽略掉了一件东西-插件. 插件是让sketch保持强大的独门绝技,很多软件看起来不支持的功能,通过插件都可以实现,大大提高工作效率. 下面,静电来介绍下sketch常用的,受大家欢迎的插件. 一.安装插件的方法 sketch有两种插件安装的方法,一种是传统的安装

几个优化WordPress中JavaScript加载体验的插件介绍_php技巧

WordPress 本身以及主题和插件通常需要加载一些 JavaScript 来实现某些特殊功能.为了最大限度地保证兼容性,不至于出现 JavaScript 失效的情况,所以一般在页头加载 JavaScript 文件.但是根据 Yahoo 开发者论坛的建议,加载 JavaScript 应该尽量在页尾以提高页面的显示(响应.渲染)速度.本文根据作者的使用经验介绍几个相关插件,并说明如何在某些特殊页面仍然在页头加载 JavaScript. 下面先简单介绍几个相关的优化 JavaScript 的 Wo

WPF中的Style(风格,样式)

在WPF中我们可以使用Style来设置控件的某些属性值,并使该设置影响到指定范围内的所有该类控件或影响指定的某一控件,比如说我们想将窗口中的所有按钮都保持某一种风格,那么我们可以设置一个Style,而不必分别设置每个按钮的风格. Style是作为一种资源被保存下来的. 看下面的例子: <Window.Resources>        <Style TargetType="Button">       <Setter Property="Fore

【我的Android进阶之旅】 Android Studio插件之Jenkins插件介绍

一Jenkins插件功能介绍 1Jenkins任务列表 2切换Jenkins分组 3构建Jenkins任务 4进入构建Jenkins任务的页面 5进入最后一次构建Jenkins任务的页面 6增加Jenkins Favorite分组 7查看Jenkins Favorite分组 二Jenkins插件下载 1搜索Jenkins插件 2下载Jenkins插件 三安装Jenkins插件 四配置Jenkins插件 五启动Android Studio时候输入配置Jenkins的数据库密码 现在我就来介绍And