Sketch-UICode
Sketch-UICode是一个design-to-code工具，可以从UI设计工具Sketch格式的设计稿所见即所得地生成移动App UI代码(静态部分)。
Sketch-UICode试图解决的问题
在移动App的开发过程中，App UI(静态部分)是由UI设计师出设计稿，然后开发工程师照着设计稿来还原设计。这个过程相当于设计师使用UI设计工具把设计稿画了一遍，然后工程师再使用开发工具（比如Xcode或Android Studio)把设计稿又画一遍（很大一部分工作就是把设计稿中的各种数值搬过来）。
由于UI设计包含很多细节，要想做到精准还原设计，工程师需要做很多细致的工作。UI设计师为了保证UI的实现效果，往往需要花不少精力与工程师沟通，要求工程师调界面，一直到满意或达成某种妥协为止。
Sketch-UICode的工作方式是充分利用UI设计稿中已有的信息（比如UI元素的位置、颜色、字体、字号、透明度、圆角等信息），同时用户通过操作Sketch插件补充一些对开发UI来说必须要有的信息（比如组件的类型、组件的层级关系、组件的相对布局信息等），然后由Sketch插件生成UI代码（包括了各种资源文件，比如不同倍数的图片)。
它还包含了一个可以在iOS模拟器和真机上运行的预览App。通过预览端App，用户可以快速预览插件端所要生成的代码的真实运行效果（通过实时生成并运行与所要生成的代码逻辑完全相同的Javascript代码来实现的）。这样用户可以在生成代码之前验证自己在插件端所做的操作是否正确，然后等到对预览效果满意之后再生成代码。
所以通过这样的方式，可以达到以下效果：
- 工程师不需要再做那些搬运数值的工作
- UI设计师不再需要提供标注图和各种倍数的图片
- 由于生成的代码是所见即所得的，工程师在还原设计的过程中可以更容易地保证还原的质量。这样也就有助于减少UI设计师与工程师之间不必要的沟通。
对所生成代码的说明
Sketch-UICode所生成的代码是所见即所得的，这里的“所见即所得”是指与预览端的预览效果一致：即所生成的代码不需要做修改直接运行，就是预览端看到的效果（iOS完全一致，Android近似于一致）。
以往有一些可以生成UI代码的工具。程序员对这些工具的印象往往是：它们所生成的代码与程序员期望得到的代码有差距，以至于没法直接用。Sketch-UICode所生成的代码就是按着平时程序员写代码的方式来生成，生成代码后根据需求把动态逻辑（比如获取与展示数据的逻辑）加入即可。 虽然所生成的代码风格不一定满足所有程序员的偏好，但绝对是可以直接用的。
代码生成目标目前包括iOS-Objc-MVVM(UIKit)，iOS-Objc-MVC(UIKit)和Android-Java-MVC。以后会加入对iOS下Swift(UIKit)的支持。
效果演示
您可以通过以下几个演示视频来对Sketch-UICode的效果有一个直观的了解。
演示所用的Sketch设计稿是一个开源的比特币钱包BasicBitcoinWallet的UI设计稿（BasicBitcoinWallet的静态UI代码就是完全用Sketch-UICode生成的)
这些视频主要是演示所生成代码的效果，没有包括制作设计稿的过程。此视频只包含操作，没有声音。
视频分3个部分：
您可以通过以下链接查看所生成的代码: https://github.com/lianxianghui/S2C-BasicBitcoinWalletDemo
Sketch-UICode 目前的开发状态
目前Sketch-UICode还有一些功能需要完善，还在开发中。预计会在今年(2022年)12月1日之前发布（前一段时间的工作被一些事情耽延了，导致未能按预想的时间发布，其预计发布时间需要重新评估）。
发布时它的生成iOS代码的功能会是免费的。生成Android代码的功能是否免费目前还未确定。
如果您对Sketch-UICode感兴趣，可以以 【对Sketch-UICode感兴趣】 为主题发送邮件到hello@design-code.app，等到发布Sketch-UICode时会发一封邮件通知您。