扁平化風(fēng)格在APP設(shè)計(jì)中的應(yīng)用研究

潘飛

隨著互聯(lián)網(wǎng)的蓬勃發(fā)展，數(shù)字終端界面設(shè)計(jì)越來越引起商家和受眾的共同重視。筆者介紹了當(dāng)下廣泛流行于數(shù)字終端界面設(shè)計(jì)領(lǐng)域的扁平化設(shè)計(jì)風(fēng)格，對(duì)其設(shè)計(jì)方法進(jìn)行了探索和研究，以期更好的為此種設(shè)計(jì)風(fēng)格在設(shè)計(jì)領(lǐng)域的應(yīng)用和創(chuàng)新奠定基礎(chǔ)。

扁平化風(fēng)格是近年來新媒體設(shè)計(jì)界興起的一種流行趨勢(shì)，它是設(shè)計(jì)師們長(zhǎng)久以來對(duì)藝術(shù)表現(xiàn)手法的一種共同探索，也是時(shí)下的社會(huì)思潮，生活方式在藝術(shù)設(shè)計(jì)領(lǐng)域和交互設(shè)計(jì)領(lǐng)域的一種直觀體現(xiàn)。它既指那些具體簡(jiǎn)明現(xiàn)代感十足的的符號(hào)設(shè)計(jì)，又是指在界面設(shè)計(jì)上體現(xiàn)極簡(jiǎn)抽象，突出互動(dòng)核心在于功能本身的界面設(shè)計(jì)思想。在視覺表現(xiàn)上，它弱化視覺透視，降低了光影紋理材質(zhì)陰影對(duì)設(shè)計(jì)的影響，將界面設(shè)計(jì)回歸到藝術(shù)的根本，圖形和色塊。它在交互領(lǐng)域主要體現(xiàn)在易理解，易操作，易用性和簡(jiǎn)單化上。

扁平化與跨平臺(tái)設(shè)計(jì)

近年來在當(dāng)下技術(shù)條件和設(shè)計(jì)風(fēng)潮的共同引領(lǐng)下，扁平化風(fēng)格得到推廣。扁平化可以適應(yīng)目前各種顯示設(shè)備。移動(dòng)手機(jī)端產(chǎn)品層出不窮，更新?lián)Q代迅速，以iPhone 各版本的顯示大小為例，第一代、第二代、第三代iPhone和iPad Touch是480px×320px，iPhone4～iPhone4S為960px×640px，iPhone5、5C、5S為640px×1336px，iPhone6s為750×1336px，iPhone6Puls為1080px×1920px，從手機(jī)到平板，再到最近熱起來的4k電視，設(shè)備之間有著很大的ppi跨度。消費(fèi)者對(duì)硬件的需求也是各有所好，如何讓APP應(yīng)用更加方便的存在于各種設(shè)別，實(shí)現(xiàn)共通，成為設(shè)計(jì)師和技術(shù)人員共同的難題，而扁平化很好的解決了這一問題。紋理，陰影，高光材質(zhì)，這些以往會(huì)耗費(fèi)設(shè)計(jì)師大量的時(shí)間和精力，制作效率不高，而且越是設(shè)計(jì)復(fù)雜的效果，文件占用空間越大，明顯違背多數(shù)互聯(lián)網(wǎng)用戶追求小巧，快速，便捷應(yīng)用的心里，扁平風(fēng)格的應(yīng)用成為了必然。

扁平風(fēng)格的優(yōu)勢(shì)

扁平風(fēng)格視覺上給人簡(jiǎn)單大方的印象，好像就幾個(gè)色塊。這種設(shè)計(jì)風(fēng)格，主次分明，易于識(shí)別，圖形化的界面分割能顯著提高閱讀效率。它簡(jiǎn)約卻不簡(jiǎn)單，沒有多余的設(shè)計(jì)元素，能夠讓視覺上簡(jiǎn)明清新，交互邏輯上直接了當(dāng)，一步到位，信息傳達(dá)能力強(qiáng)。對(duì)用戶來說它可以更加簡(jiǎn)單和直接的將信息提取出來，更加容易的理解APP應(yīng)用的操作方式，減少認(rèn)知障礙的產(chǎn)生，通過APP提供的服務(wù)為生活提供便利。

APP設(shè)計(jì)中扁平化設(shè)計(jì)方法探究

1.設(shè)計(jì)理念上受到簡(jiǎn)約主義影響，以簡(jiǎn)約主義為出發(fā)點(diǎn)

