干货!Sketch49交互原型新功能大解析

2月28日发布了Sketch49新版本的消息,笔者打开了官网看到了最新的版本更新视频,确实还是挺激动的。觉得Sketch按照这样的发展趋势,马上就能“统一六国”了,哈哈。一起来看看Sketch49的版本更新了哪些新功能吧!(先看介绍,使用教程在后面哦!)亮点一:交互原型功能画板(Artboards)和热区(Hotspot)链接实现页面间的跳转,实现动态交互原型(类似交互软件Marvel中的热区链接 )Sketch49版本中的交互原型预览...

2月28日发布了Sketch49新版本的消息,笔者打开了官网看到了最新的版本更新视频,确实还是挺激动的。觉得Sketch按照这样的发展趋势,马上就能“统一六国”了,哈哈。



一起来看看Sketch49的版本更新了哪些新功能吧!(先看介绍,使用教程在后面哦!) 


亮点一:交互原型功能

画板(Artboards)和热区(Hotspot)链接实现页面间的跳转,实现动态交互原型(类似交互软件Marvel中的热区链接 )


干货!Sketch49交互原型新功能大解析


Sketch49版本中的交互原型预览图(话说这线条敢不敢再乱点,页面多了眼会瞎么?相比之下Principle还算很好了)我觉得这也是Sketch需要解决的一个使用体验问题,期待后续版本可以有好的解决方案。

干货!Sketch49交互原型新功能大解析

亮点二:便捷的效果预览

设计制作的交互原型,可以通过三种方式预览查看:

1.Sketch软件内部预览(类似于Principle中的预览窗口,或xcode中的模拟器)

干货!Sketch49交互原型新功能大解析

2.Sketch Mirror内实时预览,(USB连接或同局域网内预览操作)


3.Sketch Cloud内实时预览,(登录Sketch Cloud后可将项目文件上传至官方云端,实现在线多人预览,并可进行讨论。)

其他更新

  • Sketch Cloud 中文件可安装为Libraries

  • 增强复制粘贴大型文档性能

  • 改进 EPS/SVG格式文件 导入

  • 渐变锚点改为单击增加

  • 图层列表拖入画板内不再是位图

  • 优化缩略图性能新增原型设计模板及修复已知Bug

干货!Sketch49交互原型新功能大解析

交互原型功能教程


1. 页面链接跳转(也就是画板之间的切换)
更新到Sketch49后,在工具栏右侧会发现“Link”功能按钮 


干货!Sketch49交互原型新功能大解析


选中画板中的一个对象后可激活“Link”按钮(仅选中画板无法创建链接)


干货!Sketch49交互原型新功能大解析


创建Link链接后,我们会发现Sketch左侧图层 矩形上的变化(多了一个曲线箭头,表示有链接)

干货!Sketch49交互原型新功能大解析


修改页面切换动效:

干货!Sketch49交互原型新功能大解析

从左至右分别是:无 、向左切换、向右切换、向上切换、向下切换 (第一个版本可能比较保守,没有太多动效选择) 

2. 如何取消链接操作呢?
选中 原有链接对象-矩形 ,右侧面板中可编辑链接 

干货!Sketch49交互原型新功能大解析

或将 Target 修改为 none


检测页面逻辑可以通过查看跳转目标验证


干货!Sketch49交互原型新功能大解析


3. 如何创建热区?
在Sketch中 热区称为 Hotspot ,可以 通过 菜单栏中的 Insert(插入)找到,也可以使用快捷键 H  

在画板内鼠标左键圈出“热区”范围,箭头指向目标画板(页面)

干货!Sketch49交互原型新功能大解析


在自定义工具栏中可以为“热区”添加快捷入口

干货!Sketch49交互原型新功能大解析


4. 如何预览交互效果?

A. Sketch软件内部预览(黑屏的小伙伴请看文末说明) 
连线操作完成后,点击 预览按钮 

干货!Sketch49交互原型新功能大解析

干货!Sketch49交互原型新功能大解析


B.Sketch Mirror手机内预览(暂无Android版本,且无法像Principle缓存至手机内离线操作) 
打开Sketch Mirror,按照在Sketch内设置的交互操作即可。

干货!Sketch49交互原型新功能大解析


