新媒體視覺設(shè)計第2章新媒體視覺設(shè)計準(zhǔn)備工作課件

1、第2章 新媒體視覺設(shè)計準(zhǔn)備工作 明確用戶需求分析競爭對手CONTENTS目錄2.12.22.32.4完成設(shè)計草案確定設(shè)計風(fēng)格 新媒體視覺設(shè)計的準(zhǔn)備工作分析用戶需求，可以明確設(shè)計方向；分析競爭對手，可以取長補短，避免同質(zhì)化；在此基礎(chǔ)上，確定符合目標(biāo)用戶需求，但不與競爭對手重復(fù)的設(shè)計理念，然后，利用情緒板工具，完成設(shè)計草案。 2.1 明確用戶需求 2.1 明確用戶需求一個用戶說，我現(xiàn)在需要一個饅頭。這時最好的方法并不是給用戶一個饅頭，因為我們知道這里用戶真正的需求是“用戶餓了，想吃東西”，這個時候如果你提供一個雞腿給用戶，大部分用戶都會更加高興。簡約至上 2.1 明確用戶需求在明確用戶需求時，可以

2、借助 KANO 模型，KANO 模型是東京理工大學(xué)教授狩野紀(jì)昭(Noriaki Kano)發(fā)明的對用戶需求分類和優(yōu)先排序的有用工具，以分析用戶需求對用戶滿意的影響為基礎(chǔ)，體現(xiàn)了產(chǎn)品性能和用戶滿意之間的非線性關(guān)系。 根據(jù)不同類型的質(zhì)量特性與顧客滿意度之間的關(guān)系，狩野教授將產(chǎn)品服務(wù)的質(zhì)量特性分為五類：基本(必備)型需求Must-be Quality/Basic Quality期望（意愿）型需求One-dimensional Quality/Performance Quality興奮（魅力）型需求Attractive Quality/Excitement Quality無差異型需求Indiffere

3、nt Quality/Neutral Quality反向（逆向）型需求Reverse Quality 2.1 明確用戶需求用戶并不知道自己真正的需求，一旦我們能夠提供超出用戶預(yù)期的設(shè)計，就會大大增加用戶滿意度。 2.2 分析競爭對手 2.2 分析競爭對手競品分析，顧名思義就是對競爭對手的產(chǎn)品進(jìn)行分析，因為產(chǎn)品的內(nèi)容極其相似，所以如果是市場上已有的產(chǎn)品，就可以分析相似的設(shè)計、相似的產(chǎn)品。這里的競品分析指的是視覺上的競品分析，競品分析會使設(shè)計方向更有理論依據(jù)、不偏不倚。 2.2 分析競爭對手在獲取競品的時候，可以利用新榜（）中的新媒體（包括微信、微博、頭條等各大主流新媒體平臺）排行榜，查看本行業(yè)排

4、名靠前的新媒體品牌如何進(jìn)行視覺設(shè)計（如圖 2-2 所示），然后，可以在設(shè)計理念、色彩、插圖、字體、有無動態(tài)效果等不同維度尋找差異化。 2.3 確定設(shè)計風(fēng)格 2.3 確定設(shè)計風(fēng)格設(shè)計風(fēng)格是設(shè)計師在構(gòu)思過程中所確立的主導(dǎo)思想，它賦予了設(shè)計內(nèi)涵和風(fēng)格特點。合適的設(shè)計風(fēng)格至關(guān)重要，它不僅是設(shè)計的精髓所在，而且能令作品具有個性化、專業(yè)化和與眾不同的效果。藝術(shù)家 Marco Marilungo 用漫畫的形式將人類藝術(shù)史上最主要的 16 種風(fēng)格生動形象地展現(xiàn)了出來。 2.3 確定設(shè)計風(fēng)格這 16 種風(fēng)格中的一部分在新媒體視覺設(shè)計中應(yīng)用非常廣泛，比如現(xiàn)實主義、印象主義、立體主義、波普藝術(shù)、極簡藝術(shù)等，而另一些

