您可能对格式、对象属性、组合原则和网格有很多了解，但仍然对如何开始感到困惑。设计工作流程可以在这里拯救您！
设计工作流程是一个非线性的多方面过程，涉及与团队成员的合作、用户研究实践、生产、测试、提炼、放弃数十个想法、草图、线框图和其他基本活动。有时，您甚至可能成为项目中唯一一个能够处理如此庞大任务范围的设计师。不过，不要惊慌。
看看这个 10 步指南并从中汲取一些灵感，该指南总结了引导设计师从最初构想到实现的最突出的活动。
第 1 步：研究和构思
任何产品的第一阶段都是沟通。与您的客户进行讨论以进行构思——激发大脑思考并定义您将实施的产品。获取利益相关者提供的所有信息，包括营销研究及其业务目标。如果这还不够，或者您有时间和资源，请进行自己的用户研究。在用户访谈、调查、竞品概览等期间收集的数据将帮助您获得洞察力并将信息组织成解决方案的图表或地图。
第 2 步：开始画草图
所有的想法都从纸上开始——确保手边有一支笔来形象化你的想法。不要考虑颜色、排版、媒体或功能。草图不应该专注于细节。相反，他们专注于大局——这是未来的骨架。不要执着于你在草图上的想法。相反，使用它们来引发讨论、交流并找到最佳解决方案。
来得容易去得也快。创建快速而廉价的草图以获得即时反馈、测试想法、抛弃它们并重复。
第 3 步：将草图数字化
好的，现在是时候让你的双手干净了——让我们放下笔拿起电脑吧！现在是开始整合数字可视化的时候了。不会被花哨的颜色、整洁的字体和实际内容分散注意力，将您的草图移动到屏幕上，专注于整体构图。您可以参考您的草图，但如果您发现某些元素在屏幕上看起来不明显，请不要害怕调整构图。此时，您需要专注于用户旅程并将用户从 A 点带到 B 点。
我们建议创建一个包含 6 种灰色调的调色板，以帮助加快您的模型工作流程
第 4 步：应用网格
现在，有了您的准系统模型，您可以定义网格。此时仔细考虑您的网格至关重要，因为它将有助于进一步加快您的工作流程。根据内容，您可以使用更传统的比例列网格，或者为内容繁重的网站选择模块化网格。您还可以玩弄不对称以获得更有趣、意想不到的布局。
更多的列意味着更多的复杂性。如果您努力寻求简单的解决方案，请坚持使用更简单的网格。
第 5 步：构建线框
线框是您未来产品的简化版本。它的详细程度和交互性取决于您，但请记住，我们会创建线框图来测试想法和见解。您可以使用一些基本的拖放软件来绘制布局 - Balsamiq 甚至 PowerPoint 或 Keynote 都可以达到目的。
保持简单和信息丰富，逐渐用实际或或多或少真实的内容替换占位符和虚拟文本。在确定最终版本之前起草、替换和修复。
第 6 步：添加排版
一旦您完成了几轮线框测试并收到了一些有价值的反馈，就该完善线框了。
在这个阶段，您可以开始考虑产品的美学。视觉设计的组成部分之一是排版。
我们知道您在谈到这个主题时会感到头晕目眩——有很多选择！还有很多方面需要考虑。开始选择具有正确情绪和意图的清晰字体，以适合您的品牌标识和网站主题。坚持使用多种尺寸并包含粗体、斜体和小型大写字母的字体变化。
随意选择一种以上的字体！一个用于标题，另一个用于正文。
第 7 步：添加视觉效果
一旦排版准备就绪，就该微调视觉效果了。作为人类，我们寻求秩序和一致性。这就是为什么你的第一步应该是建立一个结构良好的风格指南——一个包含所有品牌和视觉风格规则的文档。
风格指南通常包含哪些内容？通常，它由品牌指南（徽标使用、排版、调色板、品牌原则）和描述基本 UI 组件（包括颜色、字体和页面布局）的模式库组成。该工具可确保设计一致性和开发人员顺利交接。
第 8 步：添加微交互
微交互的成功使用不仅可以增强用户体验，还可以帮助用户实现目标。
微交互让用户知道系统中发生了什么并提供反馈，通常可以帮助他们防止错误。简而言之，用户应该清楚地看到他们可以点击、点击或滑动的内容，并查看对他们操作的响应。示例包括下拉刷新动画或错误数据输入的验证消息。
在工具的帮助下，您可以在设计中添加简单的微交互，并可视化用户将如何与您的产品进行交互。
微交互显着增强了一般用户体验和品牌个性。
第 9 步：验证一致性
嗯，恭喜！您已经成功设计了您的第一页。现在，是时候在所有其他页面上重现您的设计语言了——始终如一。风格指南是您唯一的事实来源。一方面，它使系统对用户来说更加熟悉和容易学习。另一方面，它可以帮助您和其他设计师坚持使用正确的颜色、字体、大小和其他属性，以保持一致的外观。毕竟，一致性是关键，它确保了可预测性和凝聚力的用户体验。
第10 步：使其具有响应性
用户仅通过一台设备访问您的网站的日子已经一去不复返了。如今，用户甚至在多个设备之间跳转以完成一项任务。作为设计师——不用等待，作为产品人员——我们应该认真对待响应式设计。最初，它需要很多时间，但是一旦你建立了规则和断点，执行就会像黄油一样顺利。
在设计网站时，至少要针对 3 种类型的屏幕：台式机、移动设备和平板电脑。始终考虑产品的内容和目标受众的设备偏好。
不要忘记为移动屏幕调整网格——它们的空间有限，需要不同的方法。
本文内容为转载
网友评论