扁平化風(fēng)格的根源要追溯到上世紀(jì)包豪斯的簡(jiǎn)約主義，包豪斯的代表人物密斯.凡.德羅就是這種風(fēng)格代表人物。他提出的少就是多原則，追求簡(jiǎn)明的形式，單一的色彩和功能至上，對(duì)設(shè)計(jì)界產(chǎn)生了深遠(yuǎn)的影響。而日本平面設(shè)計(jì)師代表人物原研哉，很早就提出了將商品藝術(shù)化和意境化的展現(xiàn)，他的作品《地平線》更是書寫了一種還原本質(zhì)的設(shè)計(jì)方式和簡(jiǎn)潔簡(jiǎn)約的藝術(shù)美學(xué)特征。極簡(jiǎn)主義的美術(shù)風(fēng)格和當(dāng)下互聯(lián)網(wǎng)領(lǐng)域的設(shè)計(jì)潮流不謀而合，它是設(shè)計(jì)思想在新媒體時(shí)代大潮的傳承和發(fā)展。作為UI或UE設(shè)計(jì)師在整理自己的設(shè)計(jì)思路時(shí)，可以多研習(xí)同簡(jiǎn)約主義有關(guān)聯(lián)的藝術(shù)品和商業(yè)品牌，從中吸取設(shè)計(jì)思想和靈感，通過這種途徑提升設(shè)計(jì)品質(zhì)。

2.秉持視覺一致原則

APP設(shè)計(jì)需要一致性的設(shè)計(jì)風(fēng)格和設(shè)計(jì)模式，為用戶建立起完整一致的模型，提升使用體驗(yàn)。應(yīng)用統(tǒng)一的網(wǎng)格風(fēng)格為界面設(shè)定視覺規(guī)范，使用戶可以根據(jù)內(nèi)容本身界定出的路徑移動(dòng)，增強(qiáng)視覺平衡效果。在圖標(biāo)設(shè)計(jì)上，寫實(shí)的圖像很難表現(xiàn)抽象通用的概念，大量寫實(shí)擬物的圖標(biāo)也讓人在視覺審美上產(chǎn)生疲憊，因此需要統(tǒng)一視覺表現(xiàn)，降低光影紋理材質(zhì)陰影對(duì)設(shè)計(jì)的影響。

當(dāng)然，為了增強(qiáng)用戶體驗(yàn)，除了考慮讓應(yīng)用簡(jiǎn)潔化之外，修飾元素的恰當(dāng)應(yīng)用亦是不錯(cuò)的方法。由于在視覺的條理性上，純粹的扁平化不容易滿足所有用戶的視覺體驗(yàn)，在APP的測(cè)試版本中經(jīng)常出現(xiàn)用戶覺得趣味性不足，亮點(diǎn)缺乏的現(xiàn)象，這顯然對(duì)APP應(yīng)用的推廣有不利的影響。修飾元素的適當(dāng)出現(xiàn)并不會(huì)阻礙和破壞設(shè)計(jì)的整體性，如果把它的優(yōu)勢(shì)加以發(fā)揮，設(shè)計(jì)師能利用細(xì)節(jié)為用戶提供簡(jiǎn)潔大方卻又不失趣味的應(yīng)用設(shè)計(jì)。

3.色彩設(shè)計(jì)扁平化的方式

（1）強(qiáng)調(diào)配色好感度

使用戶產(chǎn)生好感和共鳴的配色，更能引發(fā)用戶自發(fā)的去了解設(shè)計(jì)所要傳達(dá)的意向。如在表現(xiàn)食品類應(yīng)用時(shí)，好的配色可以激發(fā)人的食欲，促成接下來的購(gòu)買行為。因此我們可以在表現(xiàn)活力的配色時(shí)，多搭配幾種不同顏色，使用色相越多越能表現(xiàn)熱鬧活躍的氣氛，而且高明度高純度的色彩使用是比較常見的方法。設(shè)計(jì)若有需要取得用戶接受和信任的需要，表現(xiàn)安心和信賴的色調(diào)一般會(huì)選擇為暖色，而且用色不宜過多，我們可以運(yùn)用純度較低，明度適中的色調(diào)傳遞安心，溫馨以及穩(wěn)定感。另外高明度加少量灰色的設(shè)計(jì)能給人柔和安適的感覺。體現(xiàn)趣味性的色彩，一般是結(jié)合產(chǎn)品屬性進(jìn)行點(diǎn)綴和裝飾，在色調(diào)上形成對(duì)比。

（2）通過色彩導(dǎo)引閱讀和使用

