sketch钢笔工具_Sketch和Figma,不同的工具等于不同的结果

sketch钢笔工具

We like to compare the difference between various design programs and debate about which one is the most powerful. But we often forget to reflect on how using one of these tools is impacting our product. A powerful artist would say that he can create on any medium and while it is true someone like da Vinci didn’t seem to have had problems switching from science drawings to the Chapelle Sistine his process and his final result are completely different by nature.

我们喜欢比较各种设计程序之间的差异,并讨论哪个程序最强大。 但是我们常常忘记反思使用这些工具之一如何影响我们的产品。 一位有才华的艺术家会说他可以在任何媒介上创作,虽然确实如此,像达芬奇这样的人似乎并没有遇到从科学绘画切换到夏皮·西斯廷的问题,但他的创作过程和最终结果在本质上是完全不同的。

As designers, we rely heavily on our tools to produce what we want them to do but we often forget that we have learned to want what the tool can do.As a junior designer, I would say that I have the luxe of not knowing what the tools can’t do and I am more inclined to notice the difference between the idea and it’s execution. But even there my knowledge as grown so much that I surprise myself drawing wireframes with the program construction logic in the back of my mind.

作为设计师,我们非常依赖我们的工具来生产我们想要他们做的事情,但我们常常忘记了我们已经学会了想要工具能够做的事情。作为初级设计师,我会说我很奢侈,不知道要做什么工具无法做到,我更倾向于注意到这个想法和它的执行之间的差异。 但是,即使到那里我的知识也是如此丰富,以至于让我惊讶的是,我脑海中用程序构造逻辑来绘制线框。

So here is my little analysis of how logic difference behind sketch and Figma is changing the way I work and the product I make.

因此,这是我对草图和Figma背后的逻辑差异如何改变我的工作方式和产品制造方式的一些分析。

素描,以及完美结果的挑战 (Sketch, and the challenge of perfect results)

Image for post
Sketch screenshot
草图截图

Sketch was made with the idea of creating a vector tool with a system to easily group and manage assets it also supports multiple art-boards to help with website design. From this idea of design management tool Sketch as grown in features developing a way to create component and symbols.

Sketch的创建思路是创建带有系统的矢量工具,该系统可以轻松地对资产进行分组和管理,它还支持多个画板,以帮助进行网站设计。 从这种设计管理工具的想法开始,Sketch随着功能的发展而发展,从而开发了一种创建组件和符号的方法。

Because sketch was made after vector building tools like Adobe illustrator, it carries in his bones all the powerful features these tools have.

由于草图是在Adobe illustrator之类的矢量构建工具之后制作的,因此草图具有这些工具所具有的所有强大功能。

素描在制作符号和插图时闪耀 (Sketch shine in making symbols and illustrations)

The superpower of Sketch is to let you make perfect symbols that adapt to any kind of content and situations. The idea is that you will spend time making the perfect component that you will then reuse everywhere in your app for consistency, it contains very precise and fine-tuning controls that will enable you to achieve almost anything.

Sketch的强大功能是让您制作出适合任何内容和情况的完美符号。 这个想法是,您将花费时间来制作完美的组件,然后再将其在应用程序中的任何地方重复使用以保持一致性,它包含非常精确和微调的控件,使您几乎可以实现所有目标。

Or does it?The logic behind sketch is that you will use symbols and nested symbols for everything, the tool is made to lead you toward the creation of an atomic design system and integrate component within components.

还是呢? 草图背后的逻辑是,您将对所有内容使用符号和嵌套符号,该工具可引导您创建原子设计系统,并将组件集成到组件中。

The side effect is that you end up always making the same structure “image; title; extract; button with icon”. You will get the logic pretty quickly and with it, your brain will adapt the design thinking process into:

副作用是您最终总是制作相同的结构“图像; 标题; 提取; 带有图标的按钮”。 您将很快获得逻辑,并有了它,您的大脑就会将设计思维过程调整为:

“How does this symbol should be created?” “How can I make this a nested component?” “Is there a way for me to reuse this element?”

