• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >心得技巧 > 10分钟了解兵器榜排行第一的Sketch插件:CRAFT

10分钟了解兵器榜排行第一的Sketch插件:CRAFT

作者: 字体:[增加 减小] 来源:互联网 时间:2018-08-23

本文主要包含sketch,sketch插件,神器下载等相关知识,希望在学习及工作中可以帮助到您

CRAFT 是 Sketch 上最实用的插件,没有之一,常年被 Sketch 开发团队挂在官方插件推荐榜上。同时,CRAFT 也是很多知名设计师使用 Sketch 进行设计工作时的得力助手。

官方介绍:

Screen Design. Supercharged.大幅提速界面设计。

开发团队:Invision

The world’s leading prototyping, collaboration & workflow platform.
世界一流的原型演示,设计协作和工作平台。

插件下载:Craft by InVision

插件功能:

CRAFT 一共包含七个功能,有用于协作的「协作白板」、「原型」、「同步」和「样式库」,也有实用的本地功能「图库」、「内容填充」和「复制」。

在启动 Sketch 使用 CRAFT 前,需要先安装并打开 Craft Manager。在这里,你可以管理插件中各个功能的开关,以及检测插件更新。

用来自 Getty 和 iStock 的高清图像给你的设计画龙点睛。

  • 图海:数百万世上最美的图片,就在指间。
  • 动态:强有力的搜索使找到合适的图片变得简单。
  • 流畅:选取一个图形图层,再点击一个图片就完成了,so easy。
  • 便捷:搜索、登录和下载历史,这些功能都集成在你的设计环境中。

「图库」和「内容填充」中的「图像填充」有所重复,但是里面的图像更为高清,需付费使用,是 Invision 对 CRAFT 商业化的一种尝试。

一个快捷、灵活的实时设计协作新方式。

  • 无边界:白板有无限大的空间,你的想法和创意不会受到约束。
  • 灵活:Sketch 或 PS;手机、平板或笔记本;无论你在哪,实时获取白板上的输入。
  • 包容:协作白板适用于任何人和任何项目。分享你的设计,然后在线协作。

首先,创建一个协作白板,既可以导入所有画板,也可以选择需要评审的画板后导入。创建完成后,会自动跳转 Invision。因为是在线协作功能,这里会需要你拥有一个 Invision 的账号以继续使用。

可以通过手写、打字、插入图片等功能来对界面进行讨论、评审,很遗憾的是打字功能暂时不支持中文,只能用手写功能进行中文注释。作为协作功能,可以用右上角的 Share 功能把链接分享给别的同事,让他们参与到协作白板中。在设计团队内部评审环节很常用,适合跨办公地点的设计协作、沟通。

用你的设计稿制作高保真原型。

  • 本地制作:就在你的设计环境中制作可以点击的原型。
  • 即时同步:一键将你制作的原型同步到 Invision。
  • 可交互:用可交互的热区将你的画板连接起来。
  • 协作:实时从你的团队获取迅速的反馈。

这个功能比较复杂,但是很好用,这里只做简单的效果演示。需要配合「同步」功能使用。

一键同步本地设计稿到线上。

  • 即时性:只需一键,无缝连接你的设计和原型。
  • 高效:不再有拖拽的苦恼。更少的出错机会意味着更少的烦恼。
  • 一屏操作:就在你的设计环境中把设计作品发送到 Invision。
  • 可靠:时刻保证你的设计稿被同步到线上。

修改界面后,使用「同步」功能同步到 Invision,保持线上的设计稿为最新版本。作为「原型」功能的一个环节。

给你的设计带来真实数据的究极插件。

  • 切题:从图源中选取真实的内容并直接放置于你的设计中。
  • 自定义:从网上,API或你自己的文件中选取内容。
  • 快捷:一键填充真实数据,加速你的工作流。
  • 实用:搭配 CRAFT 其他功能,给你的设计加料。

「CUSTOM」中可以给文字图层快速填充仿真数据,例如姓名、日期、邮箱等,支持自定义字段,比如中国的城市和地址。同样,这个功能也可以给图形图层填充图像,并支持从本地文件夹或 Dropbox 自建图库。

  • 情境带入:从真实的网站上获取图像、文字内容。
  • 真实:使用真实有意义的内容,而不是假字符。
  • 敏捷:一次给选中的多个图层添加内容。
  • 高效:光速填充内容。

