發(fā)布時間:2024-03-01 13:41:38 瀏覽量:175次
其實我們?nèi)粘?吹降拇蠖鄶?shù)設(shè)計元素都來自印刷出版物和美學(xué)先驅(qū),如果要追溯扁平化設(shè)計的起源時間及地點,可能有些難度。而在UI設(shè)計發(fā)展的歷史上,擬物化與扁平化經(jīng)常發(fā)生對立,各持一方,孰優(yōu)孰劣應(yīng)該交給時間來評論。就目前而言,UI設(shè)計似乎都在朝著扁平化的風(fēng)格方向發(fā)展,似乎這也預(yù)示著信息化的發(fā)展。
扁平化
在數(shù)字領(lǐng)域,Metro Design是平面設(shè)計領(lǐng)域經(jīng)典的案例,是微軟基于設(shè)計語言設(shè)計的一種界面風(fēng)格,用于微軟的Zune播放器,后在微軟的Windows Phone 7 同樣使用了該設(shè)計,后來的windows 8也使用該設(shè)計來適應(yīng)平板觸控設(shè)備。Metro作為一種文字導(dǎo)向(typography-based)的設(shè)計,比起其他UI設(shè)計風(fēng)格更加注重字體。
說到谷歌materialdesign的中文譯名有多種,“材料設(shè)計”、“材料學(xué)設(shè)計”等等,但準(zhǔn)確的應(yīng)該是“質(zhì)感設(shè)計”,目前這種設(shè)計語言在手機、平板電腦、臺式機和“其他平臺”提供更一致、更廣泛的“外觀和感覺”??梢宰岊伾r艷,動畫效果更突出,谷歌的想法是讓谷歌平臺上的開發(fā)者掌握這個新框架,讓所有應(yīng)用擁有一個統(tǒng)一的外觀,讓用戶得到連貫體驗。自從蘋果發(fā)布iPhone 5s同時推出iOS 7系統(tǒng)以來,蘋果系統(tǒng)扁平化的風(fēng)格就隨之而來。這個設(shè)計靈感來自德國已故傳奇設(shè)計師Otl Aicher,由Jonathan Ive主導(dǎo)的iOS 7,完全拋棄了立體、逼真、細(xì)節(jié),取而代之的是扁平、線條簡單、色調(diào)明亮的色塊。不過蘋果的設(shè)計里,陰影,漸變,高光甚至紋理很多效果都依然還在,所以蘋果的“扁平化”并非真正的“扁平化”。
擬物化
所謂擬物,必須是現(xiàn)實世界中已經(jīng)有的物體,而且是人們?nèi)粘5纳钪薪?jīng)常使用的物品。人們生活中使用過的東西都在或多或少地模擬現(xiàn)實世界出現(xiàn)的同類事物,這就是“擬物化”。這種擬物設(shè)計的初衷是讓人們更好更形象地理解系統(tǒng)所要表達的功能,它會花額外的精力描繪UI細(xì)節(jié)和裝飾。這類設(shè)計不僅體現(xiàn)在圖標(biāo)的擬物化思路上,還可以用動態(tài)過程表達出來。
擬物在UI設(shè)計上的精髓在于幫助用戶理解某款應(yīng)用或某個按鈕的功能,擬物在數(shù)字世界中的應(yīng)用可以追溯到上世紀(jì)80年代,雖然并非蘋果首創(chuàng),不過卻是1984年蘋果商用的首款用戶GUI向大家很好地詮釋了具有擬物特色的桌面和圖標(biāo)——它們與現(xiàn)實世界中的文件夾、紙張非常相似,隨后這種設(shè)計思路一直被沿用至今,成為數(shù)字世界中的主流設(shè)計。
在iOS6之前的版本,已經(jīng)把擬物推到了一個非常高的高度,視覺上每一處的紋理、陰影、質(zhì)感,每一個細(xì)節(jié)都經(jīng)過精雕細(xì)琢,堪稱完美。這個時候想要有所超越,尤其是想要在擬物這條路上有所超越,已經(jīng)非常困難。而且人們生活中的東西是非常有限的,而我們熟知的日常物品也在不斷被替代,應(yīng)用的功能創(chuàng)新,很難找到現(xiàn)實生活中的物來擬,擬物的風(fēng)格會限制住創(chuàng)新應(yīng)用的發(fā)展。
擬物化向扁平化轉(zhuǎn)變
在功能機盛行的時代,擬物化風(fēng)格大受歡迎,由于一部功能機并不像現(xiàn)在智能機那樣擁有那么多功能和軟件拓展性,功能機通常只需要相機、指南針、時鐘、收音機、錄音機等等常見的功能加上打電話發(fā)短信這些必備的功能即可,所以擬物化可以很輕松讓大家接受,包括早期的iOS系統(tǒng)Icon設(shè)計也是偏擬物的設(shè)計,這個設(shè)計一直延續(xù)到iOS 6達到一個頂峰。
擬物化設(shè)計在功能機年代對于老人小孩非常喜歡,幾乎不用學(xué)習(xí)就會使用。隨著智能機和數(shù)碼設(shè)備的普及,一個萬能的手機獲得了更多人的青睞,成了擬物化沒落的起始點。在2013年WWDC大會上,蘋果發(fā)布了基于扁平化風(fēng)格設(shè)計的操作系統(tǒng)iOS 7,新的設(shè)計去除了之前的擬物化紋理和質(zhì)感,將細(xì)致細(xì)微的動態(tài)效果和功能圖融為一體,使界面更簡潔。還有一個不可忽略的因素就是審美疲勞,那個功能機時代,GUI設(shè)計是普遍認(rèn)可的設(shè)計美學(xué)。網(wǎng)頁中廣受歡迎的產(chǎn)品通常都有一些類似的設(shè)計美學(xué),比如一些立體、內(nèi)陰影、外陰影等。對設(shè)計師來說,他們會以實現(xiàn)這種界面感到自豪。不過設(shè)計通常都是簡久必繁,繁久必簡。 不管是制作方還是用戶,都會審美疲勞。就算不疲勞,有些產(chǎn)品需要標(biāo)新立異,與眾不同。
隨著時代的變遷,擬物化的設(shè)計屬性越來越少,從而慢慢變成為一種視覺裝飾風(fēng)格,作為一種設(shè)計,擬物化的好處會越來越少,而隨之帶來的開發(fā)成本增加、審美疲勞等問題,使得用它的理由越來越少了。不過擬物化并沒有消失,一方面風(fēng)格這東西不存在好壞,總會有一部分人喜歡,另一方面?zhèn)€別程序需要趣味和親和力,也確實有必要用到擬物化。
未來——場景化
“場景”無處不在,特定的時間,地點和人物存在特定的場景關(guān)系。隨著互聯(lián)網(wǎng)平臺間競爭的日益加劇,產(chǎn)品同質(zhì)化現(xiàn)象越來越嚴(yán)重。競爭日益膠著的行業(yè)現(xiàn)狀,促使一些平臺開始向場景化方向發(fā)力,尋求新的突破。隨著各種模式的不斷完善,讓更多基于衣、食、住、行的各種各樣的場景被創(chuàng)造出來,這種“場景化”趨勢也成為了未來的發(fā)展方向。
未來,真正具有場景化的產(chǎn)品必須能主動感知場景的到來,將時間碎片整合。舉例來說,現(xiàn)有很多運動類的APP,這些APP能夠根據(jù)GPS、傳感器記錄步速、距離等信息,幫助用戶合理規(guī)劃運動,不過,目前的大多數(shù)軟件都需要先手動啟動APP。前段時間,美國已有一家公司基于“場景感知”的理念,開發(fā)出了新一代跑步APP可感知場景從而進行相應(yīng)的操作。
總結(jié)
當(dāng)然,就目前而言,扁平化的極簡風(fēng)格還是迎合了大家的審美很難被取代。不過還是那個道理,隨著時代的發(fā)展、科技的進步,加上人們審美疲勞,未來扁平化風(fēng)格必然會調(diào)整方向甚至被其他設(shè)計所取代。設(shè)計風(fēng)格和其所在時代的技術(shù)息息相關(guān),大趨勢還是簡化,例如近些年提出的3D全息UI概念,3D化的界面比2D更貼近真實,能更好的完成交互。
任何領(lǐng)域,從繁到簡都是一個趨勢,UI設(shè)計只是一種表達,更重要的是其背后的人機交互。不得不說,一項好的產(chǎn)品必須能夠做到在恰當(dāng)?shù)臅r間、恰當(dāng)?shù)牡攸c將恰當(dāng)?shù)男畔⑼扑徒o需要的用戶。場景化設(shè)計現(xiàn)在看來還太美好,但相信科技的發(fā)展,未來一旦實現(xiàn)場景化,那時的人機交互將會變得非常簡單。
熱門資訊
1. iPhone6的UI設(shè)計尺寸規(guī)范,原來如此重要!
想要了解iPhone6界面設(shè)計的尺寸規(guī)范嗎?這里為您詳細(xì)介紹iPhone6的UI設(shè)計尺寸規(guī)范,包括界面尺寸、圖標(biāo)尺寸、可點擊高度規(guī)范、搜索欄高度規(guī)范以及界面元素之間的距離規(guī)范。
2. 12個絕佳的UI設(shè)計網(wǎng)站,助力你的創(chuàng)作之旅!
將為大家介紹12個絕佳的UI設(shè)計網(wǎng)站,這些網(wǎng)站不僅可以為你提供靈感,還可以幫助你學(xué)習(xí)新的技巧,助力你的創(chuàng)意之旅!dribbbleDribbble 是一個面向設(shè)計師的...
3. 移動端UI設(shè)計中常見的5種APP界面類型,你get到了嗎?
通過介紹移動端UI設(shè)計中的閃屏頁、引導(dǎo)頁、浮層引導(dǎo)頁、空白頁和首頁等5種APP界面類型,幫助大家更好地了解UI設(shè)計的基本知識
4. 10個免費學(xué)習(xí)UI設(shè)計的網(wǎng)站 提升你的設(shè)計能力
怎樣可以提升你的UI設(shè)計能力!第一個:站酷站酷想必是設(shè)計師都知道的一個網(wǎng)站,里面不止有UI設(shè)計的資源,還有其他設(shè)計的,不如:平面設(shè)計、網(wǎng)頁設(shè)計、字體...
5. 移動端列表頁和表單頁設(shè)計秘訣:讓你的APP點擊率翻倍
在移動端設(shè)計中,列表頁和表單頁是不可或缺的部分。一個好的列表頁和表單頁設(shè)計能夠讓用戶輕松地獲取信息并產(chǎn)生點擊欲望,從而提高點擊率。本文將為你...
6. 推薦10本適合UI設(shè)計師看的書籍,輕松掌握技能!
對于想要提高自己的設(shè)計能力和創(chuàng)造力的小白和UI設(shè)計師來說,這本書是一個很好的選擇。4.《設(shè)計的覺醒》(IKKO TANAKA)推薦理由: 這本書是日本現(xiàn)代平面...
7. 零基礎(chǔ)學(xué)UI設(shè)計要多久?培訓(xùn)完能拿多少工資?
探索零基礎(chǔ)UI設(shè)計培訓(xùn)的時長與薪資前景。了解數(shù)字藝術(shù)教育領(lǐng)域的專業(yè)課程,以及培訓(xùn)后的職業(yè)發(fā)展機會。
8. 物聯(lián)網(wǎng)APP UI設(shè)計:創(chuàng)造智能硬件領(lǐng)域的沉浸式體驗
ui設(shè)計應(yīng)該讓用戶一目了然,能夠快速找到所需的信息和功能。在設(shè)計過程中,應(yīng)盡量使用簡潔的圖標(biāo)、文字和色彩,避免過多的視覺干擾。符合用戶習(xí)慣:ui設(shè)...
9. 武漢UI設(shè)計培訓(xùn)班費用怎么樣?想學(xué)UI設(shè)計要多少錢?
想了解武漢UI設(shè)計培訓(xùn)班的費用是多少嗎?不知道學(xué)UI設(shè)計要花多少錢?不妨看看這篇文章,了解UI設(shè)計培訓(xùn)班的學(xué)費價格以及學(xué)習(xí)內(nèi)容。
10. 設(shè)計中的色彩心理學(xué):淺析中西方色彩的歷史演變與設(shè)計應(yīng)用
摘要:本文探討了色彩的歷史演變和設(shè)計應(yīng)用。通過對色彩在早期文明社會中的實用運用、不同文化背景下色彩觀念的差異、色彩在設(shè)計中的重要性以及新興技...
最新文章
同學(xué)您好!