像素范兒全能班第二期-課程源文件uikitb

第35課UIKIT

二主講師：牛MO王課程大綱課程簡介主講導(dǎo)師第31

節(jié)牛MO王功能圖標(biāo)能圖標(biāo)設(shè)計原則及規(guī)范，正負形圖標(biāo)第32

節(jié)功能圖標(biāo)二利用矢量工具及圖層樣式設(shè)計扁平功能圖標(biāo)牛MO王第33

節(jié)天氣圖標(biāo)設(shè)計擬物風(fēng)格、扁平風(fēng)格、線性風(fēng)格三種天氣設(shè)計方法及創(chuàng)作思路牛MO王第34

節(jié)UI

Kit

一利用圖層樣式設(shè)計一款 器輕擬物化界面牛MO王第35

節(jié)UI

Kit

二設(shè)計扁平化和磨砂風(fēng)格的Dashboard界面牛MO王第36

節(jié)產(chǎn)品實戰(zhàn)一閃屏頁面、 頁面和登錄頁面的設(shè)計方法及思考牛MO王第37

節(jié)產(chǎn)品實戰(zhàn)二實戰(zhàn)設(shè)計APP社交風(fēng)格方向及原則牛MO王第38

節(jié)產(chǎn)品實戰(zhàn)三實戰(zhàn)設(shè)計APP

、貼吧頁面風(fēng)格方向及原則牛MO王第39

節(jié)產(chǎn)品實戰(zhàn)四實戰(zhàn)設(shè)計APP工具、統(tǒng)計頁面方向及原則牛MO王第40

節(jié)交互動畫實現(xiàn)動效基本原理應(yīng)用技巧及PS簡單的步驟實現(xiàn)的交互動畫牛MO王每天一項技能成果預(yù)覽設(shè)計思路設(shè)計步驟成果展示設(shè)計延展Class35本章總結(jié)整合UIkit成果預(yù)覽設(shè)計思路設(shè)計步驟成果展示設(shè)計延展Class35千萬不要以為UI

kit只有控件的整合。本章總結(jié)UI

kit成果預(yù)覽設(shè)計思路設(shè)計步驟成果展示設(shè)計延展本章總結(jié)Class35UI

kit不僅僅是小控件的合集，也是界面間的合集。UIkit成果預(yù)覽設(shè)計思路設(shè)計步驟成果展示設(shè)計延展Class35把重要的內(nèi)容及類別進行劃分整理。本章總結(jié)UI

kit由于其規(guī)則性和

靈活性，也非常適用于Widget部件設(shè)計。成果預(yù)覽設(shè)計思路設(shè)計步驟成果展示設(shè)計延展Class35本章總結(jié)UIkit成果預(yù)覽設(shè)計思路設(shè)計步驟成果展示設(shè)計延展Class35由于其規(guī)則性和靈活性，也非常適用于Widget部件設(shè)計。本章總結(jié)成果預(yù)覽設(shè)計思路設(shè)計步驟成果展示設(shè)計延展Class35，所以保持英文叫法。DashboardDashboard中文又稱作

，但是容易和汽車其最常用的功能是數(shù)據(jù)圖形可視化和 管理。本章總結(jié)Dashboard的組成成果預(yù)覽設(shè)計思路設(shè)計步驟成果展示設(shè)計延展Class35Dashboard基本上由用戶信息、導(dǎo)航功能、標(biāo)題、圖表展示、功能操作等組成。本章總結(jié)Dashboard的應(yīng)用成果預(yù)覽設(shè)計思路設(shè)計步驟成果展示設(shè)計延展Class35Dashboard大部分應(yīng)用在ipad端和網(wǎng)頁端、電腦端，以簡約明了的方式展現(xiàn)給用戶。本章總結(jié)Dashboard的特點成果預(yù)覽設(shè)計思路設(shè)計步驟成果展示設(shè)計延展Class35Dashboard配色豐富，注重功能性，以視覺展示為主。本章總結(jié)日常生活中的數(shù)據(jù)圖形可視化成果預(yù)覽設(shè)計思路設(shè)計步驟成果展示設(shè)計延展Class35統(tǒng)計平臺文字模塊本章總結(jié)日常生活中的數(shù)據(jù)圖形可視化成果預(yù)覽設(shè)計思路設(shè)計步驟成果展示設(shè)計延展Class35統(tǒng)計平臺數(shù)據(jù)圖模塊本章總結(jié)日常生活中的數(shù)據(jù)圖形可視化成果預(yù)覽設(shè)計思路設(shè)計步驟成果展示設(shè)計延展Class35友盟Android分辨率本章總結(jié)日常生活中的數(shù)據(jù)圖形可視化成果預(yù)覽設(shè)計思路設(shè)計步驟成果展示設(shè)計延展Class35友盟Android設(shè)備統(tǒng)計圖本章總結(jié)扁平化UI