通過對(duì)色彩位置的管理，方向和形式的把握和安排，可以達(dá)到讓色彩自然的引導(dǎo)視覺流程的作用。例如在大面積黑白色調(diào)下，紅黃藍(lán)做成的圖標(biāo)可以打破畫面的沉默感，指引用戶下一步的操作。在需要突出畫面中心的地方，跳躍的色彩使用可以自然的吸引用戶，如大面積運(yùn)用淺灰暗紅等色的引導(dǎo)頁中，一抹藍(lán)色能很容易的抓住用戶的目光。在需要利用色彩強(qiáng)調(diào)文字層級(jí)時(shí)，文字單一顏色雖有整體感，但畢竟過于沉悶，無重點(diǎn)和層次。如果用APP的色彩對(duì)文字進(jìn)行劃歸和整理，可以立刻使頁面層次分明，主次清晰。在色彩三大屬性中，明度的強(qiáng)弱對(duì)視覺體驗(yàn)的影響最為顯著。一般來說，高明度色彩比低明度色彩容易識(shí)別，強(qiáng)化對(duì)比可以強(qiáng)調(diào)主題。

（3）利用色彩引導(dǎo)消費(fèi)

優(yōu)秀的色彩使用可以在應(yīng)用被操作時(shí)，給用戶留下鮮明的色彩印象，提高用戶轉(zhuǎn)化率。APP設(shè)計(jì)者要保證商品的色彩與功能的一致，不一致的色調(diào)與產(chǎn)品容易導(dǎo)致消費(fèi)者的混亂感。例如，APP如果是推廣飲料的，我們可以用藍(lán)色綠色等表現(xiàn)清涼解渴，如果用紅色就會(huì)讓消費(fèi)者產(chǎn)生干燥炎熱的感覺而達(dá)不到效果。其次，要根據(jù)目標(biāo)用戶，確保商品色彩符合消費(fèi)者審美需求。如女性用戶通常喜歡溫暖明快的色系，而男性用戶喜歡暗冷色系，教育程度高的人群比較喜歡淡雅的色彩，而表現(xiàn)賣場(chǎng)氣氛的設(shè)計(jì)里，那些鮮艷跳躍的色彩更容易抓住用戶。

4.扁平化的交互設(shè)計(jì)

用戶在使用一個(gè)APP時(shí)，交互的易用性和界面的友好性依舊是其主要考慮。設(shè)計(jì)者對(duì)扁平化的理解不能單單停留在界面設(shè)計(jì)之上，界面設(shè)計(jì)要體現(xiàn)交互設(shè)計(jì)的思想。曾經(jīng)有交互設(shè)計(jì)師，將用戶比作沒耐心，孩子氣，不愛思考，壞脾氣的龐大群體。如果僅僅是視覺界面進(jìn)行扁平化優(yōu)化，而交互使用依舊繁瑣難懂，用戶體驗(yàn)就會(huì)直線下降，用戶轉(zhuǎn)化率不足會(huì)導(dǎo)致設(shè)計(jì)失敗。因此，界面的層級(jí)化就成了APP架構(gòu)者反復(fù)思量的問題，交互設(shè)計(jì)要突出常見用例和核心功能的相關(guān)元素。當(dāng)然任何一款A(yù)PP應(yīng)用的成功，除了優(yōu)秀的界面設(shè)計(jì)之外，必然取決于功能實(shí)現(xiàn)的合理性。對(duì)用戶來說，任何額外的操作步驟都會(huì)增加操作成本，增加功能的復(fù)雜性會(huì)降低用戶體驗(yàn)。因此，為了識(shí)別出核心的用戶需求，草圖，線框原型的討論和修改，需要經(jīng)過反復(fù)的調(diào)查實(shí)驗(yàn)和論證，以求達(dá)到簡(jiǎn)單和有效。

結(jié)語

可可·香奈兒說過：“時(shí)尚易逝，風(fēng)格永存”。扁平化作為當(dāng)下的設(shè)計(jì)潮流依然有很多可探索和研究之處，在探索扁平化風(fēng)格在APP設(shè)計(jì)領(lǐng)域的過程中，我們要辨析哪些方法和原則能為設(shè)計(jì)師形成設(shè)計(jì)風(fēng)格提供養(yǎng)料，哪些形式和內(nèi)容是對(duì)原來設(shè)計(jì)領(lǐng)域的改造和創(chuàng)新，進(jìn)而對(duì)將來的設(shè)計(jì)風(fēng)格進(jìn)行探索。只有這樣，才能設(shè)計(jì)出符合現(xiàn)代審美，符合時(shí)代需要，真正能為用戶提供便利的APP應(yīng)用。

（作者單位：浙江理工大學(xué)藝術(shù)與設(shè)計(jì)學(xué)院）

作者簡(jiǎn)介：潘 飛（1989-），男，山東棗莊，研究生，浙江理工大學(xué)藝術(shù)與設(shè)計(jì)學(xué)院，研究方向：視覺傳達(dá)設(shè)計(jì)。