構(gòu)圖其實很簡單，其實就是利用這些最基本的元素為畫面建立一個引導規(guī)則，通過這個規(guī)則來確定畫面的重心及觀看模式，引導觀看者的視線，讓觀看者能夠用最短的時間按照拍攝者的意愿觀察到拍攝者想要表達的畫面重心，這就是構(gòu)圖的意義。
作為視覺藝術(shù)的基礎(chǔ)元素之一，線條的存在影響到我們對于畫面的第一影響，在畫面中，線條可以描繪形狀，可以在圖像中構(gòu)圖敘事引導，可以為觀看者的視線作為指向，通過線條，可以讓觀看者清楚畫面閱讀的順序。
線條在我們生活的環(huán)境中可謂無處不在，它可以是自然界的一道分界線，像是地面和天空的分界，可以是一條馬路的邊界或延伸，可以是一排欄桿，可以是建筑物的輪廓，可以是沖天的大樹。
線條在畫面中的存在主要有三種作用，一種是作為畫面中的主要元素存在，像是下圖中的道路就是由兩條筆直的線條構(gòu)成的主體元素。
Photo by Johny Goerend on Unsplash
可以作為畫面中的引導線。雖然照片是二維的是平面的，但是它所表達的意境卻不會是扁平的，拍攝者可以有無數(shù)種方式用畫面的組成來說故事，來表達自己的想法，用引導規(guī)則帶領(lǐng)觀看者的視線和思維在畫面中轉(zhuǎn)換。
引導線不一定要真實存在，僅僅以邊界的形式存在作為暗示來引導觀看者將視線轉(zhuǎn)移到畫面中的重心，像下圖中，觀眾席自上而下的輪廓線，上方光的邊界都將重心引導至左下角的臺上。
Photo by Edwin Andrade on Unsplash
像是下圖畫面之中，墻上的腰線，墻和天花地面連接處的分界線都作為引導線將畫面引導線畫面重心的縱深處。
而在布列松的這張經(jīng)典作品之中，即使利用欄桿和路面的彎曲運動來引導觀看者的視線運動，最終將畫面重心落在騎自行車的人身上。
有一種作用就是確定圖像秩序，起到分割畫面的作用，像在下圖中，一條水平線將畫面分為地面和墻壁兩個部分，由于購物車偏向于畫面左側(cè)，所以在右側(cè)的垂直線平衡了畫面的重心，讓畫面不會因為右側(cè)的空曠而顯得有些無聊。
Photo by Michael Zwahlen
在下圖中，道路作為引導線將視線引導到城市遠端，再以城市天際線作為分割線。在拍攝風景攝影或者景觀攝影的時候，分割線一般都會放置在畫面的三分處，無論是水平線還是垂直線，分割線都不宜放置在畫面中間位置，但也不宜過于靠近畫面邊緣。通常情況下，將畫面按照2:3或1:3的比例進行分割效果最好。
Photo by Michael Zwahlen
所有的構(gòu)圖技巧都是用來幫助我們讓照片說故事的，當我們面對畫面中的線條的時候，有沒有什么方法可以利用這些線條來增強畫面的敘述。通常在我們將要拍攝某個場景的時候，我們應(yīng)該先在它的周圍尋找合適的角度和線條以及其他能夠支撐這個場景的元素。然后讓每一個線條都能傳達不同的感受。
線條還會影響畫面的內(nèi)容，水平線更多的會帶給我們一種寧靜與平和的感受，像是海天相交的海平線；而垂直線則往往和力量和強度有關(guān)，像是摩天大樓的輪廓，或者森林里筆直的參天大樹，又或者說是飛流直下的瀑布，這些都會帶給我們一種力量和壯麗的感覺；而對角線構(gòu)圖則非常適合拍攝運動感十足的場景，我們在拍攝賽車之類的運動的時候，將畫面傾斜，讓跑道在畫面的對角線上，可以讓畫面看起來動感十足。
Via: letsfilm
]]>
Windows Phone 8 及 Apple iOS 7 界面。
什么情況？
大家怎么就突然從大愛材質(zhì)、斜面和投射陰影突然轉(zhuǎn)向熱衷扁平化顏色和簡約字體了？這一轉(zhuǎn)變受到了很多因素的推波助瀾，下面是其中比較顯著的幾項。
信息負荷過度
在當今這個信息延綿不絕的文化背景下，我們每天要不停地接觸各種信息流，有的重要，有的無關(guān)緊要。我們要不斷地評估、過濾并且創(chuàng)造各種內(nèi)容，這一切顯然是很費神的。此外，我們所攝入的內(nèi)容中有很多都轉(zhuǎn)移到了小屏幕設(shè)備中，從而更加劇了這種負荷過度的感覺。所以說人們現(xiàn)在很容易對過量的信息感到應(yīng)接不暇，而減少用戶界面（UI）中的元素則能夠帶來少許視覺上的寧靜。
雜亂不再：Geckoboard的可視化工具可方便你一眼輕松解讀關(guān)鍵數(shù)據(jù)。
簡約是金
與上述趨勢類似，很多具有顛覆意義的Web應(yīng)用和服務(wù)可提供功能高度集中的工具。雖然傳統(tǒng)的軟件開發(fā)商比較喜歡在產(chǎn)品中加入大量功能作為高售價的借口，但是朝著集中化微應(yīng)用轉(zhuǎn)變的風潮卻更傾向于使用簡單代替多樣化的功能組合。應(yīng)用越簡單，界面也就越簡單。
漂亮簡約：Oak的Blue天氣應(yīng)用。
內(nèi)容為王
每當有新設(shè)備和技術(shù)進入市場之時，其功能和推動交互發(fā)展的程度總會讓我們?yōu)橹?。繼界面所帶來的迷亂之后，我們一般都會將注意力重新集中到內(nèi)容上去。不論是文字、音頻還是視頻，對媒體內(nèi)容的攝入大概是我們使用設(shè)備時的最主要活動，而在這種情況下，我們需要保證界面不會影響我們的攝入過程。
技術(shù)精通
隨著智能手機和平板快速普及各種用戶，業(yè)界對其控制方式顯見性的顧慮日漸消退。盡管一度曾經(jīng)擔心用戶會難以看見不顯眼的按鈕，但現(xiàn)在我們卻更愿意探索較為細微的交互內(nèi)容。Windows 8和Chrome for Android甚至還支持在沒有視覺提示的情況下通過觸摸命令點亮屏幕。
Fitbit的控制面板界面在視覺上表現(xiàn)明亮、大膽而且簡單好用。
技術(shù)的影響
大部分軟件都會受限于所運行的平臺。屏幕尺寸和像素密度是硬件方面的限制因素。較小的界面大大限制了設(shè)計調(diào)色板的范圍，也就意味著界面上的每個元素都要具有自己的表現(xiàn)力。文字規(guī)模和字體大小將在很大程度上決定扁平化設(shè)計的美感和可用性。
如果你的目標設(shè)備無法體現(xiàn)出細微到這種程度的差別，那算你運氣好。隨著移動設(shè)備的屏幕尺寸和像素密度不斷提高，以后更薄更小的設(shè)備將能實現(xiàn)更高的清晰度。當然，對@font-face的支持也大大地提升了極簡化文字核心設(shè)計的吸引力。
使用Wallmob進行實時銷售監(jiān)控：記錄所有帶瀏覽器設(shè)備的銷售數(shù)字。
響應(yīng)式設(shè)計
隨著各種尺寸可聯(lián)網(wǎng)設(shè)備的普及，UI受大勢所趨而務(wù)求更加流暢，而與之相應(yīng)的，就是響應(yīng)式設(shè)計風潮。盡管響應(yīng)式設(shè)計不需要特別的美學，但也可以說扁平化UI相比其他風格來說能夠更易于輔助響應(yīng)式設(shè)計的美觀。最簡化設(shè)計的另一優(yōu)勢在于能夠降低頁面重量從而減少加載時間。
最佳實踐
好了，理論就說到這。下面我們來看看一下實際操作上的注意事項。打造有效的最簡化設(shè)計難度很高。在層層剝離常規(guī)的一些UI元素（投射陰影、斜面、材質(zhì)等等）的同時，你就會發(fā)現(xiàn)所剩下的為數(shù)不多的這些元素多么重要。下面的小提示盡管在很大程度上是通用的，但尤其適用于扁平化UI。
開始之前
任何項目都一樣，第一步是先確保自己選定的樣式合理。在開始進行扁平化設(shè)計之前，要先保證自己的設(shè)計符合目標用戶的感覺以及目標平臺、設(shè)備和應(yīng)用類型。如果不適合你的項目情況，那緊跟潮流也沒有意義。
流程
不管你要采用哪種樣式風格，遵循流程都是非常重要的。下面的幾個建議可以幫助你實現(xiàn)簡約效果。
· 在設(shè)計最簡化界面時，我一般會從PC機出現(xiàn)前的時代尋找靈感，那時的設(shè)計師和藝術(shù)家往往需要做到“多快好省”。接這個機會你可以重新探訪一下過去的很多優(yōu)秀設(shè)計，例如Josef Müller-Brockmann 和 Wim Crouwel。另外，我還會看向Ellsworth Kelly等極簡主義畫家，Mies van der Rohe等建筑家和Dieter Rams等工業(yè)設(shè)計師。
· 暫時脫離工作也很有幫助。扁平化和最簡化設(shè)計的核心就在于細微之處。所以，短暫休息后帶著新的眼光重新回到工作中有時反而比一味苦心琢磨要更有效用。
· 將不同版本毗鄰比較也很有用。在將一條輸入線上下5個像素來回倒騰了20分鐘之后，我會保留下兩個不同版本進行比較，這樣孰優(yōu)孰劣馬上見分曉。
· 由于物體的相對大小具有著非常關(guān)鍵的意義，因此你需要盡早開始在不同種類的設(shè)備上檢視設(shè)計理念，以便確定其是否合適。
· 在工作的同時，經(jīng)常自問：“我是否真的需要這個？”人總是很容易對自己鐘意的東西念念不舍，但我們還必須頻繁地找出要砍掉或者簡化的內(nèi)容。拋棄自己費盡心思做出來的東西不容易，但編輯取舍也是必須的。
Global Closet：一款由The Workshop為國家地理教育打造的互動游戲。
網(wǎng)格
網(wǎng)格在界面設(shè)計中扮演著非常關(guān)鍵的角色，絕無例外。在你拿著一套受限制的視覺元素，努力想確定其各自順序并讓使用方式更加直觀時，網(wǎng)格能夠帶來很大幫助。
· 網(wǎng)格所確定的，不僅僅是視覺順序。你還可以用它來界定內(nèi)容和功能組。有時候要將一組物體分組不一定非要用到線條或者方框。簡單的對其和空間調(diào)整往往能幫助用戶理解界面的結(jié)構(gòu)。
· 你也可以嘗試使用具有特定重要意義的元素打破網(wǎng)格來吸引用戶的注意力。如果不使用假3D技巧，尺寸與位置等簡單基本的布局原則則成為了簡歷視覺層次感的最佳要素。
· 嘗試使用一下密度比較高的網(wǎng)格。在大幅簡化視覺調(diào)色板時，你可能會發(fā)現(xiàn)你的設(shè)計能夠支持更為復雜的結(jié)構(gòu)，同時看起來也不會顯得凌亂。你也可以試試看僅通過位置調(diào)整能夠傳達出哪些額外的訊息。
Live School Rossul Design 開發(fā)的iPad應(yīng)用。
顏色
顏色毫無疑問是視覺設(shè)計中的一個關(guān)鍵組成部分。對于最簡化界面來說，其所具有的意義更加關(guān)鍵。
· 考慮更為寬泛的調(diào)色板。個人來說，我覺得范圍比較窄小的調(diào)色板通常能創(chuàng)造出比較功能化的界面。想創(chuàng)造出讓人眼花繚亂的繽紛色彩非常簡單。但通過下面這種方法，你可以大大拓展一下選擇范圍；而且，考慮到待設(shè)計元素的數(shù)量很少，擴展調(diào)色板還能給你帶來很良好的感覺。
· 在設(shè)定調(diào)色板時，可以在一個比較寬泛的色值范圍內(nèi)對選定的色調(diào)進行測試，并確保其在亮色和暗色下表現(xiàn)都合適。
· 建議分別試驗一下同系配色及鮮明對比。早期對調(diào)色板進行試驗將保證你在接下來能夠掌握微妙和強對比元素所需的全部配色范圍。
TriplAgent的視覺設(shè)計采用了絕妙的配色方案。
文字
在扁平化內(nèi)容驅(qū)動網(wǎng)站上，文字是主角。
· 襯線體無疑是個辦法，但無襯線字體卻能讓人感到更為簡潔。
· 你可以找一個粗細和樣式種類比較多的字體類型。雖然不一定全用的上，但比較寬泛的選擇范圍有助于更為鮮明地界定層次結(jié)構(gòu)。你也可能會發(fā)現(xiàn)某個粗細度在某個特定環(huán)境下效果更佳。
· 不要怕使用大小粗細走極端的字體搭配來構(gòu)建視覺順序。嘗試使用超大超細的標題字體搭配小號中等粗細的正文字體。
· 注意字體是否易于辨認閱讀。這一點雖然聽起來有點無厘頭，但你對自己所選定字體的依仗將是很強烈的，所以一定要保證其在任何尺寸小均易于辨認。
Siteleaf上清爽易讀的文字。
交互
在扁平化UI中，要表現(xiàn)出哪些元素可交互是個有學問的活。下面是我常用的一些方法。
· 對比如果布局內(nèi)容中大部分為白色，那可以給交互元素添加一定其他色彩。如果你的設(shè)計以文字為主，可以使用簡單的圖標表示交互。如果標題比較大而且全部為小寫字母，那么鏈接部分可以做小一點并使用大寫字母。你懂的。
· 常規(guī)的位置安放方法也能起到作用。比方說你的后退箭頭使用細V形表示，可以將其放置到左上角，因為用戶一般會到這個位置找后退按鈕。
· 隨著頁面上疊加內(nèi)容的增加，我們無法將所有可交互元素都做成按鈕的樣子。界面應(yīng)盡量直觀。但如果交互過程比較復雜或有違常規(guī)，則應(yīng)提供方便的錯誤恢復方法。
· 下拉菜單、模擬窗口、彈出式窗口及其他層疊元素對于扁平化設(shè)計來說操作起來比較麻煩。你可以采用鮮明的對比、邊框或著色區(qū)分不同的交互層級。
所呈現(xiàn)的設(shè)計要素布局簡單，對比度優(yōu)秀：Taasky.
結(jié)尾
在設(shè)計領(lǐng)域沒有一成不變的規(guī)范。看到各位設(shè)計師如此熱忱地投入極簡化用戶界面的設(shè)計令人歡欣鼓舞。但是，探索扁平化設(shè)計是否就意味著絕不使用漸變和陰影？當然不是。事實上，我近期看到的幾個很有意思的作品一方面以巧妙的方式呈現(xiàn)出了內(nèi)容，另一方面也保證了交互的直觀易懂，從而實現(xiàn)了扁平化和尺寸直接的平衡。
在這個互聯(lián)互通、信息豐裕、功能豐富的數(shù)字時代，最簡化設(shè)計廣泛的復興讓人眼前一亮。這自然不會是無所不能的解決方案（沒有任何一種風格能做到無所不能），但只要經(jīng)過深思熟慮和恰當?shù)膽?yīng)用，其能夠?qū)崿F(xiàn)既好用，有舒適的數(shù)字體驗。
原文地址：smashingmagazine
]]>