5、因為過于抽象，在新媒體視覺設(shè)計中相對少見，比如抽象主義、非正式藝術(shù)、觀念主義等。伴隨著新技術(shù)的誕生和社會文化的發(fā)展，新媒體視覺設(shè)計實踐中還誕生了一些全新的設(shè)計風(fēng)格，比如蒸汽波藝術(shù)、三維渲染藝術(shù)等等。 2.3 新媒體視覺設(shè)計實踐解析現(xiàn)實主義關(guān)注還原現(xiàn)實，一般具有極強(qiáng)的逼真程度，所以也可以稱之為寫實風(fēng)格，寫實風(fēng)格關(guān)注細(xì)節(jié)，非常重視細(xì)節(jié)的還原程度。比如錘子手機(jī)的 UI 設(shè)計采用的就是寫實風(fēng)格，非常精美：1. 現(xiàn)實主義（寫實風(fēng)格） 2.3 新媒體視覺設(shè)計實踐解析為了保持統(tǒng)一的設(shè)計理念和嚴(yán)苛的美學(xué)標(biāo)準(zhǔn)，甚至重新繪制了以扁平化風(fēng)格為主的第三方應(yīng)用圖標(biāo)：1. 現(xiàn)實主義（寫實風(fēng)格） 2.3 新媒體視覺設(shè)計實踐

6、解析20 世紀(jì) 60 年代，在包豪斯運動的影響下，極簡主義開始出現(xiàn)，現(xiàn)在，極簡主義已成為當(dāng)今主流的藝術(shù)風(fēng)格之一。極簡主義風(fēng)格以簡單到極致為追求，感官上簡約整潔，品味和思想上更為優(yōu)雅。極簡主義關(guān)鍵詞是理性、簡潔、干凈。極簡主義設(shè)計的風(fēng)格包括摒棄復(fù)雜，只使用基本元素、大量留白、色彩、字體都很簡單。2. 極簡主義 2.3 新媒體視覺設(shè)計實踐解析2. 極簡主義 2.3 新媒體視覺設(shè)計實踐解析旅行類公眾號“24HOURS”、營銷類公眾號“休克文案”、情感類公眾號“我要 WhatYouNeed”等都是采用極簡風(fēng)格的設(shè)計?；瘖y品牌 HomeFacialPro 的公眾號也非常好地詮釋了極簡主義的設(shè)計風(fēng)格，和品

7、牌簡單、有效的定位非常契合。2. 極簡主義 2.3 新媒體視覺設(shè)計實踐解析3. 印象主義（像素藝術(shù)）大多數(shù)人接觸到“像素化”圖像應(yīng)該要追溯到玩小霸王游戲機(jī)那個年代了。但其實如果把“像素化”放在藝術(shù)領(lǐng)域去講，最早可以追溯到 19 世紀(jì) 80 年代的點彩派。點彩派不用輪廓線劃分形象，而用點狀的小筆觸，通過合乎科學(xué)的光色規(guī)律的并置，讓無數(shù)小色點在觀者視覺中混合，從而構(gòu)成色點組成的形象。之后的藝術(shù)家用電腦繪制類似的圖像被稱為像素藝術(shù)。 2.3 新媒體視覺設(shè)計實踐解析3. 印象主義（像素藝術(shù)）美妝類公眾號鯨魚顏習(xí)會在封面設(shè)計時，部分采用了像素風(fēng)格。 2.3 新媒體視覺設(shè)計實踐解析4. 波譜藝術(shù)波普藝術(shù)在

