sketch导出html布局

sketch导出html,还要切图给程序猿吗

我用的摹客iDoc的插件来做标注，不用导出，分享链接给别人就行了，可以自动生成标注，也可以单独对坐标、颜色、文字、距离、范围等进行标注说明，如果你是设计师，交付很方便，如果你是开发，标注信息可以自动生成代码，直接复制使用，很方便。

如何用Sketch进行网页设计

sketch到出的页面只是原型，用于演示比较适合，不能直接给程序员使用，原型适用于和客户沟通演示，待客户确认后，还需要ui设计，前端切图，然后才能给程序员。

/sketch到出的页面只是原型，用于演示比较适合，不能直接给程序员使用，原型适用于和客户沟通演示，待客户确认后，还需要ui设计，前端切图，然后才能给程序员。sketch到出的页面只是原型，用于演示比较适合，不能直接给程序员使用，原型适用于和客户沟通演示，待客户确认后，还需要ui设计，前端切图，然后才能给程序员。

sketch怎样讲将多个画板导出到一张图中

基本设置

画布

按住键盘 A 快捷键，可以创建画布。 Sketch 已经良心的为你默认设置了各种设备尺寸，你想要的全都有，如下图。

Artboard

栅栏

通过 Layout settings 设置栅栏[布局参考线]，这个功能好的真是不要不要的[下文回介绍其实际用处]，可以根据需要自主选择每列宽度，间隔宽度以及最外侧 margin 宽度，

Layout settings。

Settings details。

这时画布上就出现了栅栏参考线，文字段落的宽度，按钮的宽度，图片的宽度都可以根据栅栏进行合理设置。通过栅栏布局可以极大的统一页面的布局设置，给人一种和谐美[Ctrl + L 可以快捷键显示/隐藏栅栏]，效果如下。

Layout effect

字体

注重对比和统一。对比是指在需要突出区别的地方用不同字号，粗细和字体突出不同。统一是指对于网站同一元素，使用相同的字体设置，比如 H1, Body Text. 英文字体建议两种即可, 一个 sans-serif 字体作为标题，显眼；一个 serif 字体作为正文，易读。可以提前设计好各个字体的数值，利用 Sketch 的 Style Text 功能进行保存，方便以后频繁使用。也可以再设计的时候，边做边保存[前者适合在经验用户，后者更适合初学者]，如下图。

Font categories。

对字体另外一个重点是确定 line height [行高]，确定行高的作用是方便确定控件上下 margin, 左右 margin 可以通过栅栏进行确定。比如你确定默认字体大小为 20px, 行距为 1.5，则行高 = 20px * 1.5 = 30. 那么控件之间的上下间距则可以设为 30px 的倍数，比如 30px, 60px, 90px, 以此类推。间距和行高相同可以使页面看起来更加和谐美观。

通过axure做原型设计生成的html代码可以让开发直接用吗

2019-02-14

百度了好多次都没找到这个问题的答案，下面那个回答也不适用于现在的版本了，今天自己摸索了一下意外解决这个问题。很简单的方式哦。

1、选中一个画板，不管哪一个，但要是在东南西北的几个角哦，方便你框选所有的。然后点击切片。

2、然后会出来切片的这个选框，虚线这个，这个框大家应该知道是可以自由缩放的，然后就你懂的。

3、奇迹就出现了，你会看见右边预览图包含了所有的画板啦～导出就是了。

不可以，Axure 生成的只是原型，是在产品制定时供大家参考了解项目用的。

Axure输出的HTML文件不能直接用于前端代码开发，Axure为了模拟交互效果，使用了大量的JS，其中有很多是用不着的内容，前端代码需要完全重写。

Axure输出内容不能取代实际开发中的任何部分，只是为了提高沟通效率。

扩展资料：

Axure的特性

1.鼠标及键盘交互功能:

支持更多的新特性包括 OnDoubleClick（双击）, OnContextMenu (右击),OnMouseDown（鼠标按键按下）, OnMouseUp（鼠标按键松开）, OnMouseMove（鼠标指针移动）, OnMouseHover（鼠标指针经过）, OnLongClick (鼠标长按), OnKeyDown（键盘按键按下）, OnKeyUp（键盘按键松开）。

2.演示文档：

支持HTML5新特性，以及更好的支持手机演示特性。

3.新增部件样式控制：

Axure7对于部件修饰功能有较大的改善，包括支持圆角、阴影、描边等设置。

4.更细化的部件属性：

更为丰富的部件属性，可以设置各种形状、样式，较Axure RP 6.5单调的形状而言，也是一种惊喜。

5.更多交互条件：

包括关闭指定窗口、设置锚点以及更为灵活的事件触发条件，对于移动互联网产品原型设计有很大帮助。

参考资料来源：百度百科-Axure。

原文地址：http://www.qianchusai.com/sketch%E5%AF%BC%E5%87%BAhtml%E5%B8%83%E5%B1%80.html