1

我是前端 Web 开发的新手。我与一位制作模型（无 html）线框的设计师合作，最终产品是一个 React/Angular 单页应用程序。

我在考虑这个工作流程。1) 获取模型线框 2) 用 HTML/CSS 重新创建它，并与设计师协作以进行快速更改。3) 完成后，将 HTML 转换为 React/Angular 单页应用程序。

谢谢。

4

2 回答 2

1

嗨，米奇，欢迎来到网络开发！

所以我不能说我会完全推荐这个工作流程，只是因为你不想编写和重写代码并将其变成组件。

我们与自己的设计师一起工作，每天都密切合作。如果您的设计师使用草图（他喜欢），他可以创建线框和原型。我们的工作流程与您的提议类似，这就是我们所做的：

  1. 我们有一个需要设计和构建的功能请求
  2. 他创建了一个模型/线框
  3. 然后他把它变成一个原型（可选）
  4. 从那里我把原型变成工作代码（我们使用角度）
  5. 当我认为我已经重新创建了他的原型时，我让他看一下，然后我们从那里讨论。

对我来说，返回并修复一些 CSS 或更改一些 HTML 很容易，只需保持所有内容井井有条并注释好，这样您就可以在未来随着应用程序的增长轻松更改内容。

我建议的另一件事是您应该创建自己的线框形式，以便您可以看到组件将如何放置并相互交互。

我希望这可以帮助您和您的设计师提出一个你们都喜欢的工作流程！

于 2018-03-22T03:13:22.700 回答
0

这是我的工作流程。我将 figma、sketch、adobexd 设计文件导入 Desech Studio，以获得一个干净的 html 结构，并使用 css 网格定位。然后我需要调整边距和大小，然后我就完成了转换。最后，我致力于网站的响应能力。

然后我安装并启用反应插件，当我保存项目时，它将导出反应代码。然后我处理反应代码和组件。这是 react 插件的github 存储库。

于 2021-07-17T11:28:01.280 回答