你应掌握的11个创新布局技法

2014-4-28    蓝蓝

转载蓝蓝设计(   www.lanlanwork.com  )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供有效的   BS界面设计 、 cs界面设计 、  ipad界面设计   、  包装设计 、  图标定制 、  用户体验 、交互设计、   网站建设 平面设计服务

来源:http://www.uisdc.com/100-things-you-should-know-about-design

如果您想订阅本博客内容,每天自动发到您的邮箱中,   请点这里

越来越多的网站设计师开始知道,进行布局设计时需要用到栅格线。但是对于老手来说,栅格线不是唯一的可选项,这些老手经验丰富,基础扎实,他们懂得怎样去创新,懂得用新颖的设计完成目标。条条大路通罗马,他们会凭借自己的感觉去摸索成功的方式,而最终的效果却更出彩。

栅格线与界面设计的关系可谓源远流长,对栅格线应用的熟练程度可以衡量一名UI设计师的水平。蓝蓝设计今天分享11个创新布局技法,废话不多说,看看这些UI设计师们是如何打破规则的吧。

1. 阶梯状布局

cannes-2013-landscape-poster-n1445-1

阶梯状的字体布局富有后现代主义气息,配合相关的图像,能够达成与众不同的视觉效果。

2. 适度倾斜

1610_full

性感的翘臀?性感的翘字?个性十足,遐想连篇。

3. 环绕形布局

wrap

更好的图文结合、打造视觉焦点、充分利用空间,挖掘栅格线系统的潜力。

4. 插画元素

Illustrated

栅格式布局太呆板?试着加入一点插画元素吧。让页面看起来更具娱乐性,更好的平衡美学与功能。

5. 重叠

Screen Shot 2013-09-25 at 2.42.53 PM

在Frank Chimero的动态个人网站中,他采用了图像重叠的手段,而非传统的栅格线布局。令人印象深刻。

6. 利用页面边缘

Brochure-Design-005

不要为了留边距而留边距——可以做点小实验,让文本超出页面边缘,然后用成沓的印刷品来呈递作品。

7. 妙用形状

bloodland

锐利的矩形配合以文本,看起来像是玻璃碎片,暗含一种暴力、兴奋的因素。

8. 不对称设计

bottom

不对称界面设计让人感觉非常自然、淳朴、无修饰。比如说这罐蜂蜜,感觉就很天然。

9. 拼贴画

invitation

这则可爱的婚礼邀请函感觉非常人性化、有手工质感,浓厚的拼贴风格。

10. 加入引用

pull-quote-1

用户对一成不变的阅读节奏感到厌倦怎么办?那就试着打破节奏,给用户一点惊喜,引用就是一个好方法。尤其是在大块大块的文本信息中,加入引用可以适度缓解多栏布局的阅读节奏感,让用户读起来更舒心。

11. 手绘字体

chipotle

适度添加手绘风格的字体,让你的UI设计更加有趣,别有风味,而不是一本正经。

这就是突破栅格线布局设计的一些技法,大家可以举一反三,在熟悉基础的前提下,突破原则,也突破自我!

分享本文至:

日历

链接

blogger

蓝蓝 http://www.lanlanwork.com

存档