设计师和开发人员一起工作[关闭]

Question

WPF 和 Silverlight 丰富的演示功能意味着像我这样的开发人员现在将更频繁地与图形设计师密切合作，就像我的下一个项目中的情况一样。

有没有人有任何技巧和经验（从两个角度来看）可以让这一切变得更加顺利？

例如，当我最近向设计师提到源代码控制时，我很快就被告知你不能对图形、图像等进行源代码控制，所以这是浪费时间。所以我回应道：好的，但是 WPF/Silverlight 中的 XAML 文件怎么样？

斯科特·汉塞尔曼 (Scott Hanselman) 在一次演讲中谈到了这个话题 播客, ，但他更关注工具，而我对沟通问题/方面更感兴趣。

Answer 1

我在一个项目上与一位设计师密切合作了 4 个月，但他仍然没有掌握 CVS 的基本思想（这不是我选择的源代码控制系统）。我在这里谈论的是模板文件、JavaScript 和 CSS。他并不愚蠢，这只是让他的工作变得更加困难的事情之一，所以他拒绝完全投入其中。

就我而言，我必须真正强调这一点，即我几乎所有的 JavaScript 都依赖于标记，当他将纯 CSS、基于 DIV 的布局更改为基于表格的布局时，却没有告诉我，那么我所有的 JS 都将消失打破。

在项目过程中，我和设计师经常就我们各自的职责进行激烈的交流，我和设计师相处得很好，在工作之余还一起踢足球。如果我对他不够了解，无法通过这些交流，那么我认为这会造成一个难以忍受的工作环境。因此，我认为重要的是，你们双方以及某种经理或项目主管之间明确了项目期间双方的期望。

就我而言，最近很少出现问题，因为 CVS 的情况已经解决，而且他不能随心所欲地改变标记。设计器只处理静态文件，而不是尝试创建模板文件并直接处理它们，我有责任将它们插入到我的模板文件中。

这一切都与沟通和双方的一点妥协有关。

Answer 2

我发现的一件事是，作为开发人员，您设计代码的方式极大地影响了设计人员可以用它做什么。通常，您从 Web 下载 Silverlight 或 WPF 示例应用程序并在 Blend 中打开它，只是为了让 Blend 崩溃，因为代码在设计器中运行不佳。如果它没有崩溃，它看起来很少像正在运行的应用程序。

我最近在澳大利亚和新西兰科技教育中心做了一次演讲，主题是可应用于“可设计性设计”的技术。其中包括一个简短的列表：

1. 编写可以利用数据绑定的代码。模型-视图-视图模型或表示模式非常适合于此。

2. 为您的服务依赖项提供“设计时”存根。如果您绑定的类进行 Web 服务调用，请确保将 Web 服务客户端替换为存根类，该存根类返回设计者在 Blend 内使用的“虚拟数据”。这可以通过 IoC 和依赖注入轻松完成，如果 HtmlPage.IsEnabled == false，则注入一个实现。

3. 通过使用数据绑定，您可以限制 XAML 文件中“命名元素”的数量。如果您在后面编写大量代码，最终会将 C# 代码与 txtName 或 txtAddress 等命名元素耦合起来，从而使设计人员很容易“搞砸”。

4. 使用命令模式而不是单击事件处理程序背后的代码。通过将事件的调用者与处理程序松散耦合，您可以拥有较少命名的元素，并且使设计人员可以自由地在按钮或菜单项之间进行选择以调用特定命令。

5. 在 Blend 中测试您的代码！即使您认为自己是一个纯粹的开发人员，您也应该测试您的代码是否可由工具使用，并努力在设计时获得最佳体验。有些人会认为工具不应该影响您的软件设计，就像有些人抱怨“可测试性设计”一样，并且做出软件设计决策只是为了使代码更可测试。我认为这是一件明智的事情，也是让真正的设计师-开发人员工作流程继续下去的唯一方法。

其他建议是从小事做起。如果您的设计师不熟悉 XAML、WPF 和 Silverlight，请首先将他们介绍给项目团队，并让他们使用他们知道的工具进行一些基本设计。让他们在 Adob​​e Illustrator 中制作一些按钮和插图，并将其导出到 XAML，并向他们展示如何直接利用他们的设计资源。继续介绍越来越多的内容，希望他们感兴趣并希望改用 Blend。这是一个相当大的学习曲线，但它确实是值得的！

