如何为前端工程师创建可交付成果？

Question

这是关于前端工程师开发工作流程的问题。我正在为一个包含大量页面的大型网站开始一个项目，每个页面都有多个步骤，而且很难在电子表格中列出所有内容。

每个页面的内容将在电子表格单元格中传递，而某些页面具有多个可变部分，这些部分由用户的偏好决定。

我被问及关于如何构建可交付成果的意见。我想知道是否有最佳实践来构建这种可交付成果？因为当你有一个结构不合理的可交付成果时，它几乎就像使用钢笔和铅笔来编写代码一样。

您是否有任何工具，格式，实践来创建易于使用的可交付成果？

Answer 1

听起来您只是在进行UI设计，然后将其交给前端工程师。

如果这是正确的，我建议您看看是否可以执行粗略的html / css工作以使页面看起来像您想要的那样，然后他们可以进入并为其提供功能，但是那样你知道什么是可能的。

你可以完成大部分工作，然后留下关于尝试更好地集中内容的评论，例如。

我不喜欢将设计放在纸上或作为图像，只是获得html / css会更容易。

现在有很多工具可以让css和html变得容易，即使你在html中有css，他们也可以将两者分开，但是，这对设计师来说是一个巨大的帮助。

只需做一页，然后交给他们，然后在一两天内回来，就他们的想法得到反馈，以及如何改进你给他们的想法。

当你完成这个过程时，过了一段时间后，两个小组都会知道会发生什么，你可以快速完成其余的工作。

这更像是一种灵活的方法，前端工程师是您的客户。

Answer 2

我的建议是mockups或wireframes页面。样机将是各种状态下页面的示例，而线框是页面结构的详细文档。

Answer 3

HTML和CSS对于模型使用来说太复杂了。我通常首先为UI /功能创建需求积压（只是Excel中优先级请求的列表）。

特别是对于大型站点开发，您还应该完成流程和数据流定义（UML或其他描述方式），以帮助您定义上述要求。

基于这些，您将了解整个站点功能需要什么样的步骤（即页面）以及页面层次结构和结构将是什么样的。通过这种方式，可以更容易地掌握整个事物。

之后，我们将创建快速线框并使用Photoshop或类似工具以快速模型完成可视化最终结果。这些对我的经验至关重要，因为它可以帮助客户（和其他利益相关者）真正理解所做的事情。为此，html和css太慢而无法使用。

运行多次迭代