UI 设计:应该参数化,学 CAD 而不是平设
很久以前就有的想法了。
Photoshop 等软件的工作流仍然是平面设计那一套,这套做法在 UI 上面已经力不从心。Fireworks 可能要好一些,然而仍然对 UI 设计里的一些常见情况考虑不足。最典型的:如果两个控件需要相对定位,软件如何维护这两者之间的相对位置?
所以 Solidworks 那样的参数化设计才是最好的办法。Solidworks 的二维图绘制过程是这样的:
- 用户绘制基本的点线,此时没有任何几何关系。例如,绘制一个四边形,四个顶点都是自由的,可以随意移动。
- 用户添加几何关系(包括尺寸约束),软件自动移动点的位置来使图形满足这些几何关系。对于上面「四边形」的例子,如果你要画一个矩形,你就需要添加两对平行关系和一个垂直关系来让四条边处于正确的位置上。
利用这种工作流程,Solidworks 可以保证其绘制的草图精确地满足设计师的意图,而且不用用户费力计算那些顶点的位置。
UI 设计和工业设计有几分相似之处。UI 对尺寸和几何关系的要求远远高于平面设计,例如 UI 控件经常会对间距有严格要求,而以平面设计流程为基准的软件里,我们依靠移动控件来让间距满足要求。这样,设计师的意图是间接体现的,而非直接地、显式地表达出来——而在 Solidworks 等工业设计的流程里,如果你要挖两个孔,要规定他们的间距,直接一个尺寸一标,完事。此外,UI 设计里还有大量的弹性尺寸存在,例如,按钮控件的宽度经常是由其内文字宽度加上两侧留白决定,现有的工作流程非常不适合处理这种需求:Solidworks 的流程则完全没这个问题。
所以我很想看到一个基于 CAD 工作流程的 UI 设计软件,可惜,现在还没有。
最后上个 mockup:
