i問號談UI設計:美工不是貶義詞



Path那篇文章在虎嗅發表後,害得嗅哥陪俺一起被罵瞭無數次,聽到的最多的一句是 你丫才美工,你們全傢都是美工! 。要不說咱們挨踢人都比較文明呢,當年在天涯房產觀瀾裡挨罵的時候,那可是祖宗十八代都被罵進去瞭,現在的這種罵法我聽著幾乎跟誇獎差不多。

在這裡特別說明一下,我真不是美工,我們全傢也沒一個美工(我倒是真心希望能有個美工親戚,那能幫我們這個小小的創業團隊多大忙啊)。

美工=美術工程師,在我眼裡一直都是一個非常中性的詞匯,說Path是美工Team,其實是在美術方面表揚Path,Path的美術工程師水準高是褒義,Path的產品水準低是貶義。

寫Path的時候就想好瞭要連續寫幾篇關於用戶體驗的文章,上一篇寫的動畫,今天以一個外行人的身份說說美術,既然隻聊美術,我會繼續沿用美工這個簡稱,請多包涵。

作為一個初創團隊,我們沒有美工(這其實一點兒也不丟人,您看看Instagram第一版圖標就知道瞭,估計他們當時也沒有)。

摳圖、找朋友們改圖,在那段時間裡真沒少幹這類的活兒。朋友很講義氣,身懷六甲還幫著作圖,人傢夠意思,咱也不能老是不要臉的麻煩人傢啊!

所以,很多時候,我和小宋會自己糾結著弄圖(我也算是Dribbble和Iconfans的常客瞭)。幸好小宋有點兒小文藝,會點兒最基本PS操作(據說是大學的時候為瞭把自己P好看點兒泡妞使),那段時間裡,我們倆真沒少一個像素一個像素的修圖,像素看多瞭,我又是個好問自己問題的人,就琢磨出瞭一些道道來,今天聊聊,請多指教。

1、與現實世界中幾十上百種美術流派不同,UI設計的好壞其實隻有一個標準,就是讓人在潛意識裡的感覺是舒服的還是不舒服的。就像在動畫那篇文章裡提到的一樣,自然的UI最舒服。

專業人士們每天爭論著蘋果的 擬物 、微軟的 扁平 和谷歌的 沒準兒 (谷歌自己做的東西還是偏 小清新 的)這些流派到底哪種更好,強納森代替瞭福斯特爾之後更是傳出瞭未來iOS會逐漸 扁平化 的小道消息,難道市場杯具的Metro UI反倒是未來的發展方向?

其實想明白這事兒,無關美學,無關技術,它就像是一層窗戶紙,隻待我們輕輕捅破。

在這件事情上,過去做的最正確的還是蘋果(雖不完美,但還是比另外兩頭豬強多瞭)。如果用動畫那篇文章裡的觀點來類比的話,蘋果的UI設計方式就好比是動畫效果裡的非勻速運動,谷歌是勻速的,微軟沒動畫,所有認為Metro UI是未來可以洗洗睡瞭。

現在讓我們來思考一個場景:

每天起床睜開眼,您看到瞭雪白的墻,透過潔凈的窗望向窗外,藍天白雲,神清氣爽,一切都是那麼的愜意。

等等,您覺得墻很白,藍天很藍,玻璃很透亮。其實,在您視網膜裡的光學影像以及傳送給您大腦後續處理的圖片資料中,並不是純白的墻、純藍的天、純透明的玻璃,對您這位觀察者來說,這個世界沒有純色。

不僅不是純色,墻的顏色還是漸變的(而且不是勻速直線的漸變)。墻上還會有窗戶的影子,白雲看著也像是大號的棉花糖一般的立體、飽滿、有質感。

現實世界裡,沒有純色,一切都有質感、有陰影,沒有質感、沒有陰影的是 鬼 。

從出生開始,我們就在努力適應的這個世界,我們的認知越來越習慣於周遭的環境,如果將我們放在一個純色的、無質感的、無陰影的世界裡,就好像在沒有動畫的世界裡一樣,我們將無所適從。

看出來瞭吧?Windows Phone的Metro UI風格其實就是個渣,Metro UI完全算不上設計流派,以自然的標準來看,Metro UI的差已是極致。 估計有人該跟我抬杠瞭,據說微軟的靈感來自巴士站的站牌和地鐵的指示牌,為什麼站牌和指示牌沒讓我們不舒服呢?

