重复的美你不懂!( 四 )


重复的美你不懂!
文章图片

好了 , 再看看看banner图的处理:

原图:
重复的美你不懂!
文章图片


我希望整个页面偏典雅一些 , 所以适合降低一下图片饱合度 , 添加点睛文字 。
重复的美你不懂!
文章图片


好了 , 看看放在页面上是啥效果:

重复的美你不懂!
文章图片




嗯 , 效果还可以 , 继续往下做 。

接下来是大段的文字处理:

第一步 , 文字排版是一个摸索的过程 , 先确定一下大方向——竖排 。
重复的美你不懂!
文章图片


第二步 , 在确立了大概排版骨架之后 , 添加细节视觉元素 , 让整个版面变得有血有肉起来 。
重复的美你不懂!
文章图片

你发现没?这里用到的方法其实跟上面的LOGO处理是一样的 , 都是在单调的重复骨骼上面扩充视觉元素 , 这是一个化腐朽为神奇的过程 。

再放到页面中 , 加入footer部分 , 看看效果:
重复的美你不懂!
文章图片


本来到这里页面差不多结束 , 不过看下来底部貌似稍显平淡 , 感觉没有一个强力的收尾过程就仓促结束了 。

再优化一下 , 底部加重 。
重复的美你不懂!
文章图片

嗯 , 这样就好多了 , 这才是一个压得住的尾部 。
来看看页面的完整效果:

重复的美你不懂!
文章图片

细看下来 , 这个页面从大模块分布 , 到小元素处理 , 处处是重复 。 不过从整体视觉观感上来看 , 并不会觉得页面很单调 。


完整版:
duang~~~
重复的美你不懂!


推荐阅读