|  | 
 
| 过去传统的Web设计,基本上都一个个的矩形块,不管什么内容都要框在这个矩形框当中,然后加以布局。 这样带的设计问题时:
 1. UI中多出了太多在使用中没有用的框框线线。
 2. 不论什么内容都放在矩形块里,即形不成阅读重点,又不利于对页面内容的识别。
 3. 造成审美疲劳,形式大同小异,缺少页面创意表现。
 
 反Box的布局设计方式,正是不再拘泥与传统的Box布局模型,而是回归到对页面表达内容的关注。
 首先考虑,页面所要传递的信息本身,适合什么样的表现方式:
 比如,有一个人的头像、姓名和其它一些基础信息,如何表达;
 一段新闻稿,有一张新闻配图,如何表达;
 介绍一些新产品,有产品的图标和文字介绍如何表达;
 天气预报、地图、留言、导航、视频等等,如何表达。
 
 了解了这些内容本身适合什么方式表达之后,发现它们本身就具有一定结构外形。
 我们需要做的就是将它们根据页面需要摆放在适当地位置,
 然后注意到它们之间的留白、隔断、阴影、淡变等,辅助来完成这些布局。
 结果发现,这样的布局更显简洁,同时一眼扫过去,对页面内容的识别也更容易了。
 
 下面是网易通行证的帐户中心,Box布局和反Box布局的对比结果:
 
 Box布局方式:
 
   
 
 反Box布局方式:
 
   
 
 此示例RP源文件下载:
 
 
  网易通行证改造.rar
(384.59 KB, 下载次数: 1406) | 
 评分
2
查看全部评分
 |