在此之前,我们需要了解Sketch文件的目录结构,它本身其实是一个压缩包文件,解压缩的.sketch文件包含一个小的预览图像和所有布局的JSON数据(以及一些用户和文档相关的数据)。pages文件夹包含每个页面的一个JSON文件。这些JSON文件包含Sketch中设计的每个元素的数据。此外,.sketch文件包含所有图像资源的原始大小的图像。

这是两个版本的Sketch文件,现在我们要使用GitHub来管理这个两个版本。

首先我们要把文件上传到远程仓库:

  • 登录GitHub创建一个账号,然后Create a new repository,填写必要的信息后,点击在页面下方的创建按钮完成创建。
  • 打开 Finder,进入Sketch文件的文件夹,修改它的文件名后缀为.zip结尾,使它成为一个压缩包。
  • 双击这个压缩包,你将解压得到一个文件夹。
  • 接下来打开名为终端的应用程序,然后输入以下命令:
cd [Sketch文件所在目录(可直接拖拽文件夹到终端窗口)] 
git init
git add .
git commit -m "V1-Blue"
git remote add origin [你新建的GitHub仓库地址]
git push -u origin master

这个过程将本地文件夹与GitHub远程仓库链接了起来,并将本地仓库里的Sketch文件版本(V1-Blue)上传到了GitHub仓库。

如果你遇到了问题,我录制了一个视频教程,希望可以帮到你。

现在我们要对我们的设计进行迭代更新

  • 找到刚刚修改过的压缩包,将后缀名改回.sketch,然后在sketch应用程序中打开,进行修改。
  • 再次修改文件后缀名为.zip,使它成为一个压缩包文件。
  • 进入终端程序,输入下面命令
cd [Sketch文件所在目录(可直接拖拽文件夹到终端窗口)] 
unzip [压缩包文件名].zip

将文件夹中所有的文件替换为最新版本文件,解压时系统会有文件替换提示,输入A(全部),按下回车,完成全部替换。

更新到GitHub远程仓库

  • 进入终端程序,输入下面命令
git add .
git commit -m "V1-Red"
git push -u origin master

做完这一切,我们已经完成了sketch不同版本的管理,但这缺点也很明显,它仍然不够简单,特别是对于设计师来说。

你也可以使用一些脚本,帮你完成这些繁琐的工作。

Next
Design like a Developer

David at 1:18 pm, 2019-08-30 - Reply

大佬威武,6666