祝你好运！

附：我在我的博客上写了很多关于模式和使设计者友好的代码的文章 http://jonas.follesoe.no. 。您还可以找到我的技术教育演讲视频录制的链接，以及有关该主题的进一步阅读的大量链接。

Answer 3

这可能有点偏离主题（我正在专门回复您有关源代码控制和图形的问题），但是您 能 将二进制数据（图像等）放入源代码管理中（在我看来，在很多情况下应该这样做）——它们只是占用更多的磁盘空间，并且您不能使用差异视图以任何有意义的方式分析发生了什么变化，但您确实获得的是记录每个修订的提交消息历史记录、回滚能力和轻松存档的能力（标记修订 用 SVN 术语来说）属于特定发行版/版本的所有文件（无论是视觉资产、文档、源代码等）一起。您的构建系统也可以更轻松地从源代码管理中获取构建特定版本软件所需的所有内容。

Answer 4

让平面设计师参与早期的设计和架构会议。

你想让他们参与进来，揭示不一致的假设，并建立一种共同工作的模式，而不是把事情来回扔。

Answer 5

最初，我们设想专业设计师将在 Expression Blend 中工作，开发人员将在 Visual Studio 中工作，对一组共享的源文件进行更改。虽然这样做当然是可能的（只要你仔细定期检查你没有破坏其他开发人员期望的东西）。或设计工具），开发人员社区的许多成员（包括 Microsoft 内部的一些成员）已经发现将 Blend 和 Visual Studio 项目活动分开的好处 - 甚至可以手动将 Blend 生成的 Xaml 的仔细重构版本剪切并粘贴到“官方”VStudio 项目源，而不是允许设计人员和开发人员直接在单个共享代码库上操作。英国的微软用户体验团队发布了一段视频，描述了他们在实际项目中试图协调设计师和开发人员工作时遇到的问题。

真实世界_WPF_设计师和开发人员一起工作

学到的主要教训之一是，您不能为一个项目配备完全不了解彼此领域的设计师和开发人员。开发人员需要对 Blend 足够熟悉，以便能够为设计人员提供有用的 UI 外壳供设计人员装饰，以及设计人员可以设计交互性的有用数据“存根”，并且设计人员需要对他们不熟悉的开发问题有足够的了解不要执行诸如删除控件并将其替换为自定义视觉元素之类的操作 - 没有意识到它们破坏了与原始控件相关的所有功能。

Answer 6

微软对设计师/开发人员工作流程联姻的愿景在现实生活中似乎肯定会崩溃。我有过参与相当大规模的 WPF 项目的经验，该项目涉及 2 个专用设计资源，历时大约 4 个月。以下是微软似乎经常忘记的一些事实。

• 设计师通常更喜欢使用 Mac（我公司的设计师 100% Mac - 0% Windows）
• Blend 不能在 Mac 上运行（就 VM 解决方案而言 - 设计人员通常不喜欢像在外国操作系统中运行奇怪的应用程序这样的极客解决方案）。
• 设计师使用他们的专业工具 - Photoshop 和 Illustrator。时期。
• 当今的日程安排通常无法为设计人员提供充足的时间来学习全新的应用程序/设计环境（例如 Blend）。

鉴于上述情况，我注意到这创造了一种新的工作类型 - 要么是技术含量很高的设计师，要么是图形启发的程序员。基本上，可以采用原始形式的设计资产（通常是 .psd 或插画格式）并根据需要将其应用到应用程序过程中的人。

原来我就是那个人（图形启发程序员）。我花了很多时间从 Illustrator 文件导出 XAML，必要时手动清理它们，并使这些资源可以在 Blend 或 VS 中轻松使用显示对象。有时我会采用一个设计元素并使用混合重新绘制它（通常当原始资源是基于位图的并且将其转换为矢量更有意义时）。

我的应用程序可能并不典型 - 因为它的图形极其丰富，并且分辨率独立性是主要目标之一，因为它需要在多种分辨率和宽高比上看起来都很好（想想在当今的环境下设计电视的困难 - 事情已经发生了）在低分辨率标清中看起来不错，并且在高分辨率高清中也能很好地缩放）。