kit設(shè)計思路及要點、Dashboard的設(shè)計思路及要點成果預(yù)覽設(shè)計思路設(shè)計步驟成果展示設(shè)計延展Class本章總結(jié)35國內(nèi)很多Dashboard的設(shè)計并不夠美觀，或者說還不夠重視。注重重要信息的劃分歸類是重要的原則之一合理利用顏色搭配注重信息展示版式布局需合理規(guī)劃扁平化UI

kit設(shè)計思路及要點、Dashboard的設(shè)計思路及要點成果預(yù)覽設(shè)計思路設(shè)計步驟成果展示設(shè)計延展本章總結(jié)Class35收到信息啊，我很認可你的才華，所以需要你為公司設(shè)計一套Dashboard，要求很簡單……風(fēng)格要求：高端大氣上檔次，低調(diào)奢華有內(nèi)涵，奔放洋氣有深度，簡約時尚國際范，用戶信息日期導(dǎo)航全局搜索項目標(biāo)題數(shù)據(jù)圖文字信息功能操作內(nèi)容要有：關(guān)系人列表logo添加Widget等等……扁平化UI

kit設(shè)計思路及要點、Dashboard的設(shè)計思路及要點成果預(yù)覽設(shè)計思路設(shè)計步驟成果展示設(shè)計延展本章總結(jié)Class35分析信息我去年買了個表好的妥妥的風(fēng)格要求：高端大氣上檔次，低調(diào)奢華有內(nèi)涵，奔放洋氣有深度，簡約時尚國際范，用戶信息導(dǎo)航數(shù)據(jù)圖日期全局搜索功能操作內(nèi)容要有：關(guān)系人列表文字信息logo添加Widget項目標(biāo)題等等……扁平化UI

kit設(shè)計思路及要點、Dashboard的設(shè)計思路及要點成果預(yù)覽設(shè)計思路設(shè)計步驟成果展示設(shè)計延展Class35分類信息導(dǎo)航用戶信息日期全局搜索功能操作內(nèi)容要有：關(guān)系人列表logo添加Widget項目標(biāo)題數(shù)據(jù)圖文字信息等等……重要功能分類重點突出信息可以弱化信息本章總結(jié)扁平化UI

kit設(shè)計思路及要點、Dashboard的設(shè)計思路及要點成果預(yù)覽設(shè)計思路設(shè)計步驟成果展示設(shè)計延展Class35規(guī)劃布局本章總結(jié)扁平化UI

kit設(shè)計思路及要點、Dashboard的設(shè)計思路及要點成果預(yù)覽設(shè)計思路設(shè)計步驟成果展示設(shè)計延展Class本章總結(jié)35整理信息logo項目標(biāo)題全局搜索用戶信息導(dǎo)航日期添加Widget

功能操作數(shù)據(jù)圖文字信息 等等……關(guān)系人列表扁平化UI

kit設(shè)計思路及要點、Dashboard的設(shè)計思路及要點成果預(yù)覽設(shè)計思路設(shè)計步驟成果展示設(shè)計延展Class35設(shè)計圖形化本章總結(jié)扁平化UI

kit設(shè)計思路及要點、Dashboard的設(shè)計思路及要點成果預(yù)覽設(shè)計思路設(shè)計步驟成果展示設(shè)計延展Class35注意事項顏色盡可能以黑（不是純黑）白灰為主，其他色彩重要點綴盡可能直角，圓角盡量最好小于10像素，或者絕對圓角字體大小要區(qū)分，同樣活用黑白灰，字體保持簡潔（雅黑、思源、蘭亭黑）本章總結(jié)扁平化UI

kit設(shè)計思路及要點、Dashboard的設(shè)計思路及要點成果預(yù)覽設(shè)計思路設(shè)計步驟成果展示設(shè)計延展Class35記得謙虛你怎么可以這么棒！麻麻生的好你麻麻電話多少？滾本章總結(jié)本章作業(yè)