《设计的铁拳》是由杰罗德——一名十多年设计经验的设计师所整理的文章合集，被誉为最好的免费设计电子书之一，其中讲述了作者十多年的设计经历下积累的经验，以及作为独立设计师和创业者对设计的反思

设计的铁拳共分为四个部分，分别是

一：设计技术与流程

二：设计师的思维

三：做自己的产品

四：自由职业者

这是一本简洁精炼的设计书，没有华丽或者晦涩难懂的辞藻，以通俗的语气，口语化略带俏皮幽默的风格向你阐述一些设计道理，例如简单的设计流程、如何规避设计中的各种神坑、如何思考，同时回答了设计师是否要学习代码，知识和技能哪个更重要等很有意思又给人启发的一系列问题。

预计用三到四篇文章的长度来翻译完整本作品，本文翻译第一部分内容，后续内容会在后面几周陆续发布。这是我翻译的第四本设计书，完成后本年度的翻译目标就正式完成了，给自己笔芯。

01前言

大家好!我是杰罗德·。

非常感谢你阅读这本电子书。《设计的铁拳》是我最受欢迎的文章的合集。书中所写的的是在我十多年的设计师生涯中所经历的设计和冒险。自从我出版了这本电子书，它已经被像Creative Bloq和AIGA.org这样的顶级设计网站定义为最好的免费设计电子书之一。我对此感到非常自豪，所以真诚地感谢你们的阅读和认可。

祝福你和你的项目一切顺利。

杰罗德·Drysdale 

第一部分：设计技术与流程

对新手设计师常见问题的回答，对非新手设计师来说姑且当做复习。

为什么写作？

写作如何让你成为一个更好的设计师。

在平面设计历史上，伟大的，受人尊敬的设计师们创造了富有洞察力的，有意义的成果。

它们很漂亮。你可以看看卢巴林(Lubalin)的字体设计，或者维格内利(Vignelli)的纽约地铁地图，惊叹其中的美学内涵。

但这些作品并不仅仅因为漂亮而出名。Lubalin和Vignelli更因为他们的沟通能力而备受尊敬:前者的标志作品经常在字母形式中隐藏含义，或者使用一些微妙的隐喻手法，而后者的创新性的地图解开了复杂的地铁系统展示难题。

设计大师是作家、思想家和沟通者。但不知何故，随着网络的发明或其他一些影响，这种传统已经消失了。如今我看到的许多作品集几乎没有什么实质内容。文章写得很差，设计中仅有的一点文字只是用来填充修饰过的照片和插图之间的空间。几乎没有人解释为什么设计会以这种方式结束。

甚至有的整个社区都是围绕着展示漂亮作品的想法而建立的，这些作品完全与场景和信息无关。(是的，我在说你——Dribbble。)

与过去的设计师相比，我们的大部分作品，包括我自己在内，都相形见绌。我们不仅不能证明我们设计的目的，而且有时我们创造的设计根本没有目的——设计本身就是目的。

伟大的设计应该是永恒的。有哪个网页设计师可以指着一个项目，声称它像埃姆斯的椅子一样永恒?我知道这种比较有点不公平，但我确实认为它揭示了一些关于设计文化的东西。

设计变得更像是一种身份象征或奢侈品;如果你有一个好的设计，你就是合法的。高质量的设计只会过滤掉那些想要成功的企业。

作为设计师，我们的工作是在所有的噪音中定位客户——一个优秀的设计将使一个品牌脱颖而出。

但我们担心的假设是，一个漂亮的设计并没有产生任何的影响，没有创造想象中的价值。

如果我们设计师真的只是通过创造表面上的美观的作品来增加“噪音”呢?

如果有比美学更好的服务客户的方法呢?

我想我找到了一个方法:通过写作。

写作如何使我成为一名更好地设计师？

过去几年我一直在经营自己的产品生意。在那段时间里，我不得不学会自己做所有的事情。

最大的挑战来自写作。

为了维持我的生意，我不得不写各种各样的东西:每周的时事通讯、博客文章和登录页面。即使是跟上社交媒体上的帖子——只是写推特——也会让人望而生畏。这可能听起来很傻，但这只是我要写的另一件事。我甚至还写了一本电子书。

尽管写作占据的时间比我预想的要多，我还是坚持下来了。回顾这几年的常规写作，我惊讶地发现自己对待设计的方式与过去完全不同。

