【UXP教程-1】UXP简介

【UXP教程-1】UXP简介

各位小伙伴大家好,CEP的教程内容已经基本结束,接下来我会在把自己插件迁移到UXP的同时,开始写UXP的开发教程,教程依旧秉着高质量输出的基本原则,力求系统且内容详实,希望能够帮助到大家。

这篇教程的视频地址在这里:Adobe UXP插件开发中文教程 - 1. 简介,欢迎大家点赞、关注、转发。

1. Adobe插件开发的演进

在回答UXP是什么之前,我们先来看看Adobe插件开发的演进过程。在很久很久以前,基于Adobe的扩展,只提供了原生C++的方式,后来在此基础上提供了基于Javascript引擎的脚本扩展,你可以通过写一些js代码来调用宿主API来操作Ps,有过相关经验的小伙伴应该都用过它对应的古老编辑器Adobe ExtendScript Toolkit

阅读更多
【CEP专题】 隐藏面板的妙用

【CEP专题】 隐藏面板的妙用

大家好,我又回来了。我已经考完试了,下一步就是等出成绩,等录取通知书啦。

接下来我会继续回归系列教程的更新,以专题的形式补充一些我之前没有讲到的内容。同时预计春节后,会开始写UXP部分的教程,敬请期待。

之前有小伙伴反馈文章的形式对一些操作性的内容不太友好,我接下来会试着同时发布文章和视频的方式,视频会发布到B站和知乎,欢迎大家点赞关注转发。这篇文章的视频链接在这里【CEP教程】隐藏面板的妙用】,视频和文章的侧重点不一样,建议结合来观看。

这篇专题文章给大家介绍CEP插件中一种独特的面板形态 - 隐藏面板,以及它可以用来完成的一些有趣的功能。在某些情况下对我们非常有帮助。

阅读更多
【分享】 一种新的插件调试方法

【分享】 一种新的插件调试方法

这篇文章来自一个小伙伴的投稿。他一直想实现一种机制,可以在插件面板打开的时候,就能自动打开devTool进行调试,提升插件开发效率。我们针对这个话题在微信里头交流多回

关于如何调试CEP面板,我之前在【CEP教程-4】开发工具选择和调试 推荐使用旧版本的chromium来进行debug,但显然无法满足他的诉求,于是他经过各种苦思冥想、学习专研最终摸索出了更智能的调试方法,我钦佩他这种执着的问题解决精神,于是和他交流将这个过程记录下来,分享给大家。

阅读更多
【CEP教程-17】插件的打包和发布

【CEP教程-17】插件的打包和发布

这篇文章介绍当插件完成开发和测试之后,如何进行打包、生成可安装程序交付到用户的手中。

整个插件发布的过程,我大体分了如下几个环节,这篇文章我们会按照这几个环节逐个展开。

  1. 目录结构整理
  2. 版本号和更新机制
  3. 代码混淆和加密
  4. 签名
  5. 构建安装程序
  6. 发布到平台

为了能够有优雅的开发体验,发布的这个过程,我们也希望能够容纳到上文提到的工程化当中,只需要一个发布的命令,就能够完成这些操作,大幅提升我们的开发和发布效率。

阅读更多

【CEP教程-16】JSX的工程化

拖更许久的下篇终于来啦~~

这篇教程主要介绍JSX的工程化,和上篇结合起来,整个插件的开发工程化就全部完整了。

上次视频,大家有反馈字太小了,我本次特意调大了编辑器的字体,应该能够比较清晰看见了,视频时长一小时多点,内容很多,干货满满,大家需要有耐心~~

阅读更多

【CEP教程-15】前端框架在插件面板中的应用

这篇教程给大家介绍前端的流行框架,如何应用到Photoshop插件面板中,提升我们面板界面开发效率。这篇教程会采用视频的方式来给大家讲解,考虑到时长的关系,视频分上下两篇,上篇介绍使用前端框架开发插件面板,下篇介绍JSX脚本的工程化,共两个视频。

这是我第一次录制视频教程,还没有什么经验,也没有太多精力和时间做剪辑,和各种社区站点的UP主完全不能比,大家将就着看哈,有建议可以在评论区提~~

阅读更多
【CEP教程-14】数据存储相关

【CEP教程-14】数据存储相关

在我们日常插件开发过程中,经常会需要存储一些数据,比如用户当前操作的状态、用户登录的账号信息,或者我们对PSD文档做的一些修改等等,这些都需要我们将一些动态数据,写入到当前用户设备上,这篇文章就来介绍一下CEP插件体系给我们提供了哪些可以进行数据存储的类型和使用方式。

阅读更多
【CEP教程-13】nodejs在插件开发中的应用

【CEP教程-13】nodejs在插件开发中的应用

前面的文章我们学习到,CEP的插件面板,是基于浏览器的web开发生态,我们通过Html/css/js来编写面板的结构、样式和交互,通过调用ExtendScript来操控宿主Ps。

除此之外,Adobe还在这个浏览器里头嵌入了nodejs的运行时,可以让我们在面板开发的时候使用nodejs的各种特性,这无疑大大的扩展了插件面板的能力,这篇文章我们就来介绍一下如何在CEP插件面板中使用nodejs,以及一些特性的应用吧

阅读更多
【CEP教程-12】如何从Ps中导出图片

【CEP教程-12】如何从Ps中导出图片

在做Ps插件开发的时候,一个非常常见的功能就是导出图片,有时候我们需要导出整个PSD文档,有时候我们需要导出某个图层或某个几个图层,市面上所有的和UI切图有关的产品和插件,都是运用了插件的图像导出能力来完成这个诉求。本篇文章我们就主要来介绍如何从Ps中获取图像,或许各种格式的图像。

阅读更多
【CEP教程-11】生成器

【CEP教程-11】生成器

这篇文章,我给大家介绍一下Photoshop一个比较冷门的扩展部分,叫生成器(英文generator),这个东西不在CEP插件面板这个体系内,了解和用的人也比较少。但是呢它确实也是Ps提供给开发者进行扩展定制的一个模块,并且它提供了一些非常独有的特性,对我们插件开发也有较大的助益,所以我单独开一个章节来进行介绍。

背景介绍

生成器,是Photoshop在2015年随着CC2015这个版本一起发布的。当时,由于移动端开始兴起,移动UI设计开始成为主流,随之诞生了一个叫Sketch的设计工具,主打UI设计,相比Ps它更轻巧在UI设计领域效率更高。Adobe也感觉到了压力,于是开始尝试在Ps上融入一些新的元素来提升UI设计能力,所以在CC2015中集成了两个东西:

阅读更多