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

现在大多数的设计工具,都支持导出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项目地址

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,385评论 19 139
  • 写在开头 先说说为什么要写这篇文章, 最初的原因是组里的小朋友们看了webpack文档后, 表情都是这样的: (摘...
    Lefter阅读 10,680评论 4 31
  • Node.js是目前非常火热的技术,但是它的诞生经历却很奇特。 众所周知,在Netscape设计出JavaScri...
    w_zhuan阅读 8,974评论 2 41
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 175,327评论 25 709
  • 无意中看到zhangwnag大佬分享的webpack教程感觉受益匪浅,特此分享以备自己日后查看,也希望更多的人看到...
    小小字符阅读 12,543评论 7 35