`USERINTERFACE

DESIGN`第一階段圖標作業整理示意UI視覺設計1、自我評估，完成前期圖標的整修工作:(1)不同幾何形體為基礎的圖標尺寸如何修改？（2）如何注意系統成型，細節統一的問題？（3）如何注意圖標的視角，避免混階進行？（4）用好網格規范。2、大廣賽UI圖標12-20個ICON作業（線/面/彩色）進行統一排版。排版請參考例子。3.27交：1.15-20個手繪稿盡量不用軟件制作參考：搜索圖標確定圖標內容1Lineal/Fill/Color線性/面性（剪影）/彩色學生作業，沒有利用好網格，圖標尺寸不一，影響視覺均衡。紅色為應該調整圖標尺寸的標注，紅色圈出來的地方，為每個圖標的最大的范圍學生作業，沒有利用好網格，圖標尺寸不一，影響視覺均衡。紅色為應該調整圖標尺寸的標注，紅色圈出來的地方，為每個圖標的最大的范圍【作業批閱/無利用好網格的示例】3.3PPT【另一些網格規范及圖標示例】網格是為了規范圖標尺寸/線角度服務的應利用好網格規范圖標【圖標icon全體展示】網格是為了規范圖標尺寸/線角度服務的應利用好網格規范圖標【小結】修整圖標時參考【小結】修整圖標時參考【小結】修整圖標時參考注意：除了第一幅以外（紅色外框圈住），其他幾幅的都是“扁平化風格”常見方式Lineal/Fill/ColorLineal/Fill/ColorLineal/

Fill/ColorLineal/Fill/Color線性圖標可以考慮線的多樣式運用如虛線、線段、曲線，甚至是點的輔助。見紅色邊框圈出來處Lineal/Fill/Color由線性轉為面性圖標的時候，不是絕對填充可以融入“陰陽面”的對比，見紅色邊框圈出來處Lineal/

Fill/Color該彩色的圖標，應該是“線面彩色”圖標中仍保留著描邊，且有色彩圖標的上色區域故意右移，與輪廓錯開1px，做了溢色處理，即顏色溢出外輪廓邊緣2Typeset排版【局部排版的示例】【局部排版的示例】【局部排版的示例】【總體排版的示例】【總體排版的示例】按圖標屬性分類按表現形式分類按設計風格分類1、3D：三維立體、有高光、陰影、寫實2、2D：平面圖形、漫畫、插畫【圖】/detail/75999.html/detail/75807.html按圖標屬性分類按表現形式分類按設計風格分類1、3D：三維立體、有高光、陰影、寫實2、2D：平面圖形、漫畫、插畫/work/ZNjI2NDMxNg==.html按圖標屬性分類按表現形式分類按設計風格分類:1、像素2、擬物3、扁平4、手繪按圖標屬性分類按表現形式分類按設計風格分類:1、像素2、擬物3、扁平4、手繪按圖標屬性分類按表現形式分類按設計風格分類:1、像素2、擬物3、扁平：彩色、線性4、手繪ctrl+H切換參考線單色，線性，“線性圖標”單色，塊面，“剪影圖標”雙色，線+面雙色，面+面彩色，面+面平面構成的三要素：點、線、面在icon中的表現形式。描邊的大小2px描邊的大小3px48px*48px剪影圖標、線性圖標常作為“功能圖標”，出現在導航欄或標簽欄里，作為“導航的入口”“導航的入口”，支付寶APP按圖標屬性分類按表現形式分類按設計風格分類:1、像素2、擬物3、扁平4、手繪12級藝術設計何玉婷魅族手機主題設計作業BY小耳朵輕質感，微材質/detail/52177.htmlNeumorphism/

softui新擬態也有人叫同化、軟UI新擬物風格GlassmorphismGlassmorphism這個詞是Glass（玻璃）和Skeumorphism（擬物化）的結合，我們姑且將其稱之為「玻璃擬物化設計」。Malewicz小哥對于這種風格特征歸結為4點：透明：使用帶有模糊磨砂質感背景的透明效果懸浮：帶有明顯懸浮感的多個層級鮮明：使用鮮艷色彩作為強調色并且從半透明層中透出微妙：使用輕薄微妙的邊框來強化物理質感Glassmorphism/glassmorphismIcon圖標素材網站:///阿里巴巴圖標庫-IconPark字節跳動旗下的圖標庫，/official-Iconfinder/ICON設計

基礎流程必看文章1/basic-guide-to-icon-designICON設計

基礎流程必看文章2/ico