“应如何创建该符号?” “如何使它成为嵌套组件?” “我有办法重用此元素吗?”

Notice how none of these questions talks about what the app needs.

请注意,这些问题都不是关于应用程序需求的。

但是,草图受制于过多的规则 (However, sketch suffer form making too many rules)

Maybe we can blame the Dutch who made it for it.

也许我们可以为此归罪于荷兰人。

After some time inside of your project, you might think you want to change the behaviour a certain element, start looking for it and realize you can’t find what it the cause of this effect.

在您的项目中经过一段时间后,您可能会认为您想将行为更改为某个元素,开始寻找它,并意识到找不到导致这种情况的原因。

A fine-tuned component as a cost, it creates countless intricate rules, you will need to learn them, use them and remember what you did. Chances are after a few weeks you would probably have lost track of how you tuned your app.

作为成本进行微调的组件,它会创建无数复杂的规则,您将需要学习,使用它们并记住自己的工作。 几周后,您可能会忘记如何调整应用程序。

This should not change the way you work, or does it?Sketch is so complex you will start to always use the same working structure, across multiple apps similar symbols will have similar behaviour. We learn to be efficient and with it loose in creativity. this means that production with Sketch is pretty straight forward you have a process to go from wireframe to high fidelity design and you will use it always the same way because it is the fastest way you have found.

这不应该改变您的工作方式吗? 草图是如此复杂,您将开始始终使用相同的工作结构,在多个应用程序中,相似的符号将具有相似的行为。 我们学会提高效率,并失去创造力。 这意味着使用Sketch进行生产非常简单,您有一个从线框设计到高保真设计的过程,并且将始终以相同的方式使用它,因为这是最快的发现方法。

The key with Sketch is that it is made to create ONE good design

Sketch的关键在于它可以创建 一个 好的设计

用Sketch制作的标志 (The signs of a made with Sketch)

Image for post
Made with Sketch by Prakhar Neel Sharma
Prakhar Neel Sharma的素描作品

You can recognize a work that used all the advanced feature of Sketch when you start to see perfectly sized component easily swapped and assumed bold illustrations who take advantages of complex shadow, blur and gradients.

当您开始看到大小容易互换的完美尺寸的组件并假设使用了利用复杂阴影,模糊和渐变的大胆插图时,就可以识别出使用了Sketch所有高级功能的作品。

People on sketch use fully the advanced vector capacity of the program and create environments that are very consistent since their perfect symbols are made to be shared across the app.

素描中的人充分利用了程序的高级矢量功能,并创建了非常一致的环境,因为使他们的完美符号可以在应用程序中共享。

Figma和永无止境的挑战 (Figma, and the challenge of never finishing)

Image for post
Figma screenshot
Figma屏幕截图

Figma interestingly enough was made after design tool like Sketch. The approach it takes is to simplify the creation process to enable productivity and support a way for the entire team to work together.

有趣的是,Figma是用Sketch这样的设计工具制成的。 它采用的方法是简化创建过程,以提高生产力并为整个团队合作提供支持。

By comparing both interfaces, you will notice Figma offer you directly fewer options forcing you to build anything from the basic building blocks available.

通过比较两个接口,您会发现Figma直接为您提供了更少的选择,迫使您从可用的基本构建块构建任何东西。

Because Figma is made for fast productivity it sacrifices features to improve your speed

因为Figma是为提高生产率而制造的,所以它牺牲了一些功能来提高速度

Figma让您拥有更大的自由度,从而获得成功。 (Figma succeed by allowing you to extrême freedom.)

Strangely enough not having many options and tools let you get more creative. Figma doesn’t struggle you with rules and precision it wants you to try, copy and tweak things and do as much as you need to. It does trigger your creativity more as you have to figure new ways to achieve your goals with much simpler tools.

奇怪的是,没有太多的选择和工具可以让您更具创造力。 Figma不会在规则和精确度方面让您费解,它希望您尝试,复制和调整事物并做所需的事情。 它确实会激发您更多的创造力,因为您必须找到使用更简单工具来实现目标的新方法。

