在線客服

          移動端手機主題圖標的配色設計研究

          引論:我們為您整理了1篇移動端手機主題圖標的配色設計研究范文,供您借鑒以豐富您的創作。它們是您寫作時的寶貴資源,期望它們能夠激發您的創作靈感,讓您的文章更具深度。

          移動端手機主題圖標的配色設計研究

          一、手機主題圖標的配色設計與研究現狀和意義

          (一)手機APP界面圖標的重要性圖標就像是電影的海報,就像是書本的封面,它起著宣傳和吸引受眾注意力,傳遞和象征手機應用功能的作用。作為一個標簽,它存在的意義是向用戶傳遞這個應用是什么類型,是做什么的,有什么功能。

          (二)手機主題圖標的配色設計概述

          手機主題圖標是打開手機鎖屏后的主要桌面圖標。手機主題圖標作為品牌手機的及時門面,圖標的配色調性和手機桌面的背景色調性共同構成了這個界面的視覺效果,其視覺效果的好壞直接會影響到消費者對于這部手機界面視覺的及時印象。“色彩對于人的視覺感官有很大作用,有研究數據表明,人們通過眼睛對一件事物的判斷前0.03秒是最關鍵的。”所以,手機主要界面的圖標配色和背景色配色至關重要。

          (三)與本選題相關的知網文獻研究現狀和本選題的研究意義

          本文選題通過中國知網關鍵字檢索,共檢索出28篇和本文選題接近的文獻資料。其中研究PC端網站UI界面配色設計和多媒體課件配色設計的文章居多,研究移動手機主題圖標設計相關的文章只有三篇。這三篇文章的研究側重點主要是從APP應用圖標的設計原則和APP扁平化圖標設計風格等大的方向去論述。然而文獻資料側重點具體從移動端手機主題圖標的配色方向研究論述相對較少。所以本篇論文的選題具有相當研究價值,可以豐富和彌補從移動端手機主題圖標的配色理論與文獻。目前移動端手機主題圖標的配色設計風格種類多種多樣,可供購買使用的手機主題圖標不下上千套。可謂是百家齊放萬家爭鳴,滿足不同人群的各種審美需求。但是,正是因為風格種類太多魚龍混雜,其中各種移動端手機主題圖標設計作品水平層次參差不齊。所以,本論文的選題也更有研究價值和意義。

          二、不同品牌手機主題圖標界面的整體配色方案分析

          目前市場上主流的手機品牌有:蘋果、華為、小米、三星、錘子、聯想、opp、vivo、中興......等等,這些主流品牌的手機主題圖標和界面設計風格主要有以下三種類型。是蘋果手機的核心主題圖標啟動界面,從圖標和界面配色效果整體視覺上分析:

          及時,圖標和界面整體視覺色彩三要素的調性統一。第二,圖標整體配色方案是以檸檬黃和紫羅蘭、湖藍和土黃、粉綠和粉紅為主,視覺沖擊力最強得互補色配色方案。第三,每一頁界面配以小面積明度對比最強的黑白色圖標在明度和飽和度上作為破筆來打破整體視覺效果的單調性,小面積的重顏色能讓界面的配色更有層次和節奏,讓亮顏色更亮,讓輕漸變的高級灰調性更透氣。但是,需要注意的是畫面破筆不能太多,否則會造成界面視重混亂。因為單一圖標是可以移動的,而且文件夾屬性會縮小明度對比強的“指南針”和“股市”圖標在整體界面當中的顯示比例。所以,這個問題會在IOS高版本的系統界面中避免掉。第四,蘋果手機界面背景色以半透明虛化的淡藍淡紫色為主,達到在視覺效果上保持和主界面調性統一的同時,襯托主題圖標的視覺效果,讓主題圖標的重要信息既突出又統一。蘋果手機的主題圖標界面配色設計堪稱,這也是為什么很多消費者在購買手機的時候會選擇蘋果手機的原因之一。安卓系統的華為手機在市場上以其各種系列和其他品牌手機價位相等,但是性能高于其他品牌手機性能的超高性價比,和針對各種不同消費能力群體在價位上的細分,也得到了不同購買能力的買家青睞。華為手機主題圖標和界面背景色整體色調統一,設計風格也是統一在圓角矩形輪廓下的扁平化風格。但是仔細觀察就會發現:

          及時,主題圖標配色雖然選用了互補色和類比色混搭,但是單一圖標里面缺少點綴色,整體圖標界面缺少破筆,顏色調性就會顯得單調,層次感和節奏就會顯得單一缺少變化。第二,界面背景色的飽和度太高,明度太低。給人的整體視覺感受是不透氣和壓抑感。界面背景色是需要弱化來襯托圖標的顏色從而達到讓圖標的信息內容傳達明確。第三,手機的屏幕和電腦相比較要小很多,所以在有限的空間里,圖標的設計上應該適當縮小圖標之間的間距讓圖標所占的面積再大一些。這樣圖標顏色的顯示面積比例才會更大,互補色和類比色的搭配視覺效果才會凸顯。是市場上小米手機的圖標主界面。小米手機以其個性化造型設計和親民的價位和超高性價比贏得了相當的市場占有率。小米手機的啟動主界面圖標整體配色設計在色調上區別于前兩者,其界面整體色調為顏色比較厚重沉穩的暖色調。這種配色的調性更加會受到成熟穩重的成年男性的青睞。相比較于,雖然都是扁平化風格,但是個別圖標中間有小面積點綴色,而且為了不讓圖標整體看著單調,點綴色和底色的對比用了相同調性的互補色搭配,顏色變化和細節較多。單一圖標的設計和圖一的圖標設計相比較,配色細節變化還是顯得有些遜色。界面背景色的配色方案為互補色配色方案,明度較為重的藍色漸變底色用來襯托時間模塊,明度較為重的黃橙色漸變用來統一圖標的暖色調風格,上下兩部分接壤的中間部分用了明度較為淡化的漸變來讓顏色融合,整體上又形成互補色對比,讓厚重的整體風格不失沖擊力。同時壓重了頂端的明度,讓視覺中心隨著漸變集中到下端圖標上面,可謂是非常用心的設計。但是,整體厚重的配色方案畢竟不如圖一清爽的配色方案讓人神清氣爽心曠神怡。而且,圖標作為手機界面當中的最主要內容,在扁平化風格的大框架之下的配色方案應該以輕漸變為底色,適當提高圖標的明度,用點綴色或重顏色讓界面圖標的整體視覺效果層次和節奏感更強。

          三、手機主題圖標的配色

          (一)手機主題圖標配色的發展歷程

          “最早的手機屏幕很小,只有最基礎的黑色、白色,界面圖標大多是線條勾勒或單色圖形,非常簡潔,只表達了最基礎的意思,沒有過多的裝飾。。到了2001年,世界上及時部彩屏手機上市,雖然手機還是黑白的顏色居多,但是加入了少數的彩色點綴,比之前的黑白圖標又向前邁進了一步。”。2007年開始,以諾基亞為主的手機品牌開始出現可更換主題的圖標界面,手機不再是只能打電話發短信的通訊工具,人們開始側重手機的功能性,并帶給人更好的用戶體驗。“Iphone的出現讓人們從此進入了全新的智能機時代,實體按鍵的取消使得圖標更為重要。”圖標設計已經不局限于僅僅對于功能性的傳達,美觀性和趣味性以及設計美學是如今圖標設計的主要目的。

          (二)圖標配色基本原理和圖標調性與功能的關系

          1.手機主題圖標配色的基本原理

          “光的物理性質不僅僅是由人類對顏色的感覺所決定的,周圍的顏色也會影響到人類對顏色的感覺,一些時候人們也會將由物質產生出的不同顏色的物理特性直接稱為顏色。”所以,顏色要在對比和搭

          配中觀察,不同調性的顏色通過不同的組合搭配方式會產生千變萬化的視覺效果。

          2.圖標的顏色調性和應用功能的聯系

          在色彩心理學中,每一種顏色都有自己的心理暗示和感情傾向。亮顏色要用重顏色底色去襯托,才會變得更亮。大面積的暖色要用小面積的冷色底色襯托才會顯得暖色更暖。暖色系通常給人以活潑陽光的感覺,所以常被用到購物、游戲、音樂等主題圖標的主色調配色當中。冷色系,通常給人以冷靜清爽感,科技感和信任感。所以,冷色系通常被用到信用支付、旅游出行、學習、藥房等主題圖標的配色主色調當中。為了不讓所有圖標在一整個界面當中看起來色相混亂或者色相沉悶,通常會用到主色、輔色、點綴色的組合,這三種顏色在單一圖標和圖標所在整體界面視覺效果上都會作相應調整,最終實現一整套圖標主題功能層級和顏色調性的統一。對于圖標背景界面的配色通常會使用色彩純度較弱的或者明度較重的配色方案,來襯托主題圖標的功能和視覺效果。

          (三)手機主題圖標具體的配色方案種類

          當下手機應用UI設計行業里,對于手機APP界面的配色經常會借用到風景油畫或攝影照片的配色方案,因為好看的風景油畫或攝影照片的色彩能讓人心里產生舒服和愉悅的感受,所以手機主題界面的配色規律和繪畫其實是相通的。

          1.單色搭配

          單色搭配是很容易被視覺感受到的。手機APP生日管家的圖標設計,用單一的紅色作底色,上面是簡約的白色蝴蝶結,不僅突出體現了軟件的功能,單色的色彩搭配使用也使得界面更加簡約。鏈家APP的圖標也是采用單色搭配,設計簡潔大方,主題明確。中這兩張圖分別以藍色和綠色作為主色。藍色象征著理性和知性,也象征著誠實、信賴、和堅定。藍色、綠色的視覺形象也能夠讓人放松。所以當我們看到藍、綠這類低明度低純度的冷色系顏色時,我們的心理活動一般會降到一個緩速階段,會使人變得冷靜。我們經常可以在一些諸如搜索引擎、輔助應用軟件的圖標設計中看到藍色、綠色的大量運用。

          2.近似色搭配

          近似色是色相環當中不同色相之間緊鄰的顏色。這種配色方案的優點是色相調性相似,相互不沖突,把其中一種顏色作為主色,和它相鄰的顏色作為輔色,這種近似色的組合能使圖標的調性和諧統一。例如在中,淘寶的手機APP圖標和Garageband的圖標都選擇了相鄰的黃色和橙色進行搭配,相鄰色的組合給受眾以協調舒服的視覺審美感受。

          3.互補色搭配

          主題圖標設計的互補色配色方案是指:確定圖標主色以后,在色相環當中選擇一百八十度角相對的顏色作為輔色搭配,點綴色通常用白色或者近似色。,相機360的圖標以檸檬黃為主色,然后紫羅蘭作為補色,用白色和橙色作為點綴色。騰訊視頻的應用圖標,也是運用了藍色和橙色,形成強烈對比。“色彩的對比度決定色彩的強弱,而補色搭配對比是所有色彩搭配中對比度最強的。”“配色與布局作為影響視覺設計效果的兩個重要因素”,使用互補色的搭配方案時,不能用純度太高,面積相等的互補色搭配,否則會引起色彩的顫動和不穩定性的情況,所以互補色搭配要用面積大小區分主色和輔色,用降低補色純度和增加近似色或者白色來點綴。色相環中補色的組合是視覺沖擊力最強也是眼睛對于顏色長久凝視后自然產生的物理補色需求。所以如果想要自己的作品更引吸引人,那互補色搭配就是一個很好的選擇方案。

          4.雙色漸變搭配

          2013年時開始盛行扁平化設計。“扁平化設計是拋棄多余的設計元素,更強調簡潔的功能界面。”但隨著扁平化的日趨流行,它的弊端也慢慢顯現出來。比如,手機主題圖標界面中圖標的視覺信號過度弱化;圖標信息較難拉開層級關系;圖標缺少獨特個性等,對用戶的視覺吸引力不夠。要想使扁平化設計變得更加生動,加點不一樣的元素,那漸變色就是一個不錯的選擇。糯米手機APP的圖標用了黃色到玫紅色的漸變,WPS的手機APP用了橙色到紅色的漸變,使得簡單的設計變得更加生動。類似這樣,選擇色譜盤上鄰近的顏色進行糅合,產生雙色漸變,這樣整體界面效果絢麗中又不浮夸,運用得當又能為頁面增色不少。簡單、干凈的雙色漸變,賦予簡單的設計活潑有趣的氣息。

          5.輕量漸變搭配

          與雙色漸變色相比,輕量漸變色更加柔和、減少視覺沖突。輕量漸變搭配更適合使用在需要突出產品意識的同時,又需要加入一些活潑的屬性。輕量漸變色彩搭配一般是選用同一顏色的三個色度內的不同深淺的漸變過渡。這種配色方案使視覺感受更清爽活潑。美拍的圖標選用橘色的漸變,FaceU的圖標是選用薄荷綠作了漸變設計,不僅使簡單的設計看起來更有設計感,也產生了一種朦朧美。

          6.彩色投影

          彩色投影也是色彩搭配的一個視覺技巧。以往的投影多使用是灰色或者重顏色,現在另一種更大膽活潑的形式慢慢開始流行,叫作“彩色投影”或者“融入式投影”。這種色彩搭配方式是讓投影的顏色隨投影源的主體色彩改變而改變。使用彩色投影或者融入式投影的好處是能將投影帶來的層次感控制在較好的弱體驗之間,能夠讓投影的主體更好地融入到整體畫面中。分別用橘色和薄荷綠作主色,然后用同樣顏色的不同深淺作投影,都選用與主色相同的投影色,這樣避免了作一些亮色系搭配時,灰色投影顯臟的問題。同時也讓界面及色彩更加突出飽滿。

          結語

          總之,在進行移動端主題圖標設計的時候,要通過差異化色相和同質化飽和度、明度的合理組合,產生協調舒服的審美感官體驗。顏色搭配的好壞與否,會直接影響界面信息的傳達,因此在移動端界面主題圖標設計蓬勃化發展的今天,筆者結合自己在企業和高校工作多年的經驗和相關理論書籍文獻的學習,梳理出以上個人觀點和看法,希望能對移動端圖標設計的理論建設發展貢獻出自己的綿薄之力。

          主站蜘蛛池模板: 国模丽丽啪啪一区二区| 国产精品综合一区二区三区| 无码人妻一区二区三区一| 亚洲电影唐人社一区二区| 亚洲韩国精品无码一区二区三区 | 久久婷婷色一区二区三区| 狠狠综合久久av一区二区| 久久国产精品视频一区| 一区二区三区视频免费观看| 中文字幕在线不卡一区二区| 一区二区三区在线|欧| 久久亚洲国产精品一区二区 | 亚洲av鲁丝一区二区三区| 国产激情无码一区二区三区| 精品视频一区二区观看| 在线观看精品一区| 色一情一乱一伦一区二区三欧美 | 亚洲AV福利天堂一区二区三| 一区二区三区影院| 东京热无码av一区二区| 国产一区二区四区在线观看 | 无码一区二区三区AV免费| 日韩内射美女人妻一区二区三区| 99精品国产高清一区二区三区| 一区二区三区四区视频在线| 乱人伦一区二区三区| 国产日韩精品一区二区在线观看播放 | 国产视频一区二区| 美女福利视频一区二区| 国产成人高清精品一区二区三区| 一区二区精品久久| 国产一区二区三区在线观看精品| 一夲道无码人妻精品一区二区| 熟女性饥渴一区二区三区| 亚洲爆乳精品无码一区二区三区| 国产成人精品一区二区秒拍| 国产在线乱子伦一区二区| 国产在线一区二区杨幂| 日韩制服国产精品一区| 人体内射精一区二区三区| 国产福利酱国产一区二区|