網頁設計：極簡主義簡介及應用 Minimalism in Web Design
【本文適合想學習設計理念、對介面設計主流有興趣的讀者】
“Less is more.” 這句經典名言來自德裔美籍的建築師Ludwig Mies van der Rohe，作品本身盡可能的減少多餘的元素，忠於物質本身的特性。在二十世紀初期不僅深深影響建築界、藝術界，至今人機介面設計也受其啟發。
什麼是好的設計？什麼是恰到好處的設計？當代的人們時時刻刻充斥著各式各樣的資訊，如何用最簡潔、最快速的方式傳達產品的目的，極簡主義成了目前主流的設計理念。
此篇文章將會介紹極簡主義的理念，並用許多例子來說明，以下是文章的架構：
- Definition 定義
- History 歷史
- Characteristics 特色
- Conclusion 結論
- References 參考資料
準備好了嗎？讓我們開始吧！
1. Definition 定義
極簡主義是至今最流行的網頁設計趨勢，此流派從二十世紀晚期開始，Google是極簡主義在介面設計上的先驅。
在網頁設計上，極簡主義的目的是以最簡潔的方式呈現最重要的資訊，屏除其他會讓使用者分心的不必要元素。
許多人會誤解極簡主義即是使用黑白，或是單一色背景，其實並不然。首先，設計師必須定義網頁的目的、最重要的內容，然後將其極大化，讓使用者一眼就可以明白此網頁想傳達的訊息，不論是使用文字、顏色或是圖片。之後，再刪去各種多餘的元素。
聽起來很簡單，但是實際情況上，取捨往往是最困難的。捨棄壞主意並不難，如何捨棄其他好的內容，才是極簡主義的挑戰。想進一步了解設計步驟的朋友，請參考Less is More: Fundamentals of Minimalist Web Design。
2. History 歷史
在介紹極簡主義Minimalism之前，必須先介紹抽象表現主義Abstract Expression。二戰之後，歐洲的情勢動蕩不安，許多藝術家逃亡到紐約，紐約成了新的藝術中心。由於環境的艱辛及內心的折騰，此時的藝術強調表達個人情感、自由、譬喻性的表現。
極簡主義一詞最初出現在早期1960年代的紐約，當時年輕的藝術家自我意識到近代藝術的通病，過於強調花俏、鮮豔、奪人的視覺呈現。他們重新定義藝術的本質，應該注重物質的本質，屏除其餘外部的因素：如情感、譬喻性、戲劇化等。因此，大部分的極簡主義作品由幾何線條、色塊所組成。
有許多論點提到極簡主義的理念受到包浩斯Bauhaus(1919–1933)及日本禪學的深遠影響。其中”Forms follows function”與極簡主義的主張不謀而合。
“Form follows function形體追隨功能” — Louis Sullivan
在二十世紀的晚期，Minimalism逐漸影響到人機互動領域，其中1995年Jakob Nielsen的十項使用者體驗設計優化原則，提倡減少不必要的元素，著重使用者操作的方便性，呼應了極簡主義的理念。
Google被公認為極簡主義HCI領域的的先驅，著重功能性的簡潔頁面，廣受大眾喜愛，將近二十年來首頁的改動不大。
Responsive Web Design的概念於2010年新起，為了增加RWD的效能，大部分的公司開始注意內容重要性的排序，讓介面在手機上也能方便瀏覽。
2011年，微軟Windows 8有了重大的改變，模組塊、扁平化的設計引起大眾譁然，媒體稱為是微軟至今最大膽、劇烈的改變。
而在2013年，蘋果公佈了iOS7的全新設計，將先前賈伯斯喜愛的Skeuomorphism風格扁平化，極簡的設計廣受大眾好評，被認為是最成功的案例之一，對之後的行動裝置介面設計有極深遠的影響。
“When we sat down last November (to work on iOS 7), we understood that people had already become comfortable with touching glass, they didn’t need physical buttons, they understood the benefits,” says Ive. “So there was an incredible liberty in not having to reference the physical world so literally. We were trying to create an environment that was less specific. It got design out of the way.” — Jony Ive (2013)
近期極簡化知名的例子，非Instagram莫屬。在2016年Instagram五月公布新的介面，還記得當時大眾大力抨擊新Icon多麽粗糙、懷念過去經典IG藍。新介面使用單一色調，更強調使用者創造的內容(照片)本質，至今仍是最受歡迎的App之一。
3. Characteristics 特色
看完了極簡主義在介面上的流變，Minimalism仍是現代介面設計的主流，當今流行的網頁元素，如扁平化設計、Hero Image及漢堡圖標，都是受到極簡主義的直接影響。
目前網頁設計的極簡主義並沒有一定的規章，作者綜合了Nielsen Norman Group UX研究團隊及Nick Babich的文章，歸納出三大要點：
a. 保留本質 Only the Essentials
b. 負空間 Negative Space
c. 視覺特色 Visual Characteristic
- 簡化色彩 Color Minimally
- 扁平化圖案及材質 Flat Patterns and Textures
- 傳達核心訊息的主相片 Vivid photography
- 戲劇化的字體 Dramatic Typography
以下我尋找許多例子來佐證上面三大要點，讓大家能夠更清晰的理解。
a. 保留本質 Only the Essentials
極簡主義的核心價值就是保留最重要的元素，移除不必要的內容。”不必要”指的是任何行為會影響用戶使用產品的流暢度。
Google本身就是最佳的範例，Google原先是Larry Page和Sergey Brin在1996年於史丹佛大學攻讀博士時的研究計畫，於1998年正式創立。
在首頁設計上，2009年12月有了重大轉變，移除了navigation bar及其他連結，只保留Logo、搜尋框以及兩個按鈕，讓使用者可以更快速達到他們的目的。
來到Google首頁的眾多訪客，他們的主要目的即是”搜尋”，而這簡潔的設計給予了使用者最快速、方便的途徑。
另外，Kayak是美國廣為流行的便宜機票/旅遊搜尋網站，由Terry Jones及Steve Hafner在2004年創立，2010年IPO，2013年被Priceline.com用18億美元收購。月平均有3500萬訪客，每年收益將近三百萬美元。
除了產品本身功能十分完善（速度、準確率、完整性），在UX/UI設計上也盡可能的精簡，以輔助網站功能為目的。2013年的在飯店搜尋首頁呈現簡潔的設計，去除其他視覺元素，專注於搜尋功能。
除此之外，我本身非常喜歡Kayak航班資訊設計，用簡潔、優雅的介面呈現完整資訊(航空公司、飛行時間、地點、轉機次數、轉機機場、價格)。
再介紹三個我很喜歡、常用的網站，直接切中目的、簡潔明瞭的介面：
b. 負空間 Negative Space
在設計中，分成兩種空間：正空間與負空間(positive and negative space)。正空間包含了一個網站中的所有元素，如：導覽列、文章內容、圖片等。負空間通常指的是空白，即在兩個元素間的留白。
留白可以區別兩個元素的不同，不僅引導瀏覽者的觀看方向，同時讓使用者可以更輕鬆的消化資訊。
因此，運用留白在Minimalism Design中扮演了極重要的角色，給予使用者適當的視覺休息空間，避免資訊氾濫。
C. 視覺特色 Visual Characteristic
在極簡主義下，有主要的四種視覺特色：
C1. 簡化色彩 Color Minimally
於極簡主義下，我們盡可能地減少視覺元素，因此，顏色的視覺地位更為彰顯。運用色彩來抓住觀看者的目光，同時加深印象。好的色彩運用應該與品牌、產品定位一致，有興趣的朋友可以參考Color Psychology色彩心理學。
C2. 扁平化圖案及材質 Flat Patterns and Textures
扁平化介面去除了立體的元素（如反光、陰影、漸層及材質等等），強調物體本身基本的形狀與顏色，運用簡單的方式呈現基本資訊，減少觀看者分心的可能性。好的圖示一眼就能說明想表達的意義，無需用額外文字說明，在How to design a top-quality icon裡有清楚的說明。
C3. 傳達核心訊息的主相片 Vivid photography
研究指出，網頁瀏覽者只會閱讀20%的文字內容，並且人類對圖像的吸收速度是文字的600,000倍。理論上而言，大型的背景圖及影片和Minimalism的目的不謀而合。
然而，爭議在於太過強烈的圖像或是影片會讓使用者分心，因此在實際應用上，必須再三確認相片/影片本身是否一目瞭然、傳達訊息，別讓美麗的相片誤導網站的目的性。
5. Conclusion 結論
在設計介面時，總是花許多時間構思介面元素的安排，時常會參考許多網站，尋找適當的設計應用在自己的產品上。進而發現許多充滿美感的設計，都有類似的性質，於是促成了此文章的靈感。
極簡主義並不是一定要使用才叫做好設計，而是理解其中的意義，並適當的應用在適合的產品。例如在電子商務、個人作品集等首頁，能夠一眼清楚傳達作品的理念、加深使用者的印象，極簡主義是很好的方法。不過，如Amazon、學術機構、政府、SASS功能相較複雜的產品，也許就不適合使用極簡主義。
在繁忙、快速變化的時代，極簡主義當今廣為流行，不僅僅運用在介面設計，甚至影響生活的價值觀，保持簡單的物質生活，追隨最純潔的快樂。
希望這篇文章能夠讓大家對極簡主義Minimalism有初步的認識，瀏覽網站時可以發現某個元素的存在，試著運用在自己的作品、產品當中，那我的目的就達成了。謝謝大家，也不吝指教，我們下週見！
6. References 參考資料
- The Roots of Minimalism in Web Design (Recommended)
- Functional Minimalism for Web Design (Recommended)
- The Characteristics of Minimalism in Web Design
- 扁平化設計與字型學（iOS 7特別更新版）
- Design Minimalism: What, Why & How → History
- Minimalist Design Is Taking Over: Here’s Why → Examples
- Less is More: Fundamentals of Minimalist Web Design → Guideline
- 極簡不簡單，並不是每個網站設計都適合使用