Or does it?The thing with Figma is that you will be constantly looking for the solution or the trick to get the right results. You are missing fine controls so your process becomes more about trying then making. Figma is always inviting you to tweak something this mean your production will become longer as you will spend time endlessly creating new versions.

还是呢? Figma的作用是,您将不断寻找解决方案或技巧,以获取正确的结果。 您缺少精细的控件,因此您的过程将变得更多地尝试然后进行。 Figma一直在邀请您进行一些调整,这意味着您将花费更多的时间不断地创建新版本,从而使制作变得更长。

Figma难以摆脱混乱且不够精确 (Figma struggle from being messy and never precise enough)

Pretty quickly you will realize that your art-boards contains hundreds of screens and see that you have barely named your assets. Finding the right information gets impossible as you reach “rectangle 4500”. But that is not everything, because you have been limited with simple tools, you have not created something precise. Yes some versions have some work into it and the structure is well thought but there is always a detail that is missing a rule that doesn’t get applied the way it should. Because your symbols are not smart you will have to make multiple versions and write rules on a document for your developers to understand how it should work.

很快,您将意识到您的画板包含数百个屏幕,并且看到您几乎没有命名资产。 当您到达“矩形4500”时,找不到正确的信息是不可能的。 但这还不是全部,因为您受到简单工具的限制,因此没有创建精确的东西。 是的,有些版本有一些工作要做,并且结构经过深思熟虑,但始终有一个细节遗漏了未按应有的方式应用的规则。 由于符号不是很聪明,因此您必须制作多个版本并在文档上编写规则,以供开发人员了解其应如何工作。

This should not impact your final result, or does it?Your brain will quickly adapt to the idea of not being perfect, Figma wants you to think about the big image and the layout and you will. You will start to have versions with placeholders only, extensive lorel Ipsum and realize you spend a lot of extra time cleaning your developer handoff version. You will stop considering tiny details and the quality of your product will start to suffer from it.

这不应该影响您的最终结果吗? 您的大脑将很快适应不完美的想法,Figma希望您考虑整体形象和布局,并且您会的。 您将开始拥有仅包含占位符的版本,广泛的lorel Ipsum,并意识到您花了很多额外的时间来清理开发人员移交版本。 您将不再考虑微小的细节,产品的质量将因此受到影响。

The key with Figma is that it wants you to EXPLORE many designs

Figma的关键是它希望您 探索 许多设计

用Figma制造的标志 (The sign of a made with Figma)

Image for post
Made with Figma by Zoia Maltseva
Zoia Maltseva用Figma 制成

When someone builds with Figma what you can immediately notice is the bold structure of the app (this is enabled by the supper handy grid tool). Because many version has been done, in the final result the information is perfectly organized and the design is rich of different unique components tailored to each situation.

当有人使用Figma进行构建时,您会立即注意到该应用程序的粗体结构(这由超级方便的网格工具启用)。 因为已经完成了许多版本,所以最终结果是信息得到了完美组织,并且设计中包含了针对每种情况量身定制的不同独特组件。

But Figma is lacking super precision and advanced fine-tuning so designers go for simple shapes in illustrations, no shadow, flat design and high colour contrast.

但是Figma缺乏超高精度和先进的微调功能,因此设计师追求的是插图中的简单形状,没有阴影,平面设计和高色彩对比度。

同一家公司的2个结果 (2 results from the same agency)

Image for post
CubertoCuberto制作的Sketch&Figma应用程序

Now for the final test, what can we get from comparing work from one of the best design agency out there.

现在进行最终测试,通过比较最好的设计机构之一的工作我们可以得到什么。

On Sketch, we see that Cuberto has taken advantages of the advanced shadow and gradient features. Because fine-tuning is easy they have used overlapping layers and subtle colour difference inside the app.

在Sketch上,我们看到Cuberto利用了高级阴影和渐变功能。 由于微调很容易,因此他们在应用程序内部使用了重叠的图层和细微的色差。

On Figma however, there is no fancy shadow game, the app had to get to the most simple version. so they have used bolder colour difference and inserted simple shapes as illustrations to make the elements attractive.

