網易設計大咖帶你3小時玩轉ICON設計
大家好,歡迎大家學習黑馬帶你學設計-3小時玩轉ICON設計的系列課程,本季課程主要講述如何在最短的時間內設計出優秀的ICON。
大家好,歡迎大家學習黑馬帶你學設計-3小時玩轉ICON設計的系列課程,本季課程主要講述如何在最短的時間內設計出優秀的ICON。
1.icon設計
圖示,英文名稱為icon。它起源於拉丁詞 ‘ eikṓn ‘意思是 “likeness, image”。 圖示是全世界最通用的語言。這是一種人人都能理解的語言,不論國籍、種族、年齡或性別。圖示無國界。計算機系統代表圖示的檔案字尾名為.ico。icon是具有明確指代含義的計算機圖形,它具有高度濃縮並快捷傳達資訊、便於記憶的特性。我們狹義的理解icon設計就是計算機互動介面上的圖形,當然廣義上還有交通指示牌等等.
2.icon演變史
icon設計到今天大致經歷了三個時期。在早期的作業系統中,圖形和色彩相對簡單,主要通過簡單的漸變和陰影來繪製互動介面。我們可以看到這張圖就是早期計算機的互動介面。
那個時候的計算機記憶體和CPU的效能和今天都沒辦法比擬,所以人們的審美也受到技術的限制,我們只能設計出這種相對簡陋的icon設計元素,現在看起來相對單調乏味,不過在當時呢,已經算是里程碑式的躍進了。
隨著計算機成像能力的發展,在中期icon設計發展出了以擬物化為風格的介面設計。設計師可以設計出色彩更加豐富細膩,更加真實的icon設計元素。在中期主要以寫實的設計風格為主。讓icon看起來更加生動貼近現實。
到了後期隨著網路的普及但受到頻寬的限制,計算機軟體介面要求能最快時間載入並呈現給使用者,擬物化風格icon顯然載入會很慢並大量消耗流量,人們也看膩了擬物化的icon。根據現實需求,扁平化icon問世了。就是我們現在依然在用的扁平化設計風格。
使用Icon的好處:
●節省空間
一個icon可以代替一個語義,但只佔一個字元位置
●簡潔易懂
比如一個房子,無論各種語言,認不認識,都知道點選帶房子圖示的東西可以到“首頁”。
●易識別
人腦處理圖形的速度很快,也不需要像文字一樣去閱讀,掃一眼就知道,快速理解。通常帶圖示的專案優先順序較高,起著重提示、引導作用。
●增強美感
一套好的設計介面,搭配美觀合理的icon設計對提升視覺體驗非常有幫助。
●建立品牌形象
獨特的視覺語言也是建立品牌形象非常重要的因素,這一點在企業logo和vi系統 的設計上有很好的體現。
3.icon與標誌的區別
icon與標誌的關係是同源關係。可以說icon是被包含在標誌範疇內。標誌一般是企業文化和企業靈魂的高度凝聚。而icon我們泛指是計算機互動介面上的圖形。他們的相同點都是具有明確指代意義的圖形,不同點在於他們的用途和表達方式及風格等都略有差異。看圖例
4.icon的種類
5.icon設計的注意事項
我們在繪製icon的時候也應該遵循形色質三個維度去繪製和考量。首先我們應遵循
形狀統一
在日常設計工作當中我們繪製的icon都是成套出現的,很少會有讓設計師只繪製一個icon。所以我們在繪製icon的時候要保證所有icon的設計風格是高度統一的,看圖例
色彩統一
我們在繪製成套icon的時候要遵循UI設計規範中對顏色的規定。如果是單色的icon,那麼整套icon應該是一個色值,如果是彩色的icon,在顏色的明度和飽和度上也應該保持高度的統一。
風格統一
同樣的道理,我們在繪製成套icon的時候icon的風格必須保持高度統一,不能出現線條寬度不一致,色彩不一致,有線性的塊面甚至是擬物化的icon混雜在一套icon當中,這個是絕對不允許的。
以上內容例項均附視訊教程,點選連結或掃碼即可觀看學習:
ofollow,noindex" target="_blank">https://study.163.com/course/introduction/1006083854.htm