针对开发人员的设计工作流程教程(按时交付更好的UI/UX)

本文概述

  • 你有需要的一切吗?
  • 工作正在进行中
  • UI / UX设计项目管理
  • UX设计与开发融合在一起
  • 反馈回路
  • 总结
编者注:Lubos Volkov是一位经验丰富的设计师, 在他的整个职业生涯中与许多开发人员进行了远程合作。作为srcmini的产品设计师, Lubos每天与来自各个部门的团队成员进行互动, 包括工程, 社区和内容。他是一位才华横溢的设计师, 他的沟通技巧为他的成功做出了贡献。在本教程中, Lubos分享了他的经验和方法, 以优化设计人员-开发人员的UI和UX工作流, 从而在截止日期之前或之前交付了高质量的产品。
与优秀的设计师或设计团队合作对任何团队来说都是无价的资产。通过清晰的沟通渠道和自由合作, 设计师应为你提供所需的一切, 以加快构建过程并尽可能减少问题和混乱。
UX开发人员可以做些什么, 以确保在不牺牲用户界面质量和用户体验的前提下, 及时交付所构建的产品?
针对开发人员的设计工作流程教程(按时交付更好的UI/UX)

文章图片
我的回答:从一开始就让你的设计师参与其中, 并让他们参与整个UI / UX开发过程。确保在开发人员和设计人员之间建立清晰的通信线路和一致的消息传递。
你有需要的一切吗? 在实施任何UI时, 最糟糕的事情是__设计人员与开发人员之间缺乏沟通__(除非他们是同一个人)。一些设计师认为, 一旦PSD发送完毕, 他们的工作就完成了。但是, 那是错误的!你必须创建一个持续在线的通信工作流程, 该工作流程的持续时间要超出PSD的交付范围。
设计人员仅提交设计文件, 而开发人员仅实施设计文件的项目就是失败的项目。
在许多情况下, 设计人员必须花费一些时间才能看到实际的UI / UX设计实现。令他们惊讶的是, 该版本通常与最初提交的版本完全不同。 (这不止一次发生在我身上。我已经发送了带有完整描述和交互原型的源文件, 但是几个月后, 当我终于看到该项目时, 它具有不同的布局, 不同的颜色, 并且没有交互。)
一些设计师可能为此而讨厌我, 因为此设计工作流程需要很多” 额外” 工作。但是, 以有组织的方式创建和交付完整的资产和信息, 对于项目和整个团队来说都是更好的选择。
如果开发人员将所需的一切摆在面前, 那么它将加快流程。干净的PSD仅仅是不够的。
你需要什么才能有效, 高效地完成工作?
这些是开发人员应期望设计人员将UI / UX设计引入实现的资产:
  • 资源文件-设计人员应将应用程序的每个元素放在一个文件中。该文件应包含按钮, 复选框, 标题样式, 字体, 颜色等。基本上, 基于此文件中的信息, 开发人员应能够从头开始重新创建任何接口。对于开发人员而言, 从单个PSD导出任何元素要比在多个文件中搜索要容易得多。
  • 资产-确保开发人员获得所有必需的资产, 因为不应再触摸源文件。
  • 交互原型-“ 静态屏幕” 的日子已经过去了。现在, 使用智能交互和动画来平滑UX设计工作流和实现是一种常见的做法。但是, 你不能只向开发人员说” 这将从左侧滑入” 。设计人员应创建该交互的实际原型。原型应包括速度, 速度等信息, 设计人员应指定每个值。
  • 命名约定-请求文件命名结构以使事情井井有条。这将使你们俩都更容易浏览文件。 (没有人喜欢在后台文件夹中隐藏内容。)
  • HDPI资源-我们生活在” 困难时期” , 屏幕密度巨大。确保设计人员将提供所有必需分辨率的图像, 以便你的应用程序在任何地方都看起来清晰。注意:使用尽可能多的向量;对你有很大帮助(svg)。
如果你在实施过程中确实发现其他缺失, 请不要害怕; ping设计师并提出要求。永远不要跳过, 永远不要跳过!你是同一个团队的成员, 你的工作是提供尽可能最好的产品。如果设计师失败了, 你也会失败。
工作正在进行中 在UI / UX开发过程中利用你的设计师。不要把它们放在一边, 不要指望它们只是” 推动像素” 。设计师甚至在实施开始之前就已经发现了可能的创新。要利用此优势, 请将它们保持循环。向他们提供查看和测试进行中的工作的权限。我很清楚, 没有人喜欢分享未完成的项目。但是, 在构建的中间进行更改比在结束时进行更改容易得多。这样做可以节省你的时间并避免不必要的工作。一旦给设计师一个测试项目的机会, 请他编译问题和解决方案的清单, 并提出改进建议。
当开发人员的想法会改变应用程序的外观时该怎么办?与设计者讨论, 并且绝不允许开发人员在不咨询设计者的情况下修改设计。此设计工作流程将确保构建保持正常。出色的设计师会为屏幕上的每个元素提供原因。如果不了解单件产品的原因而将其取出, 可能会破坏产品的用户体验。
UI / UX设计项目管理 设计师认为开发人员可以在一天甚至一小时内将设计变为现实。但是, 与出色的设计一样, 出色的开发需要时间和精力。让你急切的设计师了解构建进度, 以免烦恼。使用外部项目管理软件来确保每个修订都得到考虑, 是一种确保你不会错过电子邮件对话或Skype对话中讨论的重要信息的好方法。老实说:有时候, 变更和活动直到发生时才传达出来。
无论使用哪种解决方案, 请确保选择整个团队都将采用并始终使用的一种工作流程。在我们的团队中, 我试图推动Basecamp, 因为那是我正在使用的, 但是我们的前端开发人员认为它的功能有限。他们已经在使用其他项目管理软件来跟踪错误, 进度等, 例如JIRA, GitHub, 甚至Evernote。我知道应该尽可能简化项目跟踪和管理, 因此我将UI设计工作流迁移到JIRA。我想确保他们了解我的工作流程和进度, 但是我不希望他们觉得设计是另一回事。
【针对开发人员的设计工作流程教程(按时交付更好的UI/UX)】以下是有关项目管理工具的一些建议:
  • Basecamp-跟踪与设计和开发相关的任务的进度, 并轻松地让你导出任务。它还具有一个简单的移动客户端。
  • JIRA-完全可定制的平台, 你可以在其中轻松设置不同区域的定制板。例如, 组织董事会来跟踪诸如后端, 前端, 设计等活动。我认为移动客户端有些薄弱, 但这对大型团队来说是一个很好的解决方案, 并且包含错??误跟踪功能。
  • 电子邮件-这非常适合建立对话或发送图像。但是, 如果你使用电子邮件获取反馈, 请小心。事情很容易迷路。
