什么是無框界面?
即使幾種主要的設(shè)計風(fēng)格已經(jīng)形成了寡頭壟斷(如蘋果的圓角玻璃、谷歌的等級、微軟的方塊)…),但界面設(shè)計的進化才剛剛開始。
我曾經(jīng)在之前的《[翻譯]去形式化-移動設(shè)計的新趨勢》中寫過去形式化的話題。在這種新趨勢中,界面上的內(nèi)容變得越來越重要。相對而言,與內(nèi)容無關(guān)的一切都被大大削減。
去形式化是一幅非常模糊的全景圖,一些新的設(shè)計風(fēng)格在演變中逐漸清晰起來,比如無框界面。
也許你已經(jīng)發(fā)現(xiàn),今年越來越多的網(wǎng)站和應(yīng)用程序,尤其是那些關(guān)注設(shè)計的人,都有這樣的趨勢。曾經(jīng)用來劃分區(qū)域的邊界和邊界逐漸消失,但在干凈的界面上,通過距離劃分,區(qū)域之間的差異仍然很清楚。
那么卡片化呢?
如果你的設(shè)計思維還停留在卡片上,那就過時了,因為在無框界面的趨勢下,卡片的概念被稀釋了。卡片有什么重要嗎?無論如何,用戶甚至不會注意到他們來這里的最終目的。界面只是他們搜索信息的手段之一(如果有良好的搜索功能,他們可能根本不需要掃描界面)。
是的,卡片化的起源有其合理性。幾年前,我們注意到顯示屏的尺寸越來越不可預(yù)測,設(shè)計師迫切需要一種設(shè)計方法來適應(yīng)不同尺寸的屏幕。卡片正好可以解決這個問題,因為它把內(nèi)容包裝成一個固定的小塊,可以像水一樣放在任何比自己大的容器里。不僅如此,還可以根據(jù)需要隨時刪除卡片,以靈活控制界面上的內(nèi)容類型和數(shù)量。在響應(yīng)界面的環(huán)境下,卡片化這個詞越來越受到重視。
事實上,無框界面并不真正與卡片相沖突,將內(nèi)容分成小塊的概念仍然存在,但此時卡片已經(jīng)完全透明,不需要看到卡片的外觀。
無框優(yōu)勢?
用文字來討論太過抽象,所以我用無框的概念優(yōu)化了一個大家熟悉的有框界面。不要問我是哪個網(wǎng)站,哈哈~
下圖:上面是原始界面,下面是我修改的無框版本。我的修改主要是刪除框架,然后對細節(jié)進行一些修改,以配合無框風(fēng)格,目的只是比較同一界面在有框架和無框架的情況下的區(qū)別。
掌控注意力
當你看上圖的原始界面時,你可能會看到卡片中的邊線,而不是內(nèi)容。這是因為白色卡片和灰色背景之間的對比非常明顯,而且尺寸非常大,所以它非常吸引注意力。卡片中的內(nèi)容很容易被忽略,因為它們被擠卡片中。
看上圖中的無框界面,因為沒有邊線,只有內(nèi)容,用戶眼中的注意力一定在內(nèi)容上。
用戶對界面的關(guān)注是寶貴的。因為一個產(chǎn)品想給用戶提供的功能越多越好,但是用戶的注意力總是只有一點點。因此,控制用戶的注意力是設(shè)計師的關(guān)鍵使命。假如界面上放置了太多色彩鮮艷、引人注目的裝飾,用戶看到內(nèi)容的概率就會降低。當然,即使有框架,用戶的注意力也可以通過特殊的框架設(shè)計來控制,但框架越多,難度就越大。