几年前，我倾向于对美学概念或特性感到兴奋。当我开始设计的时候，最激动人心的部分是把用户和一个伟大的想法联系起来。

当然，我们已经一遍又一遍地听到这些陈词滥调:内容为王，设计应该为内容服务，关注用户等等。

但是在所有这些练习写作之后，有些东西是不同的。就好像我已经不是设计师了。在这个改变之后，设计只是一个帮助我传达信息的工具。它是在过程中产生的产物，而不是目标。

当我翻阅卢巴林的书时，我发现他的设计中有一条共同的主线。每一次，他显然都在思考如何沟通。他对目标读者有一个清晰的概念，并利用这些知识来设计巧妙的线索来增强读者的理解。

现在，我远不如卢巴林熟练。但令我感到鼓舞的是，我的工作中最近发生的变化可以反映他的推理。不久前，萨沙·格里夫(Sacha Grief)写了一篇关于我的着陆页的文章。我认为他写我的设计的唯一原因是其中设计与文字的处理很和谐。最近，《不可思议的文案黑客》(the incredible CopyHackers)一书的作者乔安娜·威比(Joanna Wiebe)在twitter上评论了我的文案工作。即使我自己都没有意识到，我的工作也一定是已经有所改进，才会得到这样的评价。

不知何故，我的设计更好，因为我能写。我的写作比较好，因为我会设计。

我不是在吹牛。我只是觉得这很令人兴奋。如果我们能够超越设计用来装饰的范畴，那么设计界能为我们的客户和文化做些什么呢?

下一次，当你想要提升你的设计技能时，尝试一些不同的东西，并致力于写作。

也许你会成为下一个卢巴林（字体设计大师）。 

02如何开始你的设计

新人设计师很害怕空白的屏幕。你要怎么用设计填满它?你应该如何开始?

不知什么原因，空白的屏幕工作区会给人带来恐惧。为什么?因为它控制着我们，因为我们没有可靠的方法来开始设计。

治疗这种恐惧的方法是过程。

现在，设计师们经常谈论设计流程，你可能已经见过有些设计师使用漂亮的图表来解释他们的设计过程。每一个都是不同的。怎么会这样呢?更糟糕的是，这些图表非常复杂。一个人怎么能内化这么多步骤，并本能地跟随它们呢?

我有好消息告诉你:你被骗了。没有一个优秀的设计师是通过遵循几十个线性步骤来完成工作的。正确的设计过程是简单的，它不会试图取代批判性思维。设计过程并不意味着代替你思考;而是为了帮助你清晰地思考，并决定什么值得你关注。真正思考去解决问题的还是你自身，设计流程只是辅助工具。

每一个创作过程都可以被分解成几个简单的阶段。但是，理解下面这一点很关键——这些阶段不是线性的。在进行设计时，您需要在这些阶段之间来回跳转（设计思维的五个阶段）。每个设计项目也会有所不同。您将为每个项目使用不同的阶段。但最重要的是，你要理解每个阶段是如何帮助你解决问题并想出新点子的。 

1.收集

找到开始设计所需的所有元素，包括内容、技术要求、目标和示例。

2. 编辑和草图

修改你的内容，并开始粗略的草图绘制，以帮助可视化你如何组织内容和实现目标。你的草图应该又快又丑。尽快想出尽可能多的点子，但不要决定任何事情。

3.原型

在Photoshop、Sketch或HTML/CSS中，把你最喜欢的草图变成现实。模拟应该揭示草图是如何工作的，以及每个特性是否都能实现其目的。

4. 构建

将设计构建为功能完整的应用程序。忠实于你计划的解决方案。

5. 测试和正确方案

使用数据和度量来评估设计。当您发现问题时(即使是最有经验的设计师也会这样做)，请回到前面的步骤，探索这些问题的更小的解决方案。 

现在，当你看着空白的屏幕时，你知道你甚至还不能继续下去，因为在你使用电脑作图之前还有很多事情要做。空白屏幕让人害怕的唯一原因是你不知道该做什么。而过程消除了这些恐惧，并使你能够将问题分解成更小的部分，而不是试图立即理解并解决整个问题。

03你是否被卡住了？