但是,在Figma上,没有花哨的影子游戏,该应用必须升级到最简单的版本。 因此他们使用了更大胆的色差,并插入了简单的形状作为插图来使元素具有吸引力。

这并不都是黑暗和严峻的。 (This is not all dark and grim.)

With the right process and experience using any tool will be more about creating what the app needs to do for the user. Even though it is harder on some tools to get to certain results you can achieve any results on any tools.

拥有正确的流程和经验,使用任何工具都将不仅仅是为用户创建应用需要做的事情。 即使在某些工具上很难获得某些结果,您也可以在任何工具上获得任何结果。

This article is more about the reflection that what you can do might not be what you chose to do because you go for the easiest solution within your environment.

本文更多地反映了您可以做的事情可能不是您选择做的事情,因为您选择了环境中最简单的解决方案。

您是否看到过自己发生的事情? (Have you seen it happening on yourself?)

I am a junior designer and it is a bit hard for me to see how a final result could have been different if I had used the other tool. But I definitely see my process being different according to the program I use.

我是一名初级设计师,如果我使用其他工具,最终结果可能会有所不同,这对我来说有点困难。 但我肯定会发现,根据所使用的程序,我的过程有所不同。

My goal is to find ways to use the best program according to the situations, making big apps make a lot of sense on Figma. Meanwhile making complex illustration and very high fidelity product make more sense in Sketch.

我的目标是根据情况找到使用最佳程序的方法,从而使大型应用程序对Figma有意义。 同时,在Sketch中制作复杂的插图和非常高保真的产品更有意义。

What about you? Feel free to leave your experience on the comments.

你呢? 随时在评论中留下您的经验。

翻译自: https://uxdesign.cc/sketch-and-figma-different-tools-equals-different-results-3fe5ac8e7df9

sketch钢笔工具

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/275497.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

程序下载

Zaxis终端前置机 版 本下 载特 性1.20.1104.102ZaxisSetup.rar 分类: 程序下载转载于:https://www.cnblogs.com/baijinlong/archive/2011/05/13/2045263.html

提升效率的Vue组件开发和实战技巧

大家好我是若川。现在的大前端时代,是一个动荡纷争的时代,江湖中已经分成了很多门派,主要以Vue,React还有Angular为首,形成前端框架三足鼎立的局势。Vue在前端框架中的地位就像曾经的 jQuery,由于其简单易懂…

linux下telnet失败怎么处理,CentOS下telnet退出失败的解决办法

最近有CentOS用户反映在调试网络程序时出现了问题,服务虽然启动了,但客户端却无法连接上,用telnet连接后发现是Windows防火墙的问题,可是用telnet命令连接成功后发现退不出去了,这该怎么办?下面小编就给大家…

figma下载_Figma中的动态内容和颜色

figma下载First off, why use dynamic data?首先,为什么要使用动态数据? It’s easy to create and manage long lists of content 创建和管理一长串内容很容易 You get a better idea of what your product will look like with actual data 通过实际…

你可能不知道的package.json

大家好,我是若川。最近组织了源码共度活动:1个月,200人,一起读了4周源码,参与的小伙伴都表示收获很大。如果感兴趣可以点击链接扫码加我微信 ruochuan12。今天推荐一篇相对简单的文章。前言在上一篇npm init vitejs/ap…

基于上下文的rpn_构建事物-产品评论视频中基于上下文的情感分析

基于上下文的rpnThe word “Social” has taken a whole new meaning in today’s digital era. Simply going out to enjoy is no longer the only “social” criteria. Social now is — giving a peek in your personal and professional life to your connections. Facebo…

可爱的 Python: 使用 mechanize 和 Beautiful Soup 轻松收集 Web 数据

可爱的 Python: 使用 mechanize 和 Beautiful Soup 轻松收集 Web 数据 使用 Python 工具简化 Web 站点数据的提取和组织 David Mertz, Ph.D., 开发人员, Gnosis Software, Inc.从 2000 年开始,David Mertz 就一直在为 developerWorks 专栏 Charming Python 和 XML M…

