请叫我交互设计师值得一读

还在打包发邮件?这里有更好的分享Axure/Sketch设计文档

2017-09-17  本文已影响14人  GeniusBin

现在大多数的设计工具,都支持导出HTML文件了。比如Axure一直是可以导出HTML文件的,Sketch有插件如Sketch Measure可以导出HTML文件,连标注都可以省掉了。

然而,生成之后的HTML文件,你还在用“打包成zip发给程序员小伙伴”这种原始的方法吗?

推荐一个基于node的开源小工具fixd-server,专门为分享设计文件定制的。

第1步:安装node和npm

跨平台,无论是windows还是macOS还是linux,都可以飞快的安装好node和npm。
要做的就是打开node.js官网,然后下载安装就行了。安装过程中会一并安装上npm。

image.png

第2步:安装fixd-server

打开命令行,windows上用cmd,macOS用terminal,执行安装命令:

npm i -g fixd-server 

代码一通乱转之后就安装好了。

第3步:使用fixd-server构建HTML服务器

还是在命令行中,一句话构建服务器:

fixd-server <设计文档所在目录>

比如在widnows上,所有HTML设计文档都放在了C:\Users\Public\Documents\Axure\HTML,那么就执行:

fixd-server "C:\Users\Public\Documents\Axure\HTML"

一切顺利的话,屏幕上就会显示类似:

Running server at:
======
http://127.0.0.1:3456
http://192.168.1.156:3456

OK,最小化命令行,保持这个程序运行,然后把http://192.168.1.156:3456这行地址发给程序员同学就好了!他们一定知道要在浏览器打开这行地址的!

最终效果

如果你有一个这样的目录:

在浏览器打开之后的效果就是:

点击其中带html标签的就可以直接查看设计文档了!当然,这个工具除了可以在浏览中查看设计文档,还可以用来传文件……

如果是前端小伙伴看见了这篇文章,而且不想再忍受FTP同步、坚果云同步或者打包解包zip等等原始的方法了,那就赶紧帮你们的设计师小伙伴搭建好这个小服务器吧。


点击查看fixd-server的GitHub项目地址

上一篇下一篇

猜你喜欢

热点阅读