你也可以尝试Trello和其他项目管理软件, 但在我们行业中使用最广泛的是Basecamp和JIRA。同样, 最重要的是找到一个每个人都可以一致使用的项目管理系统, 否则这将是一个争论点。
UX设计与开发融合在一起 设计人员和开发人员是强大的组合。确保尽可能经常一起头脑风暴UI和UX。开发人员应该愿意帮助设计师构思想法, 而设计师至少应该对所使用的技术有基本的了解。
一起弄清楚设计工作流程。不要盲目地实施你的设计师创作的作品。积极主动, 并利用两种不同的观点, 创造出看起来美丽且具有出色用户体验的产品。设计师跳出框框思考, 看到疯狂的动画, 创意, 像素和按钮, 而开发人员看到技术, 减速带和限制。
针对开发人员的设计工作流程教程(按时交付更好的UI/UX)

文章图片
以我的经验, 每个设计师都对像素和有趣的概念感到疯狂。但是有时候, 设计师会想到一个主意, 但开发商却退缩说:” 一旦实施, 这将无法很好地工作。会有性能消耗问题” 。最近, 我希望实现背景模糊的模态窗口, 但是这种模糊导致加载时间很长。为解决此问题, 开发人员建议使用常规的全彩色覆盖层, 这样可以更快地加载并保留图像质量。设计师请注意:不要牺牲设计的用户体验。
反馈回路 设计师的反馈至关重要, 必须尽可能多地发生。这可能是你最耗时(最耗能)的事情。但是, 你需要采用它才能提供完美的结果。以下是有关如何使你的反馈完美的一些UX和UI设计工作提示。
  • 视觉化-反馈需要尽可能具体。使其准确的最佳方法是拍摄简单的屏幕截图, 并突出显示要修复的问题。如果你拥有当前实现的图片而不是外观, 那会更好。视觉交流将消除50%的问题。
  • 具有描述性-反馈应该准确。你不能只说” 向上移动此按钮” 。设计人员必须指定按钮应移动多少像素, 应使用哪种填充等。请始终提供问题的说明以及适当的解决方案。这将花费很多时间, 但是值得。
  • 要有耐心-请记住, 设计师和开发人员的关注点不同。如果开发人员不完全了解设计师的想法, 可能会导致混乱和错误的决定。在每种情况下, 双方都需要耐心并愿意帮助其他团队成员。有时候确实很艰难, 但这是每个设计师和开发人员都应该学习的一项软技能。
很明显, 这些东西需要组合在一起, 以使其成为合适的设计工作流程。但是, 实际上有什么工具可以帮助你提供反馈?
  • 电子邮件-我不怕说这仍然是提供反馈的最常用平台。如果你遵循几个简单的规则, 那么使用它完全没问题。
    • 首先, 使用单个电子邮件线程获取反馈。不要将每个调整都发送给主题不同的新电子邮件。
    • 其次, 创建修复程序列表。尝试坐下, 考虑一下你发现的所有调整或修复。
    • 最后, 不要一次发送大量清单。尝试将其分解为较小的单个列表, 然后逐个进行。
  • Skype(环聊)-语音是反馈的强大工具。你可以立即提问并回答问题。但是, 请确保在通话后记笔记并通过后续消息(电子邮件)发送。
  • 协作工具-老实说, 我不是协作工具的忠实拥护者。但是, 它们有很大的好处。他们帮助你保持反馈到位。提问和回答问题的速度很快, 并且永远存在。
这里有一些很棒的工具:
反馈注释:
  • https://redpen.io/
  • http://collabshot.com/
  • http://www.designdrop.io/
协作工具:
  • http://www.invisionapp.com/
  • https://basecamp.com/
总结 建立系统和UI / UX设计工作流程, 以在整个设计和开发过程中保持通信线路畅通。这将使你能够实施出色的构想, 预测潜在问题并确定重要问题的优先级。
只要开发人员和设计师愿意一起工作, 他们就可以共同创造伟大的事物。互相学习, 并设计像这样的教程!

    推荐阅读