JavaScript 断点调试技巧

大家好,我是若川。最近组织了源码共度活动:1个月,200人,一起读了4周源码,参与的小伙伴都表示收获很大。如果感兴趣可以点击链接扫码加我微信 ruochuan12。之前推荐过很多次调试文章,说明调试的重要性&#…

大学生电子设计大赛案例分析_为大学生设计问答平台—案例研究

大学生电子设计大赛案例分析Dealing with academic-related questions like picking a course, fulfilling a major requirement can be tedious and ineffective when you have to simultaneously balance school work, social activities, and focus on personal growth and …

最新最详细最简洁Eclipse调试PHP配置详解(Xdebug,Zend Debugger)

搬家注:该日志写于2011 年 04 月 07 日,Eclipse,PHP等版本号很多,更新也比较快,请注意文章中的版本。本文不一定帮您解决问题,但能给您一些解决问题的思路及一些概念。 最近开始做SRTP项目WebOS&#xff0c…

入门前端学习路线图【送书】

大家好,我是若川。记得点上方音频听小姐姐配音,超级好听。华章图书又赞助了书籍送福利给大家。本次送4本书的抽奖方式是:截止到9月6日(周一)20:00,在留言区留言任意内容。我会在留言区抽取「1位」关注我公众…

单选按钮设置为被选中状态_为什么要设置错误的按钮状态

单选按钮设置为被选中状态当正确的方法出错时 (When the right way goes wrong) Let’s say you want to create a click effect on an HTML button. The first idea that many people get is to do something that reproduces the feeling of the sound emitted by a real but…

「娃娃分享」-常见自校检分析实例.

自校检是许多软件的保护手段之一,对软件加个简单的壳再增加自校检在一定程序上可以抵挡住一大部分新手,不过,对许多人来说,这个保护已经很弱了。。下面讲几种常见的解决自校检方法,写的粗略,希望大家补充。…

用VC和MinGW导出dll的def和lib(a)文件

为什么80%的码农都做不了架构师?>>> 原文地址:http://zhangyafeikimi.iteye.com/blog/404580 有了dll文件需要导出def文件: pexports zlib1.dll > zlib1.def 有了dll和def文件,需要导出MinGW的.a文件:…

产品设计美学案例分析_美学在产品设计中的重要性

产品设计美学案例分析重点 (Top highlight)In one of my previous jobs, I had really interesting debates with the CEO regarding whether we should spend more time improving the way our app looks and feels. ‘How could he not care that the design is outdated?! …

即将到来的ECMAScript 2022标准

大家好,我是若川。周末分享一篇相对简单的文章。最近组织了源码共度活动:1个月,200人,一起读了4周源码,参与的小伙伴都表示收获很大。如果感兴趣可以点击链接扫码加我微信 ruochuan12。另外:昨天的推文入门…

c语言中二叉树中总结点,C语言二叉树的三种遍历方式的实现及原理

二叉树遍历分为三种:前序、中序、后序,其中序遍历最为重要。为啥叫这个名字?是根据根节点的顺序命名的。比如上图正常的一个满节点,A:根节点、B:左节点、C:右节点,前序顺序是ABC(根节…

动态库的创建与使用

1、动态库文件的创建 (1)编写源文件 (2)编译生成动态库 g -fPIC -shared -o libfile_operation.so file_operation.cpp 此编译过程分为两步,等同于下面的两个命令: g -c -fPIC file_operation.cpp …

ux设计中的各种地图_UX写作中的移情

ux设计中的各种地图Demetri Martin is a master of comedic situations. If you’ve never seen Demetri Martin是喜剧情境的大师。 如果你从未见过 him before, he has a sort of dry brand of observational humor, relying more on anecdotes than full stories, and often…

字符串搜索。HOJ1530 Compound Words。

stl set实现字符串搜索。。效率一般。(附二分搜索。) Compound WordsTime limit:1sec.Submitted:233Memory limit:32MAccepted:81Source: Waterloo ACM Programming Contest Sep 28, 1996 You are to find all the two-word compound words in a dictionary. A two-word compo…