昨天在公司裡小宋又問瞭我一個問題, 聽說強納森以前是設計馬桶的,潔白簡約的馬桶設計,或者純白(黑)的iPhone外觀,都沒有讓我們不舒服啊!

這些說的都沒錯,但仍然不影響 Metro UI是個渣,谷歌的小清新隻比渣好瞭那麼一點點 這個事實。

因為,當我們看到潔白簡約的馬桶、純白(黑)的iPhone、公交地鐵的牌子時,進入我們眼睛的是反射光。而當我們看手機、平板、電腦屏幕的App界面時,進入眼睛的是屏幕本身發出的光線。就這麼一點點不同(反射光與屏幕發光),卻已是本質。

無論多麼簡約、多麼潔白的馬桶,通過反射光進入我們視網膜的影像都不是純色的,它立體、有質感、有陰影,如果進入我們視網膜的影像是純色、扁平、無陰影的馬桶,雖然不會像純色切割蛋糕機、扁平、無陰影的人(鬼)一樣嚇我們一大跳,卻仍會導致我們潛意識裡的不舒服,說不出來,但就是不舒服。

與其說消費者購買Windows Phone的時候是在用腳投票,還不如說是在用潛意識投票。

想明白這個道理之後,我就特同情那些高價購買 擼妹 的群體,唉,花瞭那麼多錢之後,每天還要在潛意識裡不舒服那麼多次,多可憐啊。 當然如果看瞭我這篇文章之後,他們就更可憐瞭,因為會從潛意識裡的不舒服升級為意識裡的不舒服的。

記住這句話,UI設計可以擬物、也可以扁平,可以清新、也可以簡約,但好的UI設計一定是符合自然的,自然的最舒服。

即便是Metro UI,正確的努力方向應該是把磁貼作得讓人看著有真實的公交地鐵牌子的感覺,而不是傻瞭吧唧的弄個完全純色、無陰影、無質感方塊放在那裡, 鬼 啊!

在這裡提前做個預測,以微軟官僚們的智商來看,等到Windows Phone徹底消亡那天,估計他們也大型攪拌機想不明白這個道理的。

2、隻顯示局部界面的設計不是符合自然的UI設計,在這一點上錯的App很多。

在現實生活中,人們在看到任何局部的、不完整的東西時,或多或少都會有點兒不舒服,差別僅在於有的人不舒服的多些,有的人少些。 比如說,拉開一半的抽屜,半開半掩的櫃門,我湊合還能忍,老婆大人一般是會逼著我趕緊把它弄好。

局部的、不完整的UI其實或多或少也會給人的潛意識裡帶來不舒服,因此這種UI不是符合自然的UI,這種設計也不是好設計。

在這一點上最2的還是Windows Phone。

記得在一些低分辨率的Windows Phone上,貌似連主界面都是不完整的,右邊一列的磁貼隻顯示瞭一半。

那個微軟引以為傲的全景視圖,就更牛逼瞭,讓您的界面永遠都不可能完整,關於這事兒您就想想一個永遠無法關上的櫃門吧。

Path的抽屜式菜單其實也一般,這種設計用來做Setting還湊合,畢竟基本上不用,主界面之類的大傢就別玩兒 殘缺之美 瞭。

特別說明,這裡說的局部的、不完整的指的是攪拌機界面要素,而非內容,List View滾動加載更多不再此范圍內,滾動加載更多就像是從紙筒裡拽出更多手紙一樣,沒什麼不自然的。

首頁 上一頁12下一頁 尾頁




每日頭條、業界資訊、熱點資訊、八卦爆料,全天跟蹤微博播報。各種爆料、內幕、花邊、資訊一網打盡。百萬互聯網粉絲互動參與,TechWeb官方微博期待您的關註。


↑掃描二維碼

想在手機上看科技資訊和科技八卦嗎?

想第一時間看獨傢爆料和深度報道嗎?

請關註TechWeb官方微信公眾帳號:

1.用手機掃左側二維碼;

2.在添加朋友裡,搜索關註TechWeb。
arrow
arrow

    ywi846gc02 發表在 痞客邦 留言(0) 人氣()