sketch如何做设计稿交互_sketch交互点击视觉标注方法|sketch如何实现交互点击的视觉标注 - PS下...

看到有个案例教程说用sketch实现视觉点击标注的，不知道是如何实现的，那么下面我们一起来看看用sketch如何实现交互点击的视觉标注，希望本教程能帮到大家。

sketch比较适合做mockup，也就是高保真的、不可操作的视觉稿。如果做交互点击&标注功能，需要借助于插件。

这里可以推荐一款同时满足这两个功能的插件——墨刀sketch插件，国产的，简单易用，基本不用学。

1，安装MockingBot Sketch Plugin，上传artboard到墨刀

2，点击创建项目，选择设备类型，设计稿就会自动上传到墨刀

3，交互点击：拖拽一个链接组件，添加页面链接，就可以实现点击交互效果了。不光是点击交互，还包括长按、左右滑等常用手势。

4，点击右上角运行，查看标注。点击元素，位置、间距、字体、颜色、不透明度、渐变色、样式代码等信息都能自动获取

5，支持(Hex,RGB,RGBA,ARGB)四种颜色，支持Android、ios、网页不同平台的单位(dp、pt、px等)换算，支持样式代码(Swift、Android、css、Less、Sass、Stylus)，还支持吸管吸取颜色。

6，可以下载项目全部切图的多倍率图片，也可以下载单个切图的多倍率图片。

下载的图片是打包好的。每个压缩包里都有@1x @2x @3x @1.5x 四种图片。

7，协作!协作!协作!即可以用链接分享，也可以添加团队协作成员。同样当设计师更改设计稿时，直接在上传到墨刀，开发刷新一下就可以了，不需要像之前那样发来发去了。

sketch配合合适的插件工具，效果还是非常强大的。好用的工具，泣血推荐给大家。