佳人有约升级同城约会设计思路全过程分享(5)

7.2 定宽度

网站宽屏950像素，最好效果应该是960，可以完美应用栅栏设计，了解更多栅栏设计，请查看：http://960.gs/ 详细介绍了栅栏设计的原理和效果，包括栅栏下载。

Idate应用了网格的设计来对齐和布局元素等。定义了每一个格子为10px，安CTRL+ K和CTRL+6快捷键就可以调出Photoshop首选项，设置网格。

预览的效果如下图示：

7.3 自下而上的设计

应用自下而上的方式进行设计，从最重要的个人管理页面开始展开。我的佳人有约进过了大大小小十几次的修改，每一次的修改就产生十个以下的视觉稿，不断的不满意，不断的执着修改，以追求最合理的架构、最合理的视觉、最合理的用色为目标，但不以此为终点，因为视觉设计是没有终点的，回顾最后的设计还是会看出问题和不合理。

初期的效果：

初期的效果主次不够清晰，图片较多地压在下面，头轻脚重。没有一种解脱感。大概经过了十几轮的几十个效果的对比修改，发展出了以下效果：

大体上这个方向和细节已经成形了，但还存在一些问题，如推荐约会太一般，跟今日推荐差不多形式，不够突出。于是做出最后尝试：

透气，有主次，不要过多的色调和设计。最后定下了这个方案。