前一篇文章解释了设计流程如何使您在每个项目开始时面对的空白屏幕变得不那么吓人。但有时，即使跟随设计过程，你仍然会被卡住。当你陷入困境时，通常意味着你走错了一步。换一个步骤，评估你的选择。

以下是一些例子:

你正在努力（很费力）设计一个界面。

这通常意味着您没有足够的信息来了解它应该如何工作，它需要完成什么，或者它如何适应应用程序的其余部分。回去收集信息。（例如你在进行产品redesign时直接设计界面，而没有提前考虑功能规格和内容）

在为某个功能进行原型设计时，您会不断地考虑要添加到页面中的其他功能，并因此而分心。

你没有画足够的草图。回顾并勾画出所有这些小功能，并确保它们与产品契合，值得进行原型设计。

在构建页面时，您意识到如果服务器端代码不进行重大的、推迟截止日期的更改，就无法支持设计。

当这种情况发生时，这意味着收集、草图和/或原型设计还不够。在继续构建之前，研究一下软件的这方面，然后草拟并模拟几个不同的解决方案，看看能否找到一个不会对服务器端代码造成巨大影响的解决方案。

您已经完成了产品设计并准备进行测试，但是您不知道应该测试什么。

在收集阶段，您没有考虑项目的目标。现在，您不确定如何度量项目是否满足这些目标。这是很危险的!确保你每次开始一个新项目时都要考虑目标。

…

总而言之，流程是你摆脱常规的方法。如果您不确定要做什么，请考虑设计流程。退一步，试着找出阻碍你前进的那部分。有时候，你的直觉只会让问题变得更糟——这时，设计流程就会支持你。 

04.如何停止凭猜测做设计

当你尝试设计的时候，你有没有觉得你是在胡乱编造?

例如，您正在尝试以前从未使用过的UI元素。你甚至不确定他们是否会有用——这只是你的猜测。你觉得听起来是个好主意。但是你怎么知道这么做是一个好主意还是浪费时间呢?

设计就像任何其他类型的工作:每次你冒险进入一个新的领域，你都冒着陷入困境的风险。当遇到问题时，自然的反应是硬着头皮继续工作，直到你解决它。不知怎么过了一个星期，你发现原来还有一个更简单的解决方案。此时你会后悔没有在一开始想到这一步。

当你还是一个新手的时候，这种情况时有发生。下面有一些技巧来避免这个陷阱。

成为一名“小偷”

困扰你的这个设计问题并不新鲜。以前有人解决过这个问题，他们可能比你更有经验。所以，在你尝试重新发明轮子之前，环顾四周，看看其他设计师是如何解决你的问题的。

看看你经常在类似情况下使用的软件。打开他们，看看界面是什么样的。

一旦你发现其他人是如何解决这个棘手的问题的，那就复制他们。偷他们的解决方案。

这就是设计师经常提到的“寻找灵感”、“设计惯例”和“最佳实践”。这些都是拷贝的委婉用语。

所以当我称这种行为为偷窃时，我真正想说的是你应该从别人的经验中学习。这是解决最具挑战性的设计问题的最佳方法。

