上传设计稿

将原型导入协作工具

墨刀支持将账号的当前所在空间内原型项目页面导入协作工具中,能够轻松表达流程与逻辑,演示评审更省心省力。
选择【导入原型页面】后,在弹出的窗口中可以选择要导入的项目,并勾选需要导入的页面,点击确定后即可开始导入。


您所选中的原型页面会以图片形式呈现在画布中,不支持进行标注。

如何上传图片至协作工具

墨刀支持上传JPG、PNG、GIF格式的图片,上传后不支持标注。
本地图片上传到墨刀设计协作工具有两种方法:
1.点击编辑区顶部的小加号,选择由本地上传。


2.将本地图片直接拖拽至画布内即可。

sketch设计稿上传步骤

在上传sketch设计资源前,你需要先安装并完成登录sketch插件
「Sketch 插件」暂时仅支持 macOS 系统
安装并登录sketch插件后,通过以下步骤即可完成上传。
1.在sketch界面,点击顶部工具栏中的【插件】选项,选择墨刀插件后,点击【上传画板】。


2.在插件面板中,选择设计图的相关信息,如设计图的画板(选中的画板or当前页面的全部画板or当前文件的全部页面)、设计稿尺寸、上传至哪个项目、上传至个人/企业空间(团队)。
其中智能上传可以同步画板所在的sketch页面与分组,普通上传则可以手动选择分组。




3.当出现下图提示时,则说明已经上传完成。此时可以选择快速分享或者前往查看设计稿。


Sketch上传常见问题
Sketch插件点击 “上传画板” 插件面板不弹出
如果MacOS是13及以上版本,请升级Sketch版本到93及以上

由XD插件上传

墨刀XD插件现支持XDv37及以上版本。


一、下载XD插件
在上传XD设计资源前,你需要先下载墨刀XD插件。共有两处下载入口。
1.下拉弹窗下载
单击顶部工具栏的【加号】按钮,在弹窗中点击XD插件【下载】;
2.画布中下载
在当前页面为空时,画布视图中会显示上传设计稿方式,单击【获取插件】即可下载插件。


二、上传XD文件
1.在Adobe XD界面,点击顶部工具栏中的【插件】选项,选择【墨刀】,并登录墨刀账号。


2.在插件的上传页面,可以进行具体上传设置。
如所处个人/企业空间(团队)、设计稿的画板(选中的画板or全部画板)、设计尺寸、上传至具体的项目、页面、分组、等,也可以点击右上角【加号】创建新的项目或页面。
设置完成后,点击【上传】即可。




3.当出现下图提示时,则说明已经上传完成。此时可以选择快速分享或者前往查看设计稿,也可以直接通知项目成员。


三、xd 插件使用帮助
如您在使用Adobe XD 插件时遇到上传问题,请参考以下步骤进行操作。
1、xd插件无法安装
如果您的xd插件无法正常安装,可参考视频中的步骤进行操作解决。


2、xd插件显示网络异常
当您在登录 XD 插件提示【网络异常】,请您关闭网络代理或者 VPN,之后可以正常使用。

  • Mac:【系统偏好设置】-【网络】-【高级】-【代理】,关闭代理。

  • Win10:【网络和Internet设置】-【代理】,关闭代理。

3、xd切图相关问题
1.上传文件图标尺寸与设计稿不一致
在 XD 中,图标的下方加上透明底图,使用剪切蒙版的方式确保图标大小与墨刀网页端导出的大小一致。


2.无法导出切图以及画板缩略图
如果你是macOS 系统,可以点击【系统偏好设置】-【安全性与隐私】-【隐私】-【完全磁盘访问权限】。
点击【加号】,手动把 Adobe XD 添加进去,重启 XD 即可导出切图和画板。

由PS插件上传

墨刀PS插件现支持Photoshop CC 2021 及以上版本。

Mac(适配 M1 芯片)、Windows 均可下载。

在使用墨刀PS插件前,请先确认已经安装了 Creative Cloud(点击这里下载) ,并且登录 Adobe 账号。


1、下载PS插件
在上传PS设计资源前,你需要先下载墨刀PS插件。共有两处下载入口。
1.下拉弹窗下载
单击顶部工具栏的【加号】按钮,在弹窗中点击PS插件【下载】;
2.画布中下载
在当前页面为空时,画布视图中会显示上传设计稿方式,单击【获取插件】即可下载插件。


2、安装PS插件
你需要安装并登录了 Creative Cloud,并且 PS 版本是2021及其以上
如果 PS 版本低于 2021,将会出现下图:


下载好墨刀PS插件后,双击文件打开:


双击后会自动打开 Creative Cloud,点击【本地安装】:


出现下图状态,代表安装成功:


PS插件无法安装

如果您的PS插件无法正常安装,可参考视频中的步骤进行操作解决。

MAC安装视频如下,

Windows安装视频如下,



如您在使用墨刀PS插件时遇到上传问题,请参考以下步骤进行操作。

打开2021 或以上版本的 PS ,即显示墨刀PS插件登陆页面。

输入万兴/墨刀账号及密码即可登录。


3、智能标记切图

选中】需要切图的图层或编组,点击【智能标记切图】。


当图层或编组名称前增加【**-s-】,【智能标记切图】变为【取消切图标记**】,此时切图操作便完成了。


4、上传PS文件
1.在Adobe PS界面,是否已经出现墨刀PS插件,若未出现,点击顶部工具栏中的【增效工具】选项,选择【墨刀】,并登录墨刀账号。


2.在插件的上传页面,可以进行具体上传设置。
如所处个人/企业空间(团队)、设计稿的画板(选中的画板or全部画板)、设计尺寸、上传至具体的项目、页面、分组等,也可以点击右上角【加号】创建新的项目或页面。
设置完成后,点击【上传】即可。




3.当出现下图提示时,则说明已经上传完成。此时可以选择快速分享或者前往查看设计稿,也可以直接通知项目成员。


插件上传小贴士

1、设备说明:
iPhone、iPad、Apple Watch这三种设备界面设计属于ios;
安卓系统界面设计属于Android;
网页类型的界面设计属于web。


2、 尺寸与倍数关系的说明:
iOS 类型的倍数:375 x 667 属于 iOS 1x;750 x 1334 属于 iOS 2x;1242 x 2208 属于 iOS 3x。
1920 x 1080 尺寸的手机界面建议选 Android-xxhdpi;网页选 Web-1x。
Web 类型的倍数:1x 为网页常用尺寸;2x 为特定屏幕尺寸,如 4k 屏,通常该尺寸会是正常网页的 2 倍。

这篇文章帮助到你了吗?