在过去的四年中，我一直在设计仪表板和应用程序，并且我学会了如何与不同部门打交道，并利用他们的知识来提高产品设计的效率。
今天，我将分享我日常工作中的所有步骤，相信这些步骤使我成为一名更好的设计师。
前处理
1.获得尽可能多的信息（询问三个示例）
对我而言，没有什么比看到一个实际的工作示例更清楚了。当我与新客户一起工作时，或在产品的全新登录页面上时，我发现最简单的起点就是要求客户提供三到四个鼓舞人心的页面，因为这确实对双方都有帮助。让您的客户将创意付诸实践，使您有机会轻松地了解他们的喜好以及对最终设计的期望。
如果您与多个团队合作，那么您应该致力于与产品开发人员一起度过与您的设计师同事一样多的时间。我了解到，做出有效的设计决策的关键是确保您与开发团队保持尽可能多的交流。就我而言，在某些情况下，我找到了解决问题的方法，我自己无法解决。
目的是在进行开发之前消除尽可能多的问题。
2.了解角色
首先，我必须说我对角色表示怀疑，但是现在这对我来说很有意义。
因此，与我以前的过程完全相反，我可以看到角色在处理产品功能时是多么重要，尤其是在解决方案有许多不同的情况时。它可以帮助您了解您真正为谁设计的。我的目标是拥有大约四到五个角色。
3.设定确切的目标-我们应该精确追踪什么？
我认为大多数设计师/客户都忽略了这一步骤，但是对于双方来说，设计最重要的方面之一就是了解您正在设计的产品的目标。我们倾向于直接跳入像素并迅速充实项目的UI。如果是全新的网站或新功能，请确保为您首先要实现的目标设定明确的目标。
由于所有内容都是可追踪的，因此请说说您要追踪的确切点。例如，这些范围可能从新注册到使用Paypal的许多客户与使用信用卡购买的客户不等。始终确保您知道一开始的目标！
（无论如何，您稍后都需要在Mixpanel上设置渠道。）
4.设置项目文件夹并开始构建情绪板
有很多启发网站 -Dribbble，Behance，Pttrns 等。找到与您正在从事的项目相似的项目真的很容易。此外，可能已经有解决您遇到的问题并试图解决的问题。
当我开始一个新项目时，我总是设置一个文件夹，该文件夹名为- 源文件，屏幕和导出，灵感和资源。我将在互联网上找到的所有内容保存到Inspiration文件夹中，以便以后使用它来创建基本的情绪板。该文件夹中可能包含来自插件，色板甚至来自Behance的完整案例研究的所有内容。
低保真
5.白板
如果我们要添加新功能或重新设计流程，我们坐下来，每个人都可以在白板，纸甚至iPad上草拟想法。此操作使我们可以将团队中的每个人都置于设计师的位置。稍后，我们将给出两个设计选项，以查看哪一个效果最佳。
在此过程的这一部分中，我们始终尝试通过整个体验并讨论大多数边缘情况。与设计阶段甚至开发阶段相比，现在解决这些问题确实至关重要。那时候您可能会浪费很多时间和精力。
6.映射出所有屏幕（用户需要输入哪些数据）
现在是超越白板并列出用户所有输入和故事的时候了。写下用户应确切插入特定屏幕的内容以及用户如何实现其期望的目标。
7.写下所有可能的状态
由于所有仪表板，应用程序或网站的表单都具有不同的状态，因此这是您不应该忘记的另一个重要步骤。
在设计时，我们需要确保解决所有这些问题。在我们的Sketch文件或PSD中拥有闪亮的图形和炫酷的个人资料图片非常好。但是，用户很可能会看到应用程序的另一面。尤其是当它们出现在您的产品上时。有必要做准备。以下是我们如何处理其中一个数据组件中的空状态的示例。
8.准备第一个图
所有这些导致低保真度的最后部分。由于有了白板任务的结果，我们现在知道了所有可能的状态，用户的输入和目标。总结所有交互，我创建了一个图，说实话，我已经多次更改了此操作的样式：从具有光栅化版式的Sketch文件变为仅用矩形表示每个页面的矩形，其名称如下。话虽如此，这个过程总是很痛苦，我通常会遇到一种情况，我们想在此过程中稍后进行更改或添加一些内容。使用这些解决方案，我通常不得不执行更多步骤。例如更改线条，箭头和图像的位置。
最近，我一直在使用Camunda Modeler，这并不是一个精确的设计工具。这是一个用于创建技术图表的简单应用程序。听起来很奇怪，但此应用程序旨在帮助您构建基本图表。最重要的是，创建的所有内容都是完全可伸缩的。您可以轻松地拖放任何点，它将自动为您创建线条和箭头。您还可以从不同类型的要点中进行选择，这有助于突出显示例如用户收到对讲机的电子邮件时的信息。Camunda导出到SVG，从而可以轻松为Sketch中的可跟踪点着色。
工作/设计
9.滑板
当我将所有图像收集到Inspiration文件夹中时，便可以开始创建情绪板。在开始像素处理之前，我主要使用情绪板来与同事讨论我的想法并描述一些视觉想法。
10.初稿
设计始终是一个持续的过程。您将在整个过程中进行很多迭代，以取得理想的结果。初稿也是收集反馈的一种方式。您不必进行像素完美的设计即可开始接收来自队友，客户或潜在用户的反馈。为了获得他们的第一个想法并开始讨论，我通常会混合使用我们当前设计的屏幕。这使我们可以在不到一天的时间内开始使用外观逼真的设计。您可以制作第一个简单的原型来测试事物是否可以很好地连接在一起。
11.写你的副本
复制是用户决策的关键方面之一，我将其视为设计的关键部分。没有一个令人迷惑的对话框，用户在努力寻找下一步，这是一个不错的设计。
12.第一次实习测试
通过初稿，您可以在Marvel或Invision中快速创建原型。这是我最近开始做的事情，事实证明这是另一个令人惊奇的验证方面。使用原型，您现在可以轻松地与团队中的3或4个人建立呼叫，并与他们共享原型链接，并在测试特定流程/场景时尝试提出一些问题。
这样，您可以轻松地测试您的提问技巧，并且显然可以在真实用户上测试您的设计决策，而不必担心浪费资源和时间。我倾向于选择不参与仪表板开发的人员。另外，还要避免避免看到以前已经有机会玩过原型的人。
13.礼节
我们都知道保持整洁有多么困难。如何提供另一个功能。这通常会导致草图或PSD文件混乱。我已经学到了很多关于在初创公司中担任单一设计师，在团队中工作或开发自己的数字产品之间的区别的知识。
当您在团队中工作时，请考虑一下您的PSD，就像您正在为其他人创建它们一样。我使用的规则是，如果一个文件夹中的层数超过8，则应创建一个新层。
我找到了一个很棒的Sketch插件，为我的UI套件工作节省了时间：重命名。
提示：将所有内容放在画布上。我一直在努力设计漂亮的标题，而其余的画布是白色的。在设计时，我学会了将所有内容放在第一位-只是玩布局和版式。设计精美的细节并在适当位置使用整个概念要容易得多。
14.创建UI元素并开始使用LEGO
我可能参加聚会很晚，而在撰写本文时，这听起来已经过时了。我们在此过程中未进行任何线框图的原因很简单。我发现Sketch 39带有令人难以置信的东西，那就是“具有调整大小属性的形状”。这使团队中的每个人都可以轻松进行设计。现在，我们的Sketch文件是纯拖放文件。您可以轻松地给任何队友一张空白的画布，他们可以创建几乎高保真的草稿。因此，我们能够跳过所有线框图工具，并以几乎真实的像素开始。
这与我们能够将线框实际转换为实际设计紧密结合。任何PM都可以创建线框，然后我可以轻松地将其接管并转换为高保真度。
资产与交付
当您完成基于第一反馈的设计和迭代时，您还没有完成。现在是时候将您的设计移交给工程师/开发人员了。
15.规格
我的主要目标之一是始终能够与团队沟通我的决定，并能够尽我所能减少开发人员的困难，以便为他们提供最佳的资源。对我来说，这绝对是我从事设计师工作中最重要的部分。
由于我们记录了所有交互并从流程开始就准备好了所有内容，因此创建规格很容易。我倾向于在Google文档中或在Sketch文件的屏幕下方编写规范。最好在解释所有功能的同时处理您的设计，以便将来任何人都可以抓取您的文件。
16.图
该技术非常适合打印设计并与团队讨论。但是如今，我认为有更好的选择。比如准备好最终的原型。
17.最终原型
对我来说，关键的事情之一是始终在原型中准备好所有交互。在与队友进行的小型会议或展示一些特殊流程的过程中，我通常会在最终决赛的过程中拥有3-5个原型。我倾向于在一个画板上准备Sketch中的所有状态，然后复制这些画板以在导出时准备好每个状态。
最好在设计的各个部分中添加注释，以进一步扩展规范，以便每个文案和对话框都能按要求工作，即使是文案撰稿人也可以轻松地检查真实像素和流。
18. QUICKTIME视频>注释
当我不在环聊上向团队或客户展示内容时，我会发送一个截屏视频，介绍我如何浏览原型并解释我所设计的一切。对于任何演讲之前的我来说，这都是对我的一个很好的确认，我知道我决定设计的任何问题的答案以及可能的奇特互动。在远程团队中工作时，也可以很好地使用它。每个人都可以随时重播整个交互思维。
19.动画
可以使用After Effects或Principle作为最后的效果。很好地解释您希望如何移动。
20.风格指南
工程师的另一个关键点是要了解事物在不同情况下的反应。考虑输入的错误状态或显示错误消息的位置。同样，提交按钮的禁用状态将如何显示，放置微调框的位置等。
网站设计制作Lego块的Sketch文件，因此工程师甚至可以开始对所有屏幕进行编码之前，工程师一一遍历您的Symbols画板和样式元素非常容易。
