Storyboard支持Sketch吗?

Crank Storyboard是专门为消除开发人员和设计师在嵌入式GUI产品上的合作障碍而设计的产品。虽然Adobe Photoshop多年来一直是设计师的首选工具,但现在Sketch的受欢迎程度越来越高,自然而然地我们也就收到了许多关于我们如何支持Sketch的问题。

在UXTools.co对4000多名设计师的调查中,选择Sketch作为主要设计工具的专业人士是Photoshop的14倍以上。

这对Storyboard用户来说意味着什么?

在我们已发布的版本中,团队可以获得对Sketch设计文件的绝无仅有的支持体验,包括帮助嵌入式GUI团队快速迭代、简化测试和快速交付产品的所有导入和再导入功能。

Crank公司的软件开发人员Evan Beisheim和用户界面设计师Daniel Conroy解释了Storyboard对Sketch的支持是如何工作的,以及在最新版本中您会获得些什么。

您是如何为Sketch相关的功能助力的?

Evan:作为Crank研发团队的一员,我参与了Storyboard产品的不同方面,从运行时到前端。对于Sketch,为了建立我们的导入和再导入功能,我做了很多了解其设计文件工作原理的工作。

Dan:我是一名支持我们营销和产品团队的图形和用户体验(UX)设计师。我的角色的一个关键部分是为专业服务设计GUI,并为产品团队设计实际样本,包括帮助Evan测试哪些是有效的,哪些是无效的,以验证我们的Sketch功能。在我们两个人之间,我们在Sketch内设置了GUI场景,以确定跨工具的最佳工作流程。

在Sketch和Photoshop之间,嵌入式GUI团队应该注意到哪些差异?

Dan:对于嵌入式GUI设计团队来说,有一些我们工作之外的原因是很重要的。如今,Sketch不仅比Photoshop更受欢迎,而且通常也更有成本效益。Sketch的内存和资源消耗也往往比Photoshop少,而每个人都喜欢有更多的能力供他们使用。

作为一个拥有30多年历史的软件,我认为Photoshop并不是真正为产品设计而建立的,特别是嵌入式系统的项目。Sketch是在后iPhone时代出现的,所以它更专注于GUI设计和优化,而不是为照片编辑和图像处理提供无关的功能。在Sketch中,有一些功能是因此而产生的,比如共享样式,允许设计师在整个GUI文档中重复使用共同的元素,而不是在Photoshop项目中依靠您自己的手工工作来进行全局的改变。

Evan:另一个重要的区别是Sketch Page。设计师使用Pages来组织文档中的内容,这在Photoshop中是不存在的。对于GUI设计师来说,Pages是一个很好的功能,因为它允许他们在一个文档中分割出可能不相关但有用的内容来参考。例如,设计师可以在每个页面上布置一个GUI屏幕,做任何他们想做的修改,并且只选择他们想导入和重新导入Storyboard的那些页面。

这给Storyboard用户带来了一个很好的点。Sketch中的所有东西,无论是共享样式还是页面,都会在Storyboard中被带入并栅格化为PNG图像。这意味着设计师和开发人员不必担心元素丢失,或不得不在Storyboard工作区重建。他们可以专注于添加过渡、动画和事件,并将GUI与后端应用程序整合起来。

Storyboard是如何支持Sketch用户的?

Evan:通过最新的版本和我们的快速设计导入和迭代技术,Storyboard允许用户直接将Sketch文档导入和重新导入工作区,保留设计的所有元素和迭代。这是一种一键式的方法,将丰富的设计和用户体验工作引入平台,以便进一步开展应用行为、测试和性能优化工作。

首先运行Import Wizard(导入向导),将Sketch文档导入Storyboard并允许开发人员进行开发工作。当设计有变化时,例如来自用户测试的变化,Re-Import Wizard(重新导入向导)就会被用来将这些更新应用到Storyboard GUI应用程序中,而不需要修改或重做任何已经完成的后台工作。

Re-Import Wizard(重新导入向导)还包括一个合并和比较工具,它向用户展示了所做的设计变更的可视化呈现,并允许他们挑选他们所能接受的变更到Storyboard应用程序中。即使您添加了一个全新的screen(屏幕),Re-Import Wizard(重新导入向导)也会识别它,您可以把它添加到您现有的项目中。

这极大地改善了Sketch的工作流程,因为用户不再需要使用单独的插件来导入文件,这一切都可以在Storyboard工作区完成。

Dan:这种精简的方法确保了嵌入式GUI团队能与Sketch更好地合作。设计师可以自由地创造最好的用户体验,而开发者则可以专注于后端整合工作。他们都不必担心由外部利益相关者驱动的设计变化和迭代,因为Storyboard的重新导入过程确保这些变化以最小的工作量反映在工作区。

您如何设置Sketch与Storyboard一起工作?

Evan: 虽然这话说的有点多余,但您真的需要在您的电脑上安装Sketch(与Photoshop不同)。在您的Sketch文档中,有几件事需要考虑,以简化导入和重新导入Storyboard的过程。

将您的设计完全按照Storyboard中的布局来布置,包括GUI的层次结构。这可以确保两个工具之间在尺寸、布局、行为等方面没有差异。

确保Sketch元素的独特和一致的命名。Sketch是非常自由的——您当然可以给所有东西起一样的名字——但Storyboard需要独特的名字来识别元素,处理事件,并在运行时更新行为。

虽然Sketch支持几乎无限个递归对象,但Storyboard有一个严格的应用架构来优化运行时性能。设计师应该学习这种架构,并将其建立在他们的Sketch文档中,以确保将没有任何损失产生。您可以在本指南中了解更多关于Sketch最佳实践的细节。

随着Sketch作为嵌入式GUI设计工具被越来越多的人采用,Crank致力于发展我们的快速设计导入和迭代技术,以继续支持它作为令人惊喜的用户体验内容的来源。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Crank软件

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值