总而言之，我认为 WPF 是一项很棒的技术，并且绝对是 Microsoft 朝着正确方向迈出的一步。然而，它并不是将设计师集成到开发过程中的最终解决方案 - 除非您重新定义设计师的角色。

Answer 7

我是 Felix Corke，您提到的 hanselman 播客的设计师，所以这里有一些来自真正的创意人员而不是开发人员的观点。

我花了很长时间才习惯开发人员工具 - 几年前当我第一次开始从事 xaml 工作时，我从未听说过 Visual Studio、C# 或任何类型的源代码管理。它们对我来说是陌生的，就像 Illustrator 或 3DsMax 对您来说是陌生的一样。

我最大的一点是，不能指望设计师了解开发人员的实践 - 请准备好进行大量的指导。您无需学习任何新东西，而设计师将进入应用程序开发的全新可怕的一面。我把一些解决方案和签入搞得一团糟（现在仍然如此）。

令人高兴的是，我学会了成为一个更注重设计的集成商，而不是一个直接的创意人员，也许这是您需要在项目中包含的角色。这是我在 Mix 上为我们的美丽和极客 - 设计师/开发人员会议制作的插图 - 如果你们中的任何一个在光谱的两端都太远，则可能很难理解另一个人如何工作以及他们的角色应该是什么。

很高兴回答任何具体问题！

ps，您不希望源代码管理中包含 100Mb+ .psd 文件；）

Answer 8

我非常相信 Integrator 方法，这确实是我为使我们的 WPF 工作取得成功而必须扮演的角色。

洛朗·布尼翁 (Laurent Bugnion) 有一个 邮政 这描述了我正在谈论的内容。 罗比·英格布雷森 也是这种方法的坚定信徒。

但基本上，必须有人弥补开发者世界和设计师世界之间存在的“差距”。通常发生的情况是，这个人要么来自开发人员世界，要么来自设计师世界。如果他们来自开发人员世界，那么他们可能是具有设计师倾向的开发人员（他们负责外观和感觉、应用程序中的视觉效果、屏幕布局等）。如果他们来自设计师世界，那么他们就不会害怕代码，并且喜欢时不时地编写代码以获得动画或其他闪闪发光的东西。

然而，无论他们来自哪个世界，他们通常都必须培养以前从未拥有过的技能。就我而言，我是喜欢用户界面层的开发人员，因此我会说我是具有设计师倾向的开发人员。为了弥补这一差距并与我们的图形设计师进行富有成效的对话，我必须掌握一大堆设计师类型的技能，例如：学习使用Expression Design、XAM 3D等。

Shannon Braun 最近在当地的开发者大会上发表了关于开发者/设计师关系以及社区正在发现适合他们的工作流程的演讲。我没有参加会议，但我认为他的 幻灯片 就此事进行了热烈的讨论。

Answer 9

设计师在多大程度上感到有权远离构建软件产品所涉及的整个工作，这是一个需要解决的更大问题。不要迎合任何设计师所明确表达的权利，即不必知道他们的作品如何融入整体。

设计师社区中形成的这种明显的专业化是软件开发行业面临的最大的行业成熟度问题之一。可以预见的是，这种专业化程度会导致更多的返工和更长的周期时间。

开发人员有权利幸福地不知道交互设计和实现也是如此。

极度专业化总是导致生产力问题呈指数倍增。通过采用促进学习文化的流程来从组织上解决这个问题。这是大多数其他生产行业已经实现的成熟水平，而软件却严重落后。

在开发工作流程中的每个地方，过度专业化、工作队列和缓冲区之间都会发生切换。软件仍然是少数几个没有意识到这是我们面临的最大问题之一的行业之一。这种情况在微软社区中更加严重，因为由于微软通过其工具和指导使过度专业化永久化，过度专业化似乎变得越来越正常。除非您能像微软那样在开发工作上浪费那么多钱，否则您应该寻找更了解流程和生产力问题的方法。

因此，无法测试的开发人员和无法编码的测试人员都是行业不成熟的症状。