8、 20 世紀(jì) 50 年代中期誕生于英國，它反對一切虛無主義思想，通過塑造那些夸張的、視覺感強(qiáng)的、比現(xiàn)實生活更典型的形象來表達(dá)一種實實在在的寫實主義。和孟菲斯風(fēng)格的起源類似，都是因為青年藝術(shù)家們對于風(fēng)格單調(diào)、冷漠、抽象的現(xiàn)代主義感到厭倦、反感，渴望從希望有新的設(shè)計風(fēng)格表現(xiàn)自我，于是在英國青年設(shè)計家中出現(xiàn)了波普設(shè)計運動。所以波普藝術(shù)和孟菲斯有很多的相似性，比如注重形式主義、色彩飽和度高而且顏色豐富、主要的表現(xiàn)形式是圖形。 2.3 新媒體視覺設(shè)計實踐解析4. 波譜藝術(shù)情感大號“我走路帶風(fēng)”采用的就是波普風(fēng)格的設(shè)計，非常有趣： 2.3 新媒體視覺設(shè)計實踐解析5. 孟菲斯藝術(shù)孟菲斯藝術(shù)風(fēng)格最早形成于 1

9、981 年，是由一群意大利籍家具設(shè)計師探索出來的一種裝飾藝術(shù)的設(shè)計風(fēng)格。他們反對單調(diào)冷峻的現(xiàn)代主義，提倡裝飾，強(qiáng)調(diào)手工藝方法制作的產(chǎn)品，并積極從波普藝術(shù)、東方藝術(shù)、非洲拉美的傳統(tǒng)藝術(shù)中尋求靈感。孟菲斯藝術(shù)風(fēng)格在色彩上，常常打破配色規(guī)律，喜歡用一些靚麗、純度高、大膽、對比強(qiáng)烈的配色。在排版上，元素之間沒有過多的聯(lián)系，但是要做到“形散神不散”，構(gòu)圖上一定要保持平衡。 2.3 新媒體視覺設(shè)計實踐解析5. 孟菲斯藝術(shù)孟菲斯藝術(shù)風(fēng)格另一個很明顯的特點，就是運用大量的幾何元素。規(guī)則的幾何圖形有圓形、三角形、矩形、圓環(huán)、波浪線、網(wǎng)格、斜杠等等，不規(guī)則的幾何圖形也是由點、線、面拼貼而成。知乎、陌陌、有道翻譯官

10、等知名互聯(lián)網(wǎng)企業(yè)在廣告中都嘗試過孟菲斯藝術(shù)風(fēng)格。 2.3 新媒體視覺設(shè)計實踐解析故障藝術(shù)的流行和進(jìn)入學(xué)術(shù)討論大概是在 2010 年以后，是指利用事物形成的故障，進(jìn)行藝術(shù)加工，使這種故障缺陷反而成為一種藝術(shù)品，具有特殊的美感。故障藝術(shù)最常見的就是電視機(jī)、電腦出現(xiàn)問題后產(chǎn)生的破碎、有缺陷、顏色失真的圖像。6. 故障藝術(shù)媒體藝術(shù)之父白南淮創(chuàng)作的故障藝術(shù)風(fēng)格的作品 2.3 新媒體視覺設(shè)計實踐解析故障藝術(shù)在國內(nèi)的走紅主要歸功于抖音。抖音爆紅后，許多設(shè)計師開始關(guān)注并模仿這種風(fēng)格，導(dǎo)致故障風(fēng)的設(shè)計泛濫。6. 故障藝術(shù) 2.3 新媒體視覺設(shè)計實踐解析6. 故障藝術(shù) 2.3 新媒體視覺設(shè)計實踐解析故障藝術(shù)的制作

11、非常簡單，使用 PhotoMosh 等一鍵生成故障藝術(shù)的工具，直接把圖片拖拽進(jìn)工具即可。6. 故障藝術(shù) 2.3 新媒體視覺設(shè)計實踐解析插畫風(fēng)格在設(shè)計領(lǐng)域的應(yīng)用非常廣泛，包括扁平插畫、手繪插畫、MBE 插畫（由法國設(shè)計師 MBE 于 2015 年年底在 Dribbble 網(wǎng)站上發(fā)布而走紅、立體插畫等多種不同的表現(xiàn)形式。7. 插畫風(fēng)格 2.3 新媒體視覺設(shè)計實踐解析7. 插畫風(fēng)格許多公眾號的視覺設(shè)計都采用了插畫風(fēng)格，特別是主打年輕人和女性群體的公眾號。比如，公眾號行動派采用了扁平化插畫風(fēng)格。 2.3 新媒體視覺設(shè)計實踐解析7. 插畫風(fēng)格公眾號咪蒙、UC校園、姜汁滿頭等采用了手繪插畫風(fēng)格： 2.3

