萬盛學電腦網 >> 網頁制作 >> 交互設計 >> 界面設計趨勢：猜想未來長什麼樣子
界面設計趨勢：猜想未來長什麼樣子
近期引發最多討論的界面設計無疑是iOS7新UI變化，但對iOS7的設計我在這先不做評論。
而是想跟大家討論界面設計趨勢，引導設計走勢的因素是什麼?
有句老話：“以史為鑒，可以知興替”
盡管人機交互界面發展時間不久，但從西方藝術發展史中能依然能給予我們啟發。
19世紀前藝術是為權力貴族與宗教服務，其宣揚的是宗教信仰與權力。
那時期，以巴洛克，洛可可為代表的作品中，奢侈華麗絢爛的裝飾特征深得權貴喜愛。
無論宗教建築，室內裝潢家具，還是貴族婦女的擺群，甚至小到留空雕花瓷器茶杯，這些無都是文藝復興思想的體現。
19世紀後隨著工業革命運動的爆發，自動機械開始代替傳統手操作。
同時隨著對機械語言的理解加深，思想家逐步意識到工業設計應該服務於大量生產，為大多數人生產實用美觀的物品，而不是為少數富有的特權階層生產奢侈品。
其體現的是現代化的觀念和技術，用一種嶄新的視角去思考問題，更強調實用主義的觀點。
拒絕在設計中采取裝飾性的圖形，轉而強調遵循材料和使用簡潔幾何形式呈現內容。
提倡設計的目的是人，而不是產品。
而這以理念裡最為大眾所以認知和了解的典型代表——包豪斯。
盡管包豪斯學院只存在了14年，但其現代設計理念影響至今。
歷史過後，我們來探索下未來。
對於未知的未來，在文學作品與科幻電影裡總是不斷的給予我們新的靈感與啟發。
一起回顧電影大師的作品，尋找和觀察那些科幻電影中“過去將來時”的未來設想。
1902年，喬治·梅裡耶以當時初對太空外星探索為背景而創作的《月球旅行記》，開啟了科幻電影的大門。德國導演弗裡茨·朗1927年推出堪稱科幻影壇一座豐碑的《大都會》。
影片中設想的：懸浮城市、高速輕軌、人型機器人、人工智能電腦、腦電波控制等，如今依舊是充滿藝術指導意義的大片。
隨著視覺特技的發展，電影創作有了更強大的技術去描繪未來科幻世界。
1960年~1980年期間，太空技術的進步啟發好萊塢《2001太空漫游》《星球大戰》等作品面世。這些電影中重新構建的未來世界，無論是建築還是科技，或者是人機交互中信息展示，界面操控等元素設計，都有著質的飛躍：
20世紀90年代，生命科學、空間科學、電腦科技的不斷發展，好萊塢開始大量依賴電腦特效合成影像(CGI)技術，再次構建了更為紛繁復雜的未來世界。《獨立日》《黑衣人》《第五元素》等影片上映，其擁有更為強大的視覺特效，以及具有戲劇性的故事情景，席卷全球票房。近期的《變形金剛》《機器人總動員》《阿凡達》《鋼鐵俠》等科幻大片無疑是“現在將來時”的設想。
無論是在1927年《大都會》顯像管屏幕呈現的代碼信息，還是2013年中三維立體投射出的數據模塊，這些“過去將來時”與“現在將來時”裡描繪的未來人機交互，都是對信息內容的極致還原，只是隨著時代承載的介質而表現不同。
其設計的本源依然是為“人”。
回顧這次iOS7的變化：
這次蘋果一改iOS1~6的擬物化UI風格，在iOS7使用極簡風格。何嘗不是對信息的極致還原。
對於iOS7改變的也並非只是更換了UI界面，在交互細節上更是充滿了人性的體驗。
未來的移動設備肯定不只是手機平板這樣的智能終端，蘋果想要拓寬其市場份額必然會進軍其他有智能媒介終端。
設想：如果iOS6的擬物化UI與iOS7UI在其他介質的終端中對比那會是怎樣?
從我ps的效果圖裡：擬物化其豐富的細節難與環境相融合，而簡介UI風格則較為匹配。
盡管這次iOS7在UI細節上處理並非完美，也是由於大家對於向來最求完美的蘋果公司充滿了太多期待，而這次改版的跨步較大，也讓很多人未必能一次接受。
從微軟的DOS操作系統到蘋果公司的圖形用戶操作界面系統，從台式硬件輸入到移動觸屏設備，人類對信息處理的要求不斷進化為由繁致簡的過程。回到界面設計，以歷史為鏡，給予我們的是相同的啟發，一切以還原“信息”本身，為“人”而設計。
也許未來人機交互的界面中，手機不再是我們智能終端的主體，程序入口也不是每個冰冷的ICON圖形，而根據當前環境提供相應信息和操作應用，信息則不再是靜態呈現，信息可視化的動態呈現應該是未來趨勢。每個應用間的信息互通更為便易，設備之間或者手勢直接拖動便可以同步或者分享信息。這些猜想從微軟、谷歌等公司的未來感念視頻中都有相類似的呈現。
或許不久的未來，終端設備就會像上圖這樣步入我們的生活，呵呵。
以上是我對未來界面設計趨勢的猜想，未盡善處歡迎指出。
想更多了解設計歷史的，可以在網絡上搜索BBC的《The Genius of Design》系列紀錄片。
參考資料：維基百科
部分圖片來源：豆瓣電影
感謝你的閱讀，本文由 騰訊ISUX 版權所有，轉載時請注明出處，違者必究，謝謝你的合作。注明出處格式：騰訊ISUX (http://isux.tencent.com/future-interface-design.html)
