html - 使用线框进行 UI 设计和前端开发

Question

我创建了这个线框/草图让 UI 设计师将其变为现实，但是我对线框和网格系统有一些疑问：

链接： http: //postimg.org/image/npt5zlvu7/

1) 我可以用上面的线框/草图联系 UI 设计师吗？

2）在UI设计（感觉和外观）期间，我们应该关注流体网格系统还是只在开发过程中相关？

3）如果我的 UI 设计师也是前端开发人员，是否会更加一致？

4) 线框 -> UI 设计 -> 前端开发之间我应该关注哪些问题？

谢谢你。

Answer 1

1）是的，特别是对于你所说的“草图”。请注意，术语“草图”和“线框”对不同的人意味着不同的东西。您的两个图表都很有用，但草图更有用。

2）如果你想要它流畅，你必须记住它看起来很窄。理想情况下，这也意味着为狭窄的视图绘制草图。在响应式设计中，您需要流畅的动作，因此请确保宽窄布局是可相互转换的。即，元素以合乎逻辑的方式移动，主要是水平运动，或者水平系列变得堆叠。

3) UI 开发人员零需要成为您的前端开发人员。不同的技能。

4) 你已经完成了大部分的 UI 设计，尽管总是停下来从你的用户的角度来考虑网站。你基本上已经定义了你想要的 UI，所以现在你需要一个设计师来让它看起来干净和吸引人。

前端开发对不同的人也意味着不同的东西。如果您只是想获得好的 html/css 标记，那么有许多自由职业者和服务只专注于该任务。您的主要开发人员应该能够使用任何有效的 HTML。

Answer 2

这实际上取决于您想要实现的目标。您需要响应式网站吗？你想覆盖移动设备吗？

1) 我可以用上面的线框/草图联系 UI 设计师吗？

是的，为什么不呢。它包含所有元素。即内容发明者

2）在UI设计（感觉和外观）期间，我们应该关注流体网格系统还是只在开发过程中相关？

我不确定你所说的UI 设计是什么意思。如果这是您在 Photoshop 中执行的操作，那么答案是肯定的。您的设计稍后将被分割为 html 和 css，是的，您应该在设计某些东西之前考虑这个过程。使用简单高效的 html/css，很多事情并不完全可行。从另一个角度来看，在 Photoshop 中制作它们非常容易。

3）如果我的 UI 设计师也是前端开发人员，是否会更加一致？

肯定是的。正如我所说，我相信如果您制作网站/应用程序，您的设计师应该是网页设计师。不仅仅是设计师。因此，他/她了解 html 和 css。它们是如何工作的，什么是可能的，什么不是。

4) 线框 -> UI 设计 -> 前端开发之间我应该关注哪些问题？

您应该知道的最重要的事情是，最后一个前端开发实际上向您展示了最终产品的外观。线框和静态 UI 设计可以很好地为您提供一些想法并展示事物可能会如何运作。然而，一旦你把你的设计放到浏览器中，你就会得到真正的反馈。