回到主页

用草图揭开设计过程的神秘面纱

对于非设计师而言,我们的工作方式往往存在一定程度的神秘主义。在你的工作中,你可能有责任向设计师作简报,但至于在那个阶段之间发生的事情以及最终看到他们的劳动成果 - 嗯,这可能是相当陌生的。虽然知道这个的细节并不一定很重要(以类似的方式,我不能对我们的开发人员代码方面的内容提出太多的知识),但这篇文章旨在揭开这个过程的神秘面纱并揭示我的一个目前最喜欢的设计程序,并让你有充分的理由说服你工作的任何数字或网页设计师,如果他们已经不使用它的话。更不用说拥有设计软件的顶级概述使得与使用它的人进行通信变得更加容易。

如果以上内容不适合您,请不要再点击; 如果你是的话还有价值:

  1. 设计师 - 了解该程序及相关工具如何改善您的工作方式。

  2. 万事通 - 发现如何改善角色的设计方面

  3. 经理 - 仿佛通过魔术找出如何简化您的团队和流程

还在?好的,我们开始吧。

免责声明:这不是一个广告。

虽然获得赞助撰写这篇文章会很好,但首先要澄清的是,任何可能产生的销售喋喋不休的提示都应该被视为对产品的纯粹热情。

虽然获得赞助撰写这篇文章会很好,但首先要澄清的是,任何可能产生的销售喋喋不休的提示都应该被视为对产品的纯粹热情。

因此,为了减少追逐,我目前最推荐的设计软件是Sketch。如果你愿意的话,这是我的设计合作伙伴。我大约两年前开始使用它,从那以后就没有回头了。在继续'为什么?'之前 如何?' 但是,让我们简单地谈谈那些在黑暗中的实际情况(而不是)。

草图?那是什么?

在纸上Sketch是一个'专有的矢量图形编辑器'。从用户的角度来看,它本质上是一个空白的画布,您可以在其中设计和创建从宏网站到用户界面的细节方面的任何内容。

而不是仅仅通过关于Sketch是什么以及它能够做什么的更多点来喋喋不休,我想要快速地了解它不是什么:

这与 SketchUp(恰好是3D图形建模程序)无关,所以最好不要让它们混淆。

它不是插图,光学操作或文本设置工具 - 这些工具最好分别留给Adobe Illustrator,Photoshop和InDesign。

它无法在Windows / Linux等中运行 - 抱歉!这是一个Apple macOS专用程序; 虽然这样做的好处是它为Mac用户设计了非常精心设计和直观。

这不会打破银行!当然,正是这个免费试用试图让我试一试,但这是非常合理的价格标签将我转变为付费用户。

素描前的生活

在Sketch出现之前,我的设计程序一直是Adobe Illustrator。在我认为自己是一名设计师之前,插画家和我回到青少年时期。多年来,我已经建立了一个知识库,可以令人信服地说我现在对它的功能有了很好的理解,并且非常高兴能够赞扬它对Photoshop的喜爱。同样,当我加入Distilled时,这里的其他设计师也是Illustrator的热心倡导者,所以我从来没有想过对这个过程提出质疑。直到有一天我和另一家公司的设计师聊天,找到我们的流程,怀疑地看着我,问道:“你使用Illustrator进行网页构建设计?!”为了公平对待我们,有很多设计师谁做了,现在仍然这样做。但重要的是,这让我的车轮动起来,让我超越了我们久经考验的工具。经过一些研究后,设计界的很多人都对Sketch赞不绝口 - 这是相对的“街区新生儿”; 所以我自己设定了将它用于我被分配到的下一个项目的任务。

我马上卖了; 这也是你应该做的三个原因。

1.专为数字设计,具有kickass在线社区匹配

与Illustrator不同,Sketch专为数字优先使用案例而设计。随之而来的是一种理解,即我们数字民众希望快速完成任务,我们现在就想要它们。我决定试用,下载,安装和打开应用程序所需的时间不到五分钟。曾经试图在他们的机器上安装Illustrator的任何人都会对我的速度感到惊讶。这并不奇怪,考虑到应用程序本身仅为45.2mb,而Illustrator CS6则为259.8mb。

ketch的UI以干净,模块化的方式布局,没有工具栏可能变得笨拙和不同(我在Illustrator中肯定有罪),如果程序运行的方式进一步反映这种易用性:

无论工具多么直观,当你开始做更复杂的事情时,问题肯定会突然出现。幸运的是,我很快就了解了Sketch所培养的优秀在线社区。我最喜欢的论坛是sketchtalk.io,你通常可以期待很快的回复率。

这个社区不仅在个案基础上很好地分享知识,还有一些人通过编写插件(通常是开源和免费使用)来加强Sketch的功能。例如,就在前几天我遇到了AnimateMate,允许用户创建简单的动画。这只是许多人中的一个例子。通常情况下,如果我知道一些我特别想要做的事情,那就不是本地内置于Sketch中的,我会咨询Google - 'Sketch的'[blank]插件。或者,我会偶尔浏览目录像 这样和 这个发现新的东西。

总而言之,回报远远超过了熟悉略微不同的键盘快捷键的最小学习曲线。

2.通过简化从设计到开发的路线来节省时间(和金钱)

在Sketch之前,从设计到开发的过程通常如下所示:

在Illustrator中创建布局。

为开发人员编写详细的规范文档,包括字体粗细和大小调整等方面,以及十几进制代码颜色。

从Illustrator中为开发人员导出一系列平面图像或PDF,并手动保存他们可能需要的任何资产,例如图标,图像或徽标。

Dev然后离开并使用上面的代码和眼睛构建来匹配设计。

预计会有一些关于获取sizings,padding等的反馈回合。

相反,我的流程几乎减少了一半,现在只包含三个步骤:

在Sketch中创建布局。

将布局导出到Zeplin(第三方插件)项目中。

邀请开发人员参与Zeplin项目(实际上只需几秒钟)。

在设计方面,Zeplin是我第二个最受青睐的工具。它节省了我的时间,省去了编写规范,手动导出资产并减少与开发人员相距一英里的来回。实际上,它几乎应该得到另一篇文章,但与此同时,他们已经了解了Zeplin如何对设计师和开发人员有益的几个快速概述。

如果我还没有说服你,只要知道很多这些新的节省时间的工具只支持Sketch而不是Illustrator ;-)

3.使用与您一样敏捷和迭代的工具

Sketch是一款不断改进和推出更新的应用。他们的网站甚至还有一部分专门用于展示最新的变化。从用户的角度来看,我喜欢这一点 - 它表明我正在获得一项处于技术前沿的产品。当然,更新并不繁琐,没有机器重启等等。大多数都是在酿造啤酒的时候完成的。鉴于没有一天数字环境不会发生变化,很高兴知道您正在使用的工具也随之改变和改进。

事实上,就像提供最好的用户产品一样,它是一个与其他产品一样具有竞争力的市场。除了顽固的Illustrator和Photoshop粉丝试图吸引之外,还有其他人试图抢占市场份额,例如,Adobe XD和即将成为InVision Studio。Sketch民众知道他们不能满足于自己的成就,而且我期待着又一年的健康竞争带来的巨大更新。

结束思考

总而言之,Sketch已经彻底改变了我的设计方式,迫使我更多地考虑自动化的力量,并从而利用不会影响质量的快捷方式。我敦促任何与设计师合作的人让他们试一试。通过一个月的免费试用,真的没有任何借口。

所有文章
×

还剩一步!

确认邮件已发至你的邮箱。 请点击邮件中的确认链接,完成订阅。

好的