您不会从 TFS 的 Scrum 模板中学到任何这些内容。微软在让敏捷思维发挥作用（即使是最基本的形式）方面也落后了很多年，现在我们正在迈向精益思维，微软还需要三到五年的时间才能尝试将精益思维纳入其产品线。不要等待 Microsoft 告诉您如何塑造团队和工作流程。你现在就可以从微软几年后最终会关注的人那里了解到。

Answer 10

根据我的经验，集成商或“设计签名者”角色确实需要参与此过程，除非（小）团队中的每个人都能够担任此角色。这是一种非常罕见的情况。通常您会发现开发人员非常擅长开发，但不擅长设计/可用性，而设计师则擅长美观/可用性，但不想或没有受过足够的教育来编码。拥有一个能够跨越两个世界并“讲语言”的人非常重要。

集成商需要协调正在开发的控件与设计人员创建的设计资产。在我们当前的项目中，我们有 6 名活跃的开发人员和 2 名来自外部商店的设计师。我是这个项目的集成商，我一天的大部分时间都花在 Expression Blend 上。开发人员主要在 VS 中工作，创建符合我们产品规格的控件，而设计车间则设计最终产品的外观。设计师们在 Illustrator 中工作。我的工作是获取 Illustrator 文件并从中创建控件样式，然后将它们应用到我们开发团队开发的控件中。随着我们转向对 PSD 和 AI 文件提供本机支持的 ​​Blend 3，这项任务变得更加容易。

在应用程序主干的单独解决方案中为应用程序创建“外观”，然后稍后将 ResourceDictionaries 合并到主应用程序中，这非常有帮助。您可以获得正确的外观和感觉，而不会过于陷入仍然不完整的控制中。

Answer 11

自从您提到 SL 以来，我假设您指的是 RIA 项目。

我曾使用 Adob​​e 设计和开发应用程序和服务，参与过不少 RIA 项目。

我可以给你的最好的建议是基于我 14 年作为 UX 和视觉设计师的经验，我有一些编程经验，尽管与你们相比，我的建议很可怜。

接受你们不会互相理解的事实。

程序员认为 什么 功能应该完成，设计师认为 如何 功能应该表现良好。

对于开发人员来说，按钮大多是通用的，但对于设计人员来说，情况并非如此。设计师以组合方式思考，开发人员以框架方式思考。

所以要学会理解你的责任是不同的。

作为开发人员，您确实需要考虑代码的通用性，并且不能将所有内容都视为唯一的硬编码组合。除非你能以某种方式自动化这种独特性。

设计师确实需要将应用程序或服务视为独特的。这可能意味着按钮不是按钮。可能会有不同的尺寸或颜色或其他烦恼。

因此，请确保您与设计师建立良好的关系，承认您了解设计师的责任，并确保他了解您的责任。

这并不是说您对做出世界上最好的应用程序不感兴趣。只是其中一些设计决策需要花费相当多的时间。

确保你非常清楚设计师应该如何向你交付，这样你就不会浪费他或你自己的时间。什么格式，资产？命名？

从一种范式到另一种范式的交付所涉及的所有事物。

最重要的是，沟通并尊重他们不知道如何编写 JavaScript 或如何理解 CVS 的基本思想。

大多数开发人员都不知道如何调整字距以挽救生命，什么是寡妇，如何最好地分层 FireWorks 或创建逼真的图标，想出一个好的口号或用 4 个词让普通人都能理解。你不知道什么是网格或对齐方式，并且你倾向于将黑色的东西变成绿色和紫色。

设计师应该明白，仅仅因为你处理编程并不意味着你是一个机器人，你不能有创造性的想法和解决方案。他还应该尝试学习如何编写至少伪程序，以便他了解制作项目所涉及的内容。

最重要的是。不要开始争论 Mac 与 Mac。PC :) 项目因此被取消。

Answer 12

坦率地说，您应该告诉设计师，图像可以，应该和“将被放入源控制先生！” :)

它可能有点非常规，你将无法进行合并或任何类似性质的事情，但会有修订和历史记录等。图像还可以嵌入到资源文件中，该资源文件也进入源代码管理。

XAML 可以（并且应该）放入源代码管理中，并且作为标记文件，它将受益于所有功能。

就与设计师合作的技巧而言，与你一起工作的人光是这一评论就让我感到害怕，所以这可能都归结为与你一起工作的人。我会以一种很好的方式解释基本的最佳实践，并从那里开始。