首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Sketch 插件开发指南

背景 先抛个问题,众所周知,Sketch 是 UED 设计工具,大多数 Sketch 插件都是用于提升设计人员工作效率。那么,作为前端研发的我们为什么要学习 Sketch 插件开发呢?...当然今天分享不是 D2C 相关,所以主要篇幅还是集中在 “如何帮助大家快速掌握 Sketch 插件开发”。...再通过上面提到的 Symbolic Link,将重新编译构建的插件同步到 Sketch 插件的安装目录下,即可实时查看到插件修改的效果。 5....开发的,但官方团队为 Sketch 插件提供了一套 JavaScript API,支持访问和修改 Sketch 文档、获取用户自定义设置、提供数据源等等。...插件开发的主要内容,它为我们提供了向前端上游探索的能力,大家可以结合自己公司的情况,研发一些 Sketch 插件帮助 UED 和前端提效。

1.7K10
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    Sketch常用插件及操作技巧

    SketchI18N 中文化插件 Runner中搜索SketchI18N安装即可 Kitchen(推荐) 阿里团队开发的一款为设计者提升工作效率的 Sketch 工具集。...官网地址:http://www.alipaydesign.com/tool Dapollo是一个基于Sketch平台的设计插件集,通过丰富的内置图标、组件、插图、页面模板等设计素材帮你更高效的完成设计工作...自动排版的插件 官网地址:https://github.com/DWilliames/paddy-sketch-plugin 相关文章:《三步让你的Sketch 学会自动排版插件:Paddy》 行高修复...官网地址:https://github.com/zz379/AutoFixAndroidTextLineHeight 相关文章:《sketch插件自动调整文字行高》 Auto Fix Android...这个插件的的目的是去除Sketch上IOS所有文字的多余行高,即 行高 = 平方字体的文字高度 Miaow 一个强大的 Sketch 插件合集,由微信设计团队量身打造,让设计师和开发者更佳高效的使用

    1.7K30

    积木Sketch插件进阶开发指南

    前段时间,美团外卖技术团队积木Sketch插件“意外走红”。为了帮助更多的设计师小哥哥、小姐姐落地设计规范,提升产研效率,积木Sketch团队开始着手打造一个平台化的产品。...积木插件平台化 伴随着“积木”品牌的确立,越来越多的团队希望可以接入积木Sketch插件,其中部分团队也在和我们探讨技术合作的可能性。...Sketch插件代码由于和业务强相关,且实现方式较为复杂,可能存在部分敏感信息,所以基本没有成熟的插件开源。...Library库文件自动化处理 这部分将介绍如何将Library库文件转化为插件可以识别的JSON格式,并在插件上展示。 如果要问Sketch插件最重要的功能是什么,组件库绝对是无可争议的C位。...但是随着积木Sketch插件接入的业务方越来越多,除了听到可以显著提升效率的褒奖外,对插件的吐槽声也常常传入我们的耳边。

    1.5K20

    深入浅出 Sketch 插件开发

    Sketch 插件开发的机制,自动打包更新工程化、Sketch 中 Objective-C 的运行机制等方面,分享开发一个生产级插件所需的技术储备。...一、开发环境配置 崩溃保护 在 Sketch 插件开发过程中,会经常遇到崩溃问题,需要设置下崩溃保护,提高插件开发效率。...二、Sketch 插件开发基本知识 目前 Sketch 插件开发大概有两种方式,原生和混合开发模式: 原生开发指直接采用 Objective - C 或 Swift,并搭配 macOS 的 UI 框架...项目结构 按照上面步骤生成官方的示例插件后,会在我们指定的目录生成项目文件,并且自动安装插件Sketch,在插件菜单就会看到刚刚安装好的插件。...在 Manifest 文件中,还指定了插件更新的地址文件即 appcast.xml,Sketch 在启动的时候,会读取这个文件,当 appcast.xml 文件中插件版本有更新的时候,Sketch 会提示用户插件有更新

    1.5K50

    携程机票Sketch插件开发实践

    Sketch 社区著名插件 Sketch Measure,它将设计稿和数据参数导出 HTML 网页,供技术人员查看,节省从设计到开发过程的沟通成本。...3.1 基础知识 Sketch 官方技术文档提供了简单介绍: 1)Sketch 插件是按照特定方式管理的一个文件夹,包含一个或多个 scripts,每个 script 含有若干扩展 Sketch 用途的命令...Sketch 插件系统开放了几乎所有权限,让许多天马行空的想法可以实现。但是插件开发者需要及时关注 Sketch 版本升级,其向下兼容性较差,或者说官方团队并不重视这部分。...4)使用 skpm 开发的插件,可以使用 console.log 语法,需安装 sketch-dev-tools。...Sketch 插件通过 Mohca / CocoaScript 连接到 Objective-C / Cocoa。

    1.4K10

    时下流行Sketch插件谁更“香”

    导读:随着Sketch这款设计神器的加速普及,相关插件的需求保持旺盛。本次笔者选出了几款曾经或者当下的热门插件,对它们的核心功能进行了介绍,并给出了实际的使用建议。...一、明日黄花 SketchI18N 作为一款汉化插件,2018年之前确实给大量国内刚接触Sketch的设计师们带来了方便,但插件易导致闪退的严重BUG是无法容忍的。...总之,不太建议继续采用这款插件Sketch Measure Sketch Measure是一款让国人自豪的优质设计交付插件,能够输出高交互性的html资源包,大大提高设计交付准确性和便捷程度。...四、小结 2018年Sketch大幅提升了对齐和整理功能,汲取了之前很多相关插件的优点,也因此大量主打相关功能的插件都没有在本文中予以介绍。...Sketch确实在不断听取用户的心声,将一些热门插件功能“官方化”,带给设计师们更多的便利。

    67810

    盘点那些2019好用的Sketch插件(附下载地址)

    静电说:Sketch插件总是层出不穷,在2019年年末,静电为大家总结了一大波好用的Sketch插件,可以让大家在作出炫酷设计稿的同时,更让大家的工作效率翻倍。喜欢的话,就赶紧下载+收藏转发吧!...Vectary for SketchSketch中直接将你的设计稿做成高保真的Mockup,是不是觉得很方便呢?Vectary就是这样一款插件。...Data from Clipboard 只需简单的拷贝一列文本,然后粘贴到Sketch的文本图层或者元件的Overrides中。插件就自动帮我们把文本排列好啦。就这么简单。 ?...Image2Palette 这是一款可以生成图片关键色的插件,只需简单选择一张图片,执行插件,就会为我们生成一个系列的图片关键色,这个插件尤其适合在提取情绪版关键色的时候使用,很方便。 ?...批量压缩PNG 鼎鼎大名的TinyPNG相信各位设计师一定用过,使用TinyPNG Compressor这款插件,可以在Sketch中直接帮你压缩PNG图片。

    2.5K10

    设计师编程指南之Sketch插件开发 1

    发现网上关于sketch插件开发的指南太少了,而且都不一定可以成功运行,于是我就写了这个系列的文章: 1 我们需要了解的语法特点 sketch 是基于 CocoaScript ,支持在 JS 中调用...2 sketch 的主要对象 所有的关于 sketch 对象的操作,都是通过 context 来的。context 的document 对象,oc 对应的是 MSDocument 对象 。...尤其是做 sketch插件开发,由于官方文档写得比较粗糙,必须要了解 sketch 代码中已经写好的一些方法才能更好地进行开发。...Github 上有已经 dump 出来的 sketch 头文件信息,地址: https://github.com/abynim/Sketch-Headers 当然,也可以自己用工具从本地 dump 一份出来...插件开发的开篇,暂时写到这里。

    1.9K91

    手把手教你写一个sketch插件

    本着能用工具解决就用工具解决的懒癌患者原则,我们这个课程就来学习如何开发sketch 插件。...sketch插件的本质就是一些脚本的集合,且官方提供的是JavaScript API,因此这个课程希望你有JavaScript的基础。...整个课程通过手把手教你开发一个sketch插件,来达到学习和熟悉开发流程、常用API的目的。 sketch插件结构 那么sketch插件究竟包含了什么东西呢,我们来看看。...定义了插件的命令名称、在sketch显示的菜单选项等。 identifier 指定插件的唯一标识符。Sketch在内部使用此字符串来跟踪插件,为其存储设置等。...这个是一个sketch插件,然而它会监听用户的所有操作,所以十分耗费性能。

    2.1K91

    扩展 Sketch

    如果您有兴趣扩展Sketch,那么您就位于正确的位置。在这里,我们展示Sketch可扩展性文档的概要以及如何快速构建您的第一个Sketch插件。 如果您只想使用现有的插件,请参阅插件目录。...你可以用插件做什么? Sketch中的插件可以做任何用户可以做的事情(甚至更多!)。...通过从插件调用菜单选项来自动化现有功能 设计规格 内容生成 透视转换 查看Sketch插件的最简单方法是通过插件目录。...扩展想法 Sketch功能的许多优秀社区创意可以更好地实现为插件而不是核心产品的一部分。这样用户就可以通过安装正确的插件来挑选他们想要的功能。...Sketch团队在插件请求库中跟踪可能的插件为GitHub问题。如果你正在寻找一个伟大的插件来构建,请看看这些问题。 下一步 您的第一个插件 - 尝试创建一个简单的Hello World插件

    1.4K60

    Sketch插件新利器——使用Mockplus DS制作设计规范

    Mockplus团队全新推出了一款能够轻松帮助设计师实现与Mockplus DS设计系统无缝对接的Sketch插件新利器。...它无疑是设计师们根据各自分工,实时通过Sketch工具制作,汇总,修改以及完善设计规范系统的最佳工具。 Sketch插件新利器——实现Sketch与Mockplus DS的无缝对接,同步自动更新 ?...而为方便设计师结合Sketch工具制作和优化MockplusDS设计规范系统,Mockplus团队也同样推出了极具特色的Sketch插件。...设计师免费下载安装,即可实现Sketch和Mockplus DS设计规范系统的同步自动更新。 而该Sketch插件,之所以称作“新利器”,主要因其拥有以下突出特点: 1. ...比如,该款Sketch插件支持资源搜索功能,用户简单输入相关关键词或标签,即可查找所需规范资源,即搜即用。

    71920

    有了这个Sketch插件,海量UIKit素材即点即来~

    今天给大家推荐两个可以一键导入和下载UIkit的Sketch插件,有了这两个插件,各位可以一键把网上的UIkit素材在Sketch中打开,无需打开网站下载,解压缩等等繁琐的操作。...而且推出了Envato Elements插件,虽然现在只是Beta版本,但是好用程度还是相当高的。来,一起看看! 下载插件后打开就可以看到如图的窗口,如果你没有注册,会先提示你输入邮箱进行注册。...点击某个界面后,就可以一键把它导入到Sketch的当前画板里边,简单粗暴! ?...Material Theme Editor 这个插件是Google官方提供的MD主题插件,目前google提供Baseline,Crane,Fortnightly,Shrine 一共四种主题供我们选择。...如何下载插件 小伙伴如果想下载这两个工具 可以在公众号聊天窗口中直接回复 “插件” 即可得到插件的下载地址 还不赶紧来试试看? ?

    2.1K20

    Sketch插件新利器——使用摹客设计规范制作设计

    Sketch插件新利器-使用Mockplus DS制作设计规范.png 然而,逐个导出和上传Sketch编辑优化的设计系统资源费时而费力。...Mockplus团队全新推出了一款能够轻松帮助设计师实现与摹客设计系统无缝对接的Sketch插件新利器。...Sketch插件新利器——实现Sketch与摹客设计系统的无缝对接,同步自动更新 1.Mockplus ds设计系统Sketch插件.png Mockplus DS(Design System)设计系统...而为方便设计师结合Sketch工具制作和优化Mockplus DS设计规范系统,Mockplus团队也同样推出了极具特色的Sketch插件。...所以,如若作为设计师的你,也在苦恼如何实现Sketch与设计规范系统资源的同步更新和实时应用,摹客设计系统Sketch插件无疑是你最佳的选择。

    70440
    领券