共享国内外优质资源

今年流行的界面风格?可能是你从未听过的「无框界面」

时间: 2017-03-31 10:37:45浏览次数:1409
纵使几大设计风格已形成寡头垄断(如苹果的圆角玻璃、谷歌的层级…),但H5界面设计的进化历程才刚刚开始。在这个新趋势中,界面上的内容越来越重要,相对的,一切与内容无关的都被大大削减。五大大告诉你
    首先我们来说什么是无框界面?

    纵使几大设计风格已形成寡头垄断(如苹果的圆角玻璃、谷歌的层级…),但H5界面设计的进化历程才刚刚开始。在这个新趋势中,界面上的内容越来越重要,相对的,一切与内容无关的都被大大削减。五大大告诉你:

    去形式化是一张非常模糊的全景图,在演化中一些新的设计风格逐渐清晰起来,例如——无框界面。

    也许你已经发现了,今年来越来越多的网站和应用,尤其是那些注重设计的,都有这样的趋势。曾经用来划分区域的边框和边线逐渐消失,然而在干净的界面上,通过距离分割,各区域的差别依旧清晰可辨。



    去形式样例

    那么卡片化呢?

    如果你的设计思维还停留在卡片话,那就落伍了,因为无框界面的趋势下,卡片的概念被淡化。卡片与否有何重要?反正用户甚至不会察觉,他们只关心自己来这里的最终目的,界面对他们来说只是搜寻信息的手段之一罢了(如果有很好的搜索功能可用的话,说不定根本不用扫一眼界面)。

    没错,卡片化的由来有它的合理性。几年前大家注意到显示屏的尺寸越来越不可预期,设计师急需一种设计手段,来让设计出的界面能够适应不同尺寸的屏幕。卡片刚好能够解决这一点,因为它将内容封装成固定的小区块,像水一样,可以放在任何比自己大的容器中。不但如此,卡片式界面还可以根据需要岁时删减卡片,以此灵活控制界面上的内容种类和数量。由此响应式界面的大环境下,卡片化这个词被越来越多地注意到。

    其实无框界面与卡片化并不真正相冲,将内容分装成小区块的概念依旧还在,只是此时卡片已经完全透明,不需要看到卡片的样子了。


    上面的是原版界面,下面的是我修改的无框版

    1.掌控注意力

    看上图的原版界面时,第一眼很有可能看到的是卡片中的边线,而不是内容。这是因为白色卡片和灰色背景的对比非常明显,而尺寸又很大,所以非常吸引注意力。而卡片中的内容,因为在卡片中挤作一团,所以很容易被忽视。

    看上图中的无框版界面时,因为没有边线,只有内容,所以用户第一眼的注意力肯定是在内容上。

    用户之于界面,最宝贵的莫过于注意力。因为一个产品想要提供给用户的功能是越多越好,但是用户的注意力始终只有那么一丁点。所以,掌控用户的注意力是设计师的关键使命。如果界面上摆放了过多色彩显明、吸引注意力的“装饰”,用户看到内容的几率变下降了。当然,即便有边框,还是能够通过对边框的特殊设计来控制用户的注意力不分散,但是边框越多,难度就越大。

    2.减少设计束缚

    设计是连贯、统一的。一旦一个区域有了边框,其它很多地方都要加上边框与之呼应。边框一多,束缚也多。因为这意味着从此以后,不论一项要在界面上加一点什么别的东西,都要思考一下,是否需要加上边框,如果边框还分好几类,那么这时还要判断一下此处的内容适合使用哪类边框。这样设计师不自觉地给自己加了越来越多的束缚,而这些束缚,用户其实根本不care。

    3.增加界面利用率

    所有的边框,可以不要边线,但是至少得要有两个边距,即内边距和外边距,这样才能保证视觉效果的舒适性。然而如果去掉边框,用距离分割内容区块,那么两个内容区块之间就只需要一个间距就好了。就算为了区分要拉大这个间距,也通常不会超过有边框情况下内外边距之和。

    这样算来,无框界面的界面利用率会更高,能够在有限的空间里,摆放更多的内容。

    4.提升设计效率

    前面提过的减少设计束缚,可看作是一种对设计思考效率的提升。除了思考之外,无框界面对画图效率的提升更加明显。

    在画图过程中,给内容加上边框意味着每增加一块内容都要先画出边框;每修改以此内容,边框都要一并修改一次。尤其是在很多工具中,圆角、双线等特殊边框画起来相当繁琐。

    五大大总结:无框界面其实不过是界面风格的一种罢了,并不是包治百病的神药。糟糕的设计师,什么风格都拯救布料;而能自成一派的优秀设计师并不需要收到任何风格的局限。即便在今天,全键盘的黑莓手机依旧在欧洲市场占据重要位置。我从不认为有框与无框之间又对错之分,只是此处做个预言,未来的世界会朝无框迈进。
想要效果 就要行动
速度联系国民建站优选品牌五大大

现在填写 送好礼

智慧建站新选择,网络营销好伙伴

有颜值 会销售 ,一切用效果说话

国民建站优选品牌五大大

助您成功跻身明星企业及实力网商行列。

五大大建站免费咨询热线
0755-82819113
在线QQ咨询
QQ:125667200
思安股票_股票配资,配资炒股,配资平台,配资官网,股票配资网站,股票配资门户...