sketch如何做设计稿交互_如何优雅地自夸——为Sketch做一个私人语音夸夸群

前言

最近情绪不好，感觉自己需要一些鼓励，我就想起了前一阵 的夸夸群。但是我是设计师，日常需要做设计，没法天天看夸夸群。于是我就想到在Sketch里做一个语音插件来夸我，一劳永逸。

先看效果

https://www.zhihu.com/video/1102944496949526528

点击 parise 打开窗口，输入好自己喜欢的夸人语句，不关闭窗口即可。插件会在你进行移动图层、编辑文字等操作时自动夸你。

下载链接​github.com

GitHub：youya-fy/praise​github.com

整体结构

具体过程

1. 做个界面

先随便写一个界面，用于用户输入语句和播放声音

2. 获取语音和播放

使用百度免费的语音合成API，我们可以很方便地做到将自定义的文字转为语音。

这里有个坑。如果你要用POST方式获取音频(Blob)，在一般浏览器中可以直接用audio.src = URL.createObjectURL(blob)的方式播放语音文件。但是在Sketch的webview里这么做就会报错，所以我猜可以用arraybuffer获取音频然后解码再播放（不过我没试过）。

3. 语句的存储

常理来说，应该要保存好用户已输入的语句，无论什么时候再次打开都不需要重新输入。但插件的webview窗口是个网页，关掉后数据无法保存数据(Sketch webview里localStorage无效)。目前唯一的方法就是从webview把数据传入插件的"后端"，然后用Setting API保存。读取则反之。

4. 监听用户操作

最后就是利用Sketch官方的Action API来监听用户的某些操作。当用户执行了这些操作，插件就会在已输入的语句中随机播放一句。

总结

到此，一个私人语音夸夸群就做好了。以后做设计就随时有无数夸赞的话语萦绕在耳边，稳得一批

---