图形软件 | 68.7M
语言:英文
4 .0
应用简介
Zeplin是一款高效的绘图软件,可以帮助用户更好地设计和制作图片。它为用户提供注释、StyleGuide、笔记文档和简单的团队协作功能。还可以自动生成尺寸标注、CSS样式代码、导出图片等。
Zeplin是一款高效的绘图软件,可以帮助用户更好地设计和制作图片。它为用户提供注释、风格指南、笔记文档和简单的团队协作功能。它还可以自动生成尺寸注释、CSS样式代码、导出图片。等待。
软件特点
这次,完成从你需要使用的Sketch中文件的导出。
而且,Zeplin的分组和设置功能可以让您快速完成相关操作。
支持快速查看CSS样式并导出已完成的设计稿
支持使用您需要使用的更改来标记文件
快速对文件进行笔记并支持评论功能
还可以显示相关数值,快速完成查看。
特征
一站式定制资源
Zeplin 根据为您开发的平台定制的设计自动生成准确的规范、资产和代码片段。不再迷失在设计文件中。
一键导出设计
无需改变您的设计方式,只需使用我们的Sketch、Adobe XD CC、Figma、Adobe Photoshop CC 插件一键导出您的文件。
让每个人都在同一页面上
在Zeplin 的云端退出和存储设计项目,在同一屋檐下。快速邀请队友、共享链接并进行构建。
沟通设计
直接在设计上添加评论以传达想法、反馈或请求技术细节。为了让事情井井有条,请对笔记进行颜色编码,并在完成后处理它们。
通过集成加快您的工作流程
将ZePin 添加到Slack 频道或TelLo 看板可加快您的工作流程并始终让您的团队了解最新情况。
建立团队的设计知识库
收集和组织团队的项目和资源,例如组件、颜色、文本样式。存储旧版本和项目并在需要时快速引用它们。
指示
下载完成后,我们打开本地App,点击右上角的创建,创建一个新项目。它有多种模式,Android、iOS 和Web,每种模式下面都有相应的说明。
这里我们选择Web,可以看到CSS和HTML。
从Sketch 导出文件
接下来我们打开Sketch 并选择菜单- 插件- Zeplin - 导出选定的画板.
这时会弹出Zeplin的导入窗口,选择需要导入的项目。
你可以注意到左下角有一个“替换同名的屏幕”。这意味着,如果项目已经导入,但是我们Sketch中的设计稿被修改了,我们需要在Zeplin上更新设计稿,检查它是否替换原来的。文件。
Zeplin 分组和设置
导入完成后,会自动弹出Zeplin App,我们可以看到文件都在Zeplin中了。将鼠标悬停在第一个文件的最左侧,会出现一个类似除号的符号。只需单击一下,我们就可以为这些文件创建一个组。
这里我们将其命名为“产品相关”。看文件名右侧,有一个小三角标记,点击它可以轻松折叠或展开文件分组。
然后旁边有一个更多操作的按钮。如果我们点击它,我们还可以为组添加描述、重命名组、移动组或删除组。
查看CSS 样式
我们输入Zeplin的设计稿,点击某个区域,如下图。我们可以看到该区域的px 尺寸,以及它与其他元素的距离。
查看面板的右侧,我们还会看到与CSS 相关的值,例如box-shadow。
导出设计稿图片
Zeplin还有一个非常好的功能,就是导出图片。矢量图像可以包含在PNG 和SVG 格式中。
但不要忘记,您需要先在Sketch 中为此图像设置导出。
标签文件
接下来我们看一下Zeplin的标签功能。你可以看到这个文件已经有一个“topic”标签。我们还可以为其选择其他标签,或者输入新标签。这些标签也可以删除。
然后返回主面板。我们可以注意到顶部有两行标签。例如,如果我们选择“主题”,我们将看到所有标记为“主题”的文件。
由于最初Zeplin 不具备创建组的能力,因此我们使用标签对文件进行分类。现在我们可以使用标签来做更详细的过滤条件。
注释或评论
接下来我们看看评论功能。我们可以回复评论、更改评论的颜色或删除评论。
您还可以添加新评论。 CMD + 鼠标单击空白区域并输入您的评论。
注意。文件右下角有一个睁着眼睛的Notes小猴子标志。如果您点击它,您可以隐藏页面上的所有评论。
热门攻略