当忘记操作热区时,会有红色线框提示:

干货!Sketch49交互原型新功能大解析


C. Sketch Cloud云端团队协作预览 
注册/登录 Sketch Cloud 

干货!Sketch49交互原型新功能大解析


登录后可将当前项目上传至Sketch Cloud云端

干货!Sketch49交互原型新功能大解析

干货!Sketch49交互原型新功能大解析


邀请项目成员及权限设置

干货!Sketch49交互原型新功能大解析


上传成功后可查看当前原型项目

干货!Sketch49交互原型新功能大解析


Sketch49 预览窗口“黑屏”怎么回事?

干货!Sketch49交互原型新功能大解析


笔者也遇到了这个问题郁闷了很久,找了几个小伙伴一起帮忙测试,发现疑似是OS X版本导致,我MacBook PRO(10.12.6 )可正常预览显示。家中的iMAC(10.13.3)却一直无法连接。


但是暂没有看到官方解释,我也仅仅是个人猜测。

最后总结

本次Sketch更新的力度还是很大的,能看得出它在移动端设计上越加强大,真希望有一天能“统一六国”,UI设计师们可能也不会那么折腾,那么累了!

为了您更好的学习体验,在此占用您5分钟的时间,请您通过填写问卷,协助在线教育平台美啊(http://meia.me)改进和完善我们的工作。为了感谢您的配合,完成问卷可获得美啊赠送的50元课程代金券,还有机会获取设计师礼包哦~点击“阅读原文即可参与~

干货!Sketch49交互原型新功能大解析

原创文章,作者:交互精选,如若转载,请注明出处:https://www.iamue.com/35685/

(0)
交互精选交互精选
上一篇 2018-03-06
下一篇 2018-03-07

相关推荐

  • 【技术篇】AR应用交互设计时需要思考的3个问题

    首先我们要了解,AR增强现实通过实时的在现实环境中渲染虚拟数字信息,通过现实和虚拟的结合来帮助用户完成某项任务和活动。AR中的虚拟数字信息通过与现实环境以及用户的实时互动来向用户传递有价值的信息。相比“传统的”2D层面的交互(手机app,web等),AR可支持的是更加丰富的三维层面的交互方式;并且这种方式不再仅限于主动式的交互(点击,滑动)方式,它还包括用户行为的被动触发。本文将向大家介绍一些典型的AR应用以及它们的交互方式,并且和大家...

    2018-03-29
  • 感恩之家与河马教育签订人才需求战略合作协议

    2018年2月24日,河南感恩之家实业有限公司(以下简称感恩之家)与河南河马教育科技有限公司(以下简称河马教育)签订人才需求战略合作协议。感恩之家人力资源经理朱昌林与河马教育创始人陈滨感恩之家惠民工程是实体企业+互联网+实体店铺+分享经济的大惠民工程。在即将上线的电商平台部分,我们精心筛选了上百款来自全国各地的特色产品。在展示产品安全、原产、优质的同时,我们充分挖掘地域风土人情、历史人文,围绕产品特色讲述一个个中国物产的故事。这些都需要...

    2018-03-03
  • Axure RP 8.0安装图解

    Axure RP 8.0下载链接:链接:https://pan.baidu.com/s/1jJFQwLK 密码:3d1yAxure RP是美国Axure Software Solution公司旗舰产品,是一个专业的快速原型设计工具,让负责定义需求和规格、设计功能和界面的专家能够快速创建应用软件或Web网站的线框图、流程图、原型和规格说明文档。作为专门的原型设计工具,它比一般创建静态原型的工具如Visio、Omnigraffle、Illu...

    2018-03-24
  • 全新用户体验+500多项升级功能,IFS Applications 10正式发布!

    ↑关注IFS软件获取最新资讯  ↑IFS Applications 10令人惊叹的视觉效果和全新的互动模式让用户在提高工作效率的同时更喜欢通过这款系统来办公创新的新功能 —— 包括AI 聊天机器人、增强的以服务为中心的功能以及所有解决方案领域的数百项功能优化和升级IFS始终尊重客户的选择:IFS Applications 10同时支持云端和本地部署全球领先的企业级应用软件提供商IFS(艾菲诗软件)宣布,全新版本的企业应用系统套件IFS ...

    2018-05-04
  • 校园招聘 | 网易交互设计实习生

    网易交互设计实习生公司简介网易2001年正式成立在线游戏事业部,与广大游戏热爱者一同成长15年,是全球领先的游戏开发与发行公司,自主研发了《梦幻西游2》《大话西游2》《天下3》《乱斗西游》《梦幻西游手游》等几十款倍受玩家喜爱的热门端游和手游,更独家代理了《魔兽世界》《炉石传说》等多款风靡全球的游戏。 2015年,网易游戏正式开启“游戏热爱者”品牌战略,用自身行动传导热爱者价值,并全面启动“聚合精品,共享热爱”战略计划,以全球化视野为游戏...

    2018-02-10
  • 818那些影响用户体验的创意

    作为创意经常不通过审核的一枚苦逼广告主,你一定经常看到以下拒绝原因:因模糊、变形,出现马赛克等原因导致无法识别,请优化。人物形象影响用户体验,如【动作不雅、衣服暴露、大头照】。文字包含【低俗、不良诱导、负面描述】等影响用户体验。……有没有觉得很委屈,很痛苦,很莫名其妙?作为苦逼的设计师,好不容易满足了甲方爸爸的变态要求,没想到又被更变态(划掉,正规)的腾讯社交广告审核拒绝了。概括一下,这些拒绝原因全部称为“影响用户体验”。那什么是影响用...

    2018-04-19
  • 【干货知识】最全面的交互设计原则和理论汇总(下)

    【点击上方蓝字↑↑↑关注「艺恋优梦」获得每晚推送】防错原则:防错原则认为大部分的意外都是由设计的疏忽,而不是人为操作疏忽。通过改变设计可以把过失降到最低。该原则最初是用于工业管理的,但在交互设计也十分适用。如在硬件设计上的 USB 插槽;而在界面交互设计中也是可以经常看到,如当使用条件没有满足时,常常通过使功能失效来表示(一般按钮会变为灰色无法点击),以避免勿按。如上图所示极客公园的评论功能快,在留言框没有内容或邮箱格式不正确的时候是无...

    2018-04-11
  • 【UI交互设计】首月结课作业展示

    花瓣美素是全国最大的版权素材平台,本文章内学生作品图片,未经允许,严禁抄袭和转载。花瓣网丨花瓣美素教学中心,承担天津市大学软件学院数字媒体专业UI交互设计方向120人的教实训任务,在刚刚过去的第一个月里,通过同学们和教师团队的不断努力,专业核心课程《图形图像基础》和《用户体验设计》等两门课程教学任务圆满完成。《图形图像基础》是UI交互设计专业的专业必修课。通过企业教师的认真指导和对该课程的学习,同学们对UI交互有了进一步的了解,在企业教...

    2018-04-17
  • 酱课程丨交互设计第②期 · UI/UX傻傻分不清楚?分分钟带你搞懂交互设计下的六大Job Titles!

    上周,我们发布了交互设计师Eary Alan的第一期课程,最值钱的内容,就是这张指导交互设计师们工作流程的“双钻图”了(横屏观看)。从0开始到完成一个设计项目,都是两次发散(Diverging)和两次汇聚(Converging)的结果。Discover探索与调研属于发散型的思考,探索研究问题的本质1. 质疑 rip the brief对需求质疑,对商业模式质疑,对用户质疑,质疑一切不合理的事情。2. 故事/场景 cluster topi...

    2018-04-07
  • 【招聘】阿里、腾讯、网易、百度、亚马逊、德勤、滴滴、京东、华兴资本、去哪儿、蚂蚁金服、特斯拉等

    上海|携程+实习携程运营实习生工作内容 一周内入职1、携程app微领队社交功能“结伴”、“旅友圈”运营(删违规帖+内容运营)2、旅途聚会物料负责、寄送、整理3、旅途聚会新产品冷启动4、聚会产品上货至其他平台(搬砖+运营)5、公用区图片库等内容整理6、大型活动报名信息收集+统计(不定期,非日常)7、临时日常行政工作协助加分项1、熟练excel、ppt、word,书面表达佳2、足够耐心、细心,强责任心3、有办公室实习经验4、可来携程坐班至少...

    2018-04-08