12、新媒體視覺設(shè)計實踐解析8. 賽博朋克風(fēng)格賽博朋克是科幻小說的一個分支，有著強(qiáng)烈的反烏托邦和悲觀主義色彩。今天賽博朋克經(jīng)常以隱喻義出現(xiàn)，反映了人們對于大公司企業(yè)、政府腐敗及社會疏離現(xiàn)象的擔(dān)憂。一些賽博朋克作家試圖通過他們的作品，警示人們社會依照如今的趨勢將來可能的樣子。因此，賽博朋克作品寫作的目的是號召人們來改變社會。賽博朋克風(fēng)格以藍(lán)、紫、青等冷色調(diào)為主色調(diào)，霓虹燈光感效果和故障藝術(shù)風(fēng)為輔助（圖像的失真、錯位、破碎等），有時還可以加一些異常的現(xiàn)象比如180 度翻轉(zhuǎn)的建筑，還有復(fù)古風(fēng)和未來風(fēng)并存。 2.3 新媒體視覺設(shè)計實踐解析8. 賽博朋克風(fēng)格常見的元素有黑客、數(shù)字空間、虛擬現(xiàn)實、人工智能、控制

13、論與電腦生化、都市擴(kuò)張與貧民窟、大型企業(yè)、基因工程、毒品和生化、恐怖主義。 2.3 新媒體視覺設(shè)計實踐解析9. 蒸汽波藝術(shù)蒸汽波風(fēng)格興起于 2010 年初期，是一種受賽博朋克影響的網(wǎng)絡(luò)線上藝術(shù)，主要采用拼接的方式制作，用于拼接的元素主要來自 80、90 年代流行文化的產(chǎn)物，比如，Windows95 的界面、老版的 IE 瀏覽器、石膏雕塑等。 2.3 新媒體視覺設(shè)計實踐解析9. 蒸汽波藝術(shù)人人車在春節(jié)前夕推出了一支 H5，故事的內(nèi)容可以歸納為一個青年在春節(jié)被親戚盤問，最終選擇尬舞唱歌讓親戚別擔(dān)心。除了故事內(nèi)容外，H5 的風(fēng)格則比較特殊，一開始的親戚對峙采用了故障藝術(shù)風(fēng)格游的游戲交互，后面的 MV

14、 則充滿粗顆粒、復(fù)古科技的熱鬧。 H5 整體采用賽博朋克式蒸汽波風(fēng)格，超現(xiàn)實的畫面風(fēng)格對撞現(xiàn)實的春節(jié)親戚，形成了一種奪人眼球的對撞感。H5 開頭用故障藝術(shù)的動效、電腦對話框與第一視角鏡頭，做足虛擬現(xiàn)實結(jié)合的游戲感氛圍。MV 部分男主搭配音樂唱跳，背景拼貼復(fù)古的霓虹、游戲像素、迷幻萬花筒、粗顆粒畫質(zhì)視頻。短短一分多鐘，唱了整整 20 個“別擔(dān)心”，還搭配了極其洗腦的推掌動作與鼓點節(jié)奏。 2.4 完成設(shè)計草案 2.4 完成設(shè)計草案完成設(shè)計草案設(shè)計草案時，可以運用情緒板方法。它誕生于 20 世紀(jì)的非信息時代，參與者被要求從日常的報紙雜志中挑選出符合某種心情意境的圖片，剪下來粘貼在一起。現(xiàn)在的設(shè)計中，也會運用到這類方法。 2.4 完成設(shè)計草案 2.4 完成設(shè)計草案第一步要確定設(shè)計