(需要说明的是，我并不是建议你侵犯别人的权利，违反法律，或者获取知识产权。不要抄袭别人的整个设计，只要解决你的挑战的一个方面。从问题层面获取灵感，而不是彻底的抄袭）

从草图开始设计会使你节省很多时间

草图如此方便。要找到并测试大量的想法，没有比草图更好的方法了。

当然，你可以在Illustrator、sketch或其他任何地方画一个线框。你可以在代码中构建一个原型，甚至在Photoshop中创建一个完整的模型。但这些都不如草图（纸笔绘制）来得快。

你画的草图越多，你的效率越高。你探索的概念。你的第一个想法很少是正确的。为了找到最佳解决方案，您需要探索许多概念。如果你通过制作一个原型或模型来尝试这些方法，你将会花费大量的时间。

新手设计师通常想要跳过草图。他们想要进入令人兴奋的部分——真正的设计。他们想要建造一些东西。但是，草图很重要，因为它们可以防止您过早地提交解决方案。如果你在确定这个概念是否正确之前，就急于创建一个完善、详细的版本，那是有风险的。最好花15分钟绘制草图，以确保时间不会被浪费在推翻匆忙的设计上。

你可能认为你并不适合绘制草图，除非你有一些绘画技巧。许多设计师的草图看起来像艺术品，但你的不应该。你的草图应该是快速和简陋的。这些草图的唯一目的是快速探索想法。你的草图越漂亮，你浪费的时间就越多。让他们变丑吧。你不需要给别人看。

哦，只要用笔和纸就可以了。不要试图用iPad应用程序或其他软件搞花哨。记住，这一切都是为了尽可能快地排除干扰去探索想法。

当你做了一个假设，测试它

不可避免地，有时你会找不到一个完美的解决方案，通常是因为你没有足够的信息来辅助你进行决策。正因为如此，你将不得不编造一些东西。

太多的设计师止步于此。他们提出了那个假设，然后就再也不想了。

作为设计师，很容易认为我们的假设是正确的。我们习惯于做假设，因为我们认为设计并不总是要那么精确。

然而，当你的假设可能有重大意义时，一定要验证它。真实的数据总是比猜测的要好。实施A/B测试或简其他单的分析方法，看看人们如何在实际场景中使用它。

然后，启动它并观察发生了什么。但是要把草图放在手边。您可能会发现您需要尝试您的其他概念之一。

谨记:如果你在猜测某个设计，你需要一些信息来帮助决策

尽你所能避免纯粹的猜测。查看其他产品、绘制草图或者使用其他提供准确答案的工具。如果您必须进行猜测，那么就进行测试，并随时准备根据结果切换到备选解决方案。 

05如何在复杂的web字体中进行选择

Web字体已经成为Web和数字设计师工具箱中的主要内容。但是，随着web字体的普及，字体市场变得越来越难以驾驭。像Typewolf、Fonts in Use,等字体资源网站是有帮助的，但是我们的行业更倾向把排版当作一种时尚选择。这里有一些关于选择web字体的更实际的问题。

选择基于预期用途的字体

您应该始终评估字体的两种用途:

（Display font）显示字体应用于大字体，如标题和标志的内容。可以使用更具装饰性或外观更复杂的字体进行显示设置，因为字体更大。标题是为了吸引注意力，所以使用更具装饰性的字体是个好主意。

（Text font）文本字体适用于段落和较长的内容部分。在这里，您希望避免装饰性字体，因为较小的字体更难于阅读。

如果您知道该字体应用于显示字体还是文本字体，那么在字体库中寻找字体就很容易了。

忽略没有足够样式的字体

要过滤出哪些拥有更多样式的字体，请查看每个字体族的可用权重和样式。如果您正在为文本设置寻找字体，请确保它至少包含正常的粗体、粗体、斜体和粗体斜体。

如果文本字体甚至都不包含这些基础样式，那么在web环境下就会遇到问题。有时，当web浏览器没有用于粗体斜体文本段落的字体时，它会使用默认字体，这会使您的设计看起来很糟糕。更糟糕的是，我甚至看到浏览器将这些段落替换为混乱的文本—就好像这部分文本映射到错误的字符一样。

但是，用于标题场景的字体，您可以更随意地选择。例如，如果你设置的标题字体不包含正常的粗细或斜体，也没关系。它是一个标题，所以你需要的只是一个粗体的重量。

跨浏览器检查显示效果

在决定使用哪种web字体之前，请确保在计划支持的所有浏览器中都对其进行了测试。因为显示时可能会遇到问题，有些字体可能有不合适的提示或字距，只出现在某些浏览器中。这些问题甚至会使大型显示文本变得不可读。

不要假设所有的字体都是一样的。即使是昂贵的。字体是软件，和其他软件一样会遇到同样的问题。

注意别人如何使用字体，并模仿他们

字体种类繁多，选择字体会让人感到困惑。在不太了解排版的情况下选择字体是相当困难的。

为了使这更容易，看看由经验丰富的设计师创建的网站。注意他们如何在不同的地方使用字体，然后找到相似的字体在你自己的设计中以相似的方式使用。

使用流行的字体没有任何问题。它们受欢迎是有原因的。而且，使用流行字体比试图自己发明字体要简单得多。 

05设计师需要学习编码吗？

设计师应该学习敲代码吗？你必须用PS或者html其中之一进行设计吗？这些问题都是胡扯。

“大师们倾向于采取坚定的立场来确立自己的观点，但这可能会分散我们这些象牙塔外的人的注意力。”

这种教条主义的辩论不能帮助我们把事情做好。

知道有些设计人员在使用代码进行设计时效率更高是很好的，从这些天才设计师的经验中学习是一件好事，但也存在一个问题:它仅仅适用于他们，并不意味着它也适用于你。

正确的问题是:哪些工具可以帮助您提高效率?那些建议你不应该使用Photoshop或者每个设计都应该学代码的人只是想帮助你更有效率。他们分享他们的经验来帮助你。而你需要关注的是是否能够帮你自己提高效率。

在阅读这条建议时，请记住我们每个人都有不同的知识和经验。我们每个人都有不同的优势，并将找到不同的工具来匹配这些优势。

这似乎是显而易见的，但是我们还是很容易受大师的建议影响甚至主导。你必须成为过滤器，因为没有人了解你的情况。所以，当你听到这样的建议时，不要因为尊重对方而马上表示同意，而是要想:“好吧，他们是在建议换一种工作方式可能会更有效率。”这是真的吗?”

人们通过寻找成功的途径而成为大师，但是成功的途径有很多。设计一个项目有很多方法。你必须找到你的路。如果你盲目地听从名人的建议，你最终会得到一堆互不相容甚至相互矛盾的建议。

所以，如果Photoshop能让你在设计项目时更有效率，那就用它吧。如果你可以在HTML和CSS中更有效地模拟你的设计概念，那么就这样做吧。选择最适合你的工具，而不是某个站在讲台上的人。

在任何你能得到建议的地方寻求建议，并且意识到他们的意图是好的，但是人们有时会变得有点过于热心，很多建议并不适合你。 

06知识VS技能

一个人如何成为一名优秀的设计师？通过努力学习知识还是努力锻炼技能？

你认为两者都是。很抱歉，你错了。这是为什么。

成为一名优秀的设计师所需要的知识是微乎其微的。事实上，你可以很容易地成为一名伟大的设计师，在没有任何正规训练或设计理论知识的情况下，做出富有洞察力的、有效的工作。许多受人尊敬的设计师对各种设计主题一无所知，但他们仍然能做出伟大的作品。

这是因为设计师是传播者

设计师的存在不仅仅是为了制作漂亮的图片，或者将他们所接触到的一切与时尚相融合。设计师的工作是使沟通更有效。这种交流可以采取多种形式:例如，人与计算机之间的交互、公司与消费者之间的交流、软件与用户之间的交流。

当然，这并不是说设计知识毫无价值。知识将帮助有技能的人做出明智的决定，从而提高工作质量。

然而，您可能已经注意到，阅读有关设计的书籍对您的设计尝试的质量并没有太大的影响。这是因为当涉及到设计时，技能比知识更重要。你还没有找到提高技能的方法。

为什么这一切对你很重要?

这很重要，因为如果设计是一种技能而不是一种知识，那么成为一名更好的设计师也会更加困难。

这就是为什么设计是如此具有挑战性，尤其是在你职业生涯的早期。设计不是你随手从架子上拿下来就能插进去的东西。这也不是你可以读到然后第二天实施的东西（技能和知识差别很大）。伟大的设计是没有可量化的界限的:相反，糟糕和不可思议之间有巨大的差距，而技能是决定因素。

如果你还在学习，你应该怎么做?不要气馁。每当你做一次设计练习，你都会提高一点水平。每一个新的设计都会少一些糟糕，多一些不可思议。

做更好的设计没有捷径。持续练习。

07打破网格

你知道什么是网格，也知道为什么使用它。然而网格也是导致错误原因之一。

有时，即使您忠实地使用网格，布局看起来仍然不正确。一栏一栏的文字挤得很紧，很难阅读。其他元素可能聚得太远，破坏了接近的效果。

这是因为你不知道什么时候打破网格。

现在，一些设计师不同意打破网格的前提是因为对他们来说，网格是一种不可忽视的规则。

但我要说，网格是为你服务的，而不是反过来。所以，如果它妨碍了你，那就打破它。(或者切换到另一个网格。)

有时，您有一个维度无法更改的元素，但它不适合网格。此时你需要打破网格。

当你打破网格，没有人会注意到。即使他们注意到了，他们也会这样想:“这个设计师打破了常规，但设计看起来还是很不错，所以他们知道自己在做什么。”

伟大的设计师有时会打破他们的网格。其他时候，他们完全放弃了网格。作为一名设计师并不意味着要带着宗教般的热情坚持一种既定的工作方式。设计是关于批判性思维的。如果一个工具不适合这项工作，把它放回工具箱。

08打破设计原则

经营自己的生意让我重新学习设计的某些内容。我需要做很多设计决策。

我做了很多按照常规设计原则来讲不被允许的事情。比如把商标放在下方。或者故意使用与调色板其余部分不匹配的颜色，但这能帮我推动商业的成功。

当你的生计依赖于设计成功地推动产品销售时，你开始以不同地视角看待设计。我个人发现自己会对我的设计做出改变来支持我的商业目标，即使我不喜欢之后的设计。

把商标放在页面的下方

设计师敬畏约定规则。把标志放在网站的左上角应该是一个重要的惯例。

但对于像我这样的小企业来说，这可能是一个错误的决定。

把标志放在左上角是错误的，因为它表明了网站的运营者或公司是页面上最重要的信息。它暗示:“嘿，访客，在你阅读之前，你应该知道我是谁。”我是个大人物。”

如果你的客户数以百计，品牌意识就不存在了。为小企业设计与为大品牌(或想要变大的品牌)设计是完全不同的。

访问者不关心你的标志，他们甚至不关心你是谁(到目前为止)。他们在寻找两个问题的答案:它解决了什么问题?我有这个问题吗?

所以，我试着把我的一个产品的logo放在页面的视觉层次下面。这两个重要问题的答案就在logo的上方。甚至看到标识的人都是那些发现了问题的人和目标受众。没有立即离开页面的人。这很好，因为在这一页的其余部分，我知道我服务的用户是谁。

所以不要再觉得一定要把logo放置在左上角。相反，你要写的是你的公司打算解决的问题。写一下什么样的人会有这样的问题。然后，在页面下方，解释你的业务是如何解决问题 的，并让他们购买。把商标也放在那里。

作为一个设计师和作家，你的工作就是向访问者展示他们的问题，并说服他们继续阅读你的解决方案。如果你成功了，人们会付你钱的。

试试“难看”的按钮

(我敢打赌你从没想过你会看到设计师这么写!)

同一款产品的登陆页面上也出现了一个亮点——绿色按钮。这个按钮本身并不丑。但是，在构图中占主导地位的强烈的橙色中，它紧紧地扣在一起——很不协调。而且，它是故意冲突的。

我选择了明亮的，冲突的绿色按钮，因为我想让游客看到它。最初，网站的配色方案包括一个常见的蓝色。在评估设计时，我意识到这是一个问题。按钮与页面上的其他元素具有相似的视觉重心，这并不符合我的视觉层次结构目标。

我的计划是把按钮放在页面的下方。毕竟，在我解释他们想要注册的原因之前，没有人会注册。但是，当访问者滚动到按钮可见的位置时，我希望它是屏幕上最明显的元素。

一个漂亮的蓝色按钮，和整体的视觉风格搭配起来很协调，但并不能实现我的目标。因此，我从设计中去掉了蓝色，并为按钮选择了一个冲突的绿色。然后，当有人滚动到足够远的地方看到一个按钮时，不可能错过它。按钮的丑陋美学完美地支持了我的目标。

有了这个改变，我做了一个清醒的决定:我的商业目标比使设计更具吸引力更重要。我不在乎赢得设计大奖。其他设计师是否喜欢这个页面并不重要。反正也不是为了他们。重要的是这个页面与我的特定受众相联系。

此外，我使用了数据分析，而不仅仅是假设我达到了目标。每一个指标都表明我的设计是成功的。

打破规则是有必要的

我并不是试图说服你总是把logo放在下方，或者总是使用一个丑陋的按钮。但我希望这些例子能给你信心，当你发现有必要打破最佳实践。

为你将效率置于虚荣心之上而感到自豪。做这样的决定是经营企业的正确方式，你的客户会感激你的。他们会通过给你更多钱来表达感激之情。

此外，如果你的决定有助于你为设计客户提供更好的结果，他们会重新雇用你，并把其他人介绍给你。

使用设计来获得结果，而不仅仅是美学。

第一部分到这就翻译完毕了，后面的几部分会慢慢上传，保持关注哦。

Powered by Froala Editor