「WEB」中内嵌一个浏览器,输入网址后可以获取链接网站上的同类型字段或图像。

  • 预览:在你的设计中置入真实 API 内容。
  • 健康:在每一个界面中都使用真实可靠的数据。
  • 灵敏:给每个单独的图层安排精准的 JSON 数值。
  • 面向企业:使用所在组织的 API 进行极致的设计。

「JSON」中可以链接一个 json 或是拖入文件,选取同组字段进行填充。这里提供一个简单的 json 文件供大家实验。

团队共享云端设计资产。

  • 云端共享:用共享的设计资源保持整个团队的设计流通畅。
  • 专业:一键生成基于现有设计的样式规范。
  • 一致性:在你的样式库里产生的变动会在其他设计组员的设计中同步变更,所以每个成员都不脱节。
  • 自定义:基于你独有的设计给样式库添加特殊的元素。

采集 Sketch 文件中的已有样式,制作共享样式库。在国内可以通过「坚果云」实现样式库在线共享。

采集所有 Sketch 文件中的已有样式,生成一页设计样式导航,包含配色、字体以及字体样式。

忘记粘贴复制吧,用「复制」功能可以快速、完美克隆任何设计元素。

  • 迅速:对设计元素进行快速的、精准到像素的完美复制。
  • 干净:不用手动移位确保了设计元素的一致性。
  • 设计检验:复制足够的设计元素填充界面,以此检测你的设计。
  • 情境带入:Choose an exact number of duplicates, or make a live section.

这个功能和官方的「Make Grid」有些重复,不过如果之前使用了「内容填充」,那么复制出来的图形图层也会被填充上图像。

总结:

CRAFT 给单兵作战的 Sketch 提供了团队作战的能力,配合另外几个本地实用功能,它绝对有资格常驻在你的 Sketch 中。

您可能想查找下面的文章:

  • 高手进阶技巧!全方位深入理解 Sketch 库(上)
  • 高手进阶技巧!全方位深入理解 Sketch 库(中)
  • 大公司如何做设计系统?24 个 Sketch 组件库源文件合集下载
  • 我们拿到了InVision Studio 的内测资格,设计师们关心的都在这里
  • 免费高效!用 Paddy 让你的 Sketch 学会自动排版!
  • 学会这4大Sketch 高阶技巧,让你的效率猛翻10倍!
  • 两分钟认识一款把 Sketch 变成 Principle 的插件:Diya
  • Sketch 49 的交互原型新功能怎么用?来看这篇教程!
  • 简单实用!七步学会用 Sketch 搭建复杂表格
  • 新鲜出炉!五个超方便的Sketch 48 新功能介绍

相关文章

  • 2018-08-23风骚一点!在网页中玩转霓虹色的正确姿势
  • 2018-08-23省时高效!苹果官方的设计流程和实用工具推荐
  • 2017-08-06美工自我培养的几点经验总结
  • 2017-08-06图片动态加载技术应用及jquery.lazyload插件使用实例
  • 2017-08-06最新18个绿色风格网页设计作品欣赏收集
  • 2018-08-23掌握这7个原则,帮你快速提高产品的可访问性
  • 2018-08-23高手怎么做设计?来看腾讯文档背后的品牌设计过程!
  • 2017-08-06CSS实现单行、多行文本溢出显示省略号的实现方法
  • 2018-08-23镜头后的趋势!EyeEm 2017年春夏视觉时尚趋势报告
  • 2018-08-23上亿人使用的手机淘宝卡券包,设计师是这么做改版的!

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • css自动截取指定长度字符串,结尾显示... 支持FF浏览器
    • 为什么做版式设计你总是没有思路?
    • 做PPT 超过1000个小时后,总结的实用进阶指南
    • 写给UI新手的APP结构指南:注册和登录
    • 3+3法则!教你六步创造超酷的几何感设计
    • Facebook 产品设计师:如何提高自己的设计审美?
    • 如何画好一张描边插画?来看这份超全面的总结!
    • 为什么优秀的设计师都是讲故事的高手?
    • 用58同城的实战案例,带你认识完整的改版流程!
    • 网站的视觉设计路径应顺应用户习惯

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有