7x24小時咨詢熱線
400-660-3310
當(dāng)前位置 : 好學(xué)校 杭州UI設(shè)計 上海海文IT教育 課程正文
微信掃碼添加老師好友咨詢
上海海文IT教育
認證等級
上海海文IT教育
已獲好學(xué)校V2信譽等級認證
信譽值
與好學(xué)校簽訂讀書保障協(xié)議：
課程詳情
開班信息
校區(qū)地址
學(xué)校相冊
讀書保障
手機預(yù)訂再優(yōu)惠
微信關(guān)注好學(xué)校
報讀課程額外再返現(xiàn)
【教學(xué)目標】
專注于培養(yǎng)企業(yè)需求量大、就業(yè)率高、人才市場緊缺的UI設(shè)計師，成績合格的畢業(yè)生將具備1-2年的設(shè)計實踐工作經(jīng)驗。
【UI從業(yè)方向】
平面廣告設(shè)計師、WUI交互設(shè)計師、 MUI設(shè)計師、多媒體視覺設(shè)計師、包裝/裝幀設(shè)計師、廣告創(chuàng)意策劃、美術(shù)指導(dǎo)
【ui課程特色】
①通過多個實時訓(xùn)練項目來學(xué)習(xí)美術(shù)基礎(chǔ)，掌握軟件的使用方法，同時積累至少1-2年的設(shè)計經(jīng)驗。
②學(xué)習(xí)過程中每天需要完成課堂作業(yè)和課后作業(yè)，每學(xué)完一個專題就配有一個項目實戰(zhàn)（答辯）。邊講邊操作，將累計完成50個以上的設(shè)計實訓(xùn)。
③開設(shè)免費的美術(shù)基礎(chǔ)及藝術(shù)鑒賞課程，包括了素描、水彩、平面構(gòu)成、立體構(gòu)成等內(nèi)容，重點培養(yǎng)設(shè)計思維，幫助設(shè)計師突破作品缺乏創(chuàng)意的職業(yè)發(fā)展瓶頸，成為的設(shè)計師。
【課程內(nèi)容】
階段：UI設(shè)計基礎(chǔ)
| UI設(shè)計基礎(chǔ) |
||||||
| 階段 |
課程明細 |
課程目標 |
案例 |
授課時間 |
||
| 章 |
節(jié) |
知識點 |
||||
| Part 1UI設(shè)計基礎(chǔ) |
入門 |
入門啟蒙 |
UI設(shè)計與職業(yè)發(fā)展 |
UI設(shè)計師能做什么？需要懂什么？我們能學(xué)到什么？本板塊將為你揭開UI設(shè)計神秘的面紗。 |
1課時 |
|
| 審美眼光與頭腦風(fēng)暴 |
||||||
| 課程體系介紹 |
||||||
| 理論概念 |
色彩原理 |
光照現(xiàn)象與色環(huán) |
設(shè)計師，怎能不與色彩打交道？色彩究竟有什么奧秘？為什么不同顏色搭配在一起會給人不同的感覺？本節(jié)內(nèi)容將為你揭曉。 |
0.5天 |
||
| 色彩三要素 |
||||||
| 對比色與互補色 |
||||||
| 色彩搭配技巧 |
||||||
| 軟件相關(guān)原理 |
RGB與CMYK |
什么是四色印刷？為什么圖片會出現(xiàn)馬賽克？為什么會有色差？如何**圖片輸出的質(zhì)量？本節(jié)內(nèi)容將幫助你揭開謎團。 |
||||
| 矢量圖與位圖 |
||||||
| 有損壓縮與無損壓縮 |
||||||
| 存儲格式解析 |
||||||
| 企業(yè)CIS |
CI、BI、MI、VI |
本節(jié)內(nèi)容講闡述企業(yè)CIS及其架構(gòu)。 |
1課時 |
|||
| VI基本系統(tǒng) |
||||||
| VI應(yīng)用系統(tǒng) |
||||||
| 三大構(gòu)成 |
平面構(gòu)成 |
設(shè)計三大構(gòu)成，設(shè)計師必須懂的基礎(chǔ)理論。 |
1.點、線、面的構(gòu)成圖設(shè)計。2.色彩主題設(shè)計 （4個）。3.根據(jù)命題進行構(gòu)成設(shè)計。 |
1天 |
||
| 色彩構(gòu)成 |
||||||
| 立體構(gòu)成 |
||||||
| 鑒賞 |
中國風(fēng)賞析 |
作為一名設(shè)計師，擁有一定的想法和審美眼光非常重要，一些設(shè)計方面的經(jīng)驗技巧也會讓你事半功倍。本節(jié)課程不容錯過。 |
Photoshop打造中國風(fēng)水墨荷花小品。 |
1天 |
||
| 品牌設(shè)計賞析 |
Adobe Illustrator打造日式小清新田園風(fēng)格海報。 |
|||||
| 實用設(shè)計技巧分享 |
快速排版技巧訓(xùn)練。 |
|||||
| 貫穿內(nèi)容 |
每天學(xué)一點設(shè)計心理學(xué) |
人如何觀察 |
你以為設(shè)計師只需要會軟件會做圖？拜托！那可是美工干的事兒。設(shè)計師可沒有那么簡單呢。要知道，用戶體驗是互聯(lián)網(wǎng)產(chǎn)品的核心。再美的界面，如果頻頻被用戶吐槽不易用，也是失敗的。此板塊會深入淺出的講解設(shè)計相關(guān)的心理學(xué)知識。 |
每天講5條，（45分鐘左右 ）一共100條。 |
||
| 人如何閱讀 |
||||||
| 人如何記憶 |
||||||
| 人如何思考 |
||||||
| 人如何集中注意力 |
||||||
| 人的動機來源 |
||||||
| 人是社會性動物 |
||||||
| 人如何感知 |
||||||
| 人會犯錯 |
||||||
| 人如何決策 |
||||||
| 美術(shù)基礎(chǔ) |
光影與明暗 |
少量插入一些手繪內(nèi)容，貼合就業(yè)實際，讓學(xué)生學(xué)以致用。如果感興趣的同學(xué)可以回家畫一些手繪作品，私下與我交流。 |
利用光影質(zhì)感手繪游戲圖標：皇冠，寶劍，禮物盒，漂流瓶。 |
每周五下午15:30-17:30 |
||
| 透視解析 |
根據(jù)透視原理手繪游戲圖標：寶箱，魔法書，糖果。 |
|||||
| 中國設(shè)計史和西方設(shè)計史 |
①中國風(fēng)裝飾圖案手繪；②Art Nouveau風(fēng)格裝飾圖案手繪。 |
|||||
| 近現(xiàn)代設(shè)計與當(dāng)代設(shè)計 |
速寫的基本技法及場景繪制。 |
|||||
| Photoshop |
初識PS |
Photoshop概述 |
通過大量案例，讓學(xué)生掌握軟件的基本操作。 |
1課時 |
||
| 界面介紹及工作環(huán)境 |
||||||
| 基本操作及功能 |
||||||
| 圖像處理 |
圖層與摳圖 |
①選框、魔棒、套索等工具摳圖——簡單清晰輪廓；②鋼筆工具摳圖——清晰輪廓；③通道摳圖法——透明輪廓；④混合剪貼法——復(fù)雜輪廓。 |
2天 |
|||
| 修圖 |
①風(fēng)景修圖：②人像修圖：③一寸正裝證件照制作。④表情包制作。 |
|||||
| 濾鏡 |
①手繪插畫效果；②質(zhì)感塑料包裝；③朦朧夢幻效果；④將模糊圖片變清晰。 |
|||||
| 畫筆工具 |
①晴天變雨天；②給人物添加胡須、修復(fù)禿頂、補充毛發(fā)；③水下攝影中的氣泡；④筆刷的創(chuàng)建。 |
|||||
| 海報 |
簡易圖文海報 |
食品類活動促銷圖設(shè)計（不同尺寸、不同應(yīng)用環(huán)境）。 |
3天 |
|||
| 復(fù)雜海報+標題字體設(shè)計 |
①打造企業(yè)文化宣傳海報——超越夢想，飛得更高；②打造奇幻風(fēng)格絢麗電影海報——潘多拉魔盒。 |
|||||
| 個性界面 |
質(zhì)感設(shè)計 |
音量調(diào)節(jié)。 |
2天 |
|||
| 游戲界面設(shè)計 |
手機彈鋼琴游戲界面。 |
|||||
| 古風(fēng)游戲界面：水墨質(zhì)感游戲道具購買頁面。 |
||||||
| 屏保設(shè)計 |
桃花主題手機屏保。 |
|||||
| Illustrator |
初識AI |
Illustrator概述 |
通過大量案例，讓學(xué)生掌握軟件的基本操作。 |
1課時 |
||
| 界面介紹及工作環(huán)境 |
||||||
| 基本操作及功能 |
||||||
| 矢量繪制 |
圖形的繪制，圖形次序、加減法及漸變 |
①微信，安卓，微博圖標。②金魚。③地鐵愛心專座。④扁平化風(fēng)景。 |
3天 |
|||
| 鋼筆工具與鉛筆工具 |
絲帶設(shè)計。 |
|||||
| 扁平化設(shè)計 |
①矢量圖形元素的繪制：T恤，背心，襯衫，POLO衫，領(lǐng)帶，牛仔褲，連衣裙，半裙，包包，單鞋；②扁平化人物頭像設(shè)計。 |
|||||
| 字體設(shè)計 |
中英文字體的設(shè)計 |
進行中文單字、詞語、英文單詞的字體設(shè)計。 |
1天 |
|||
| 字體組合設(shè)計 |
中英文字體的組合設(shè)計。 |
|||||
| VI設(shè)計 |
LOGO設(shè)計 |
①中文字的LOGO；②英文LOGO；③圖文結(jié)合的LOGO； ④為班級或自己設(shè)計一個LOGO。 |
||||
| 名片設(shè)計 |
①橫版名片；②豎版名片；③異形/特殊名片； |
|||||
| 平面設(shè)計 |
海報設(shè)計 |
①海報設(shè)計：端午購物季；②海報設(shè)計：New arrivals新品上市；③多文字的海報排版：2017新年微信抽獎活動設(shè)計。 |
3天 |
|||
| 包裝設(shè)計 |
①手提紙袋設(shè)計：②餅干盒外包裝設(shè)計。 |
|||||
| InDesign |
軟件操作 |
界面介紹及工作環(huán)境 |
通過大量案例，讓學(xué)生掌握軟件的基本操作。 |
①設(shè)計排版一本手冊；②簡單的電子雜志設(shè)計。 |
1天 |
|
| 基本操作及功能 |
||||||
| 鏈接及導(dǎo)出 |
||||||
| 排版設(shè)計 |
畫冊雜志排版賞析 |
|||||
| 電子雜志的排版設(shè)計 |
||||||
| 綜合運用 |
原畫設(shè)計 |
人物繪制 |
結(jié)合學(xué)過的軟件知識進行設(shè)計。 |
AI繪制矢量人物比例及動態(tài)。 |
3天 |
|
| 游戲角色繪制 |
PS畫筆工具繪制毛絨質(zhì)感的憤怒的小鳥。 |
|||||
| 動漫形象繪制 |
AI繪制卡通動漫男女主角。 |
|||||
| 櫥窗設(shè)計 |
商場陳列與櫥窗 |
利用學(xué)過的知識創(chuàng)建一個基本的櫥窗結(jié)構(gòu)。 |
||||
| 櫥窗方案設(shè)計 |
根據(jù)命題設(shè)計自己的櫥窗氛圍，包括模特，道具，宣傳畫。 |
|||||
| 階段項目 |
1.讓學(xué)生擬定一個屬于自己的品牌，設(shè)計整個品牌的VI視覺系統(tǒng)——包括LOGO，字體規(guī)范，名片，信封，邀請函，企業(yè)宣傳冊（手冊或者折頁），并印刷打樣；2.讓學(xué)生制作屬于自己的作品集（封面封底和內(nèi)頁排版設(shè)計）。 |
1天 |
||||
| 本階段課程詣在教會學(xué)生使用Photoshop、Illustrator、Indesign這些設(shè)計軟件，并啟發(fā)學(xué)生的創(chuàng)新思維。 |
22天 |
第二階段：web前端
| 章 |
節(jié) |
知識點 |
授課時間（天） |
課程目標 |
|
| 章 |
HTML |
HTML介紹 |
HTML介紹 |
2.0 |
掌握Html靜態(tài)頁面技術(shù)熟悉CSS技術(shù)掌握DIV+CSS布局使用w3c標準書寫 |
| HTML結(jié)構(gòu) |
HTML結(jié)構(gòu) |
||||
| HTML常用標簽 |
HTML常用標簽 |
||||
| HTML表格 |
HTML表格 |
||||
| HTML多媒體 |
HTML多媒體 |
||||
| 第二章 |
CSS基礎(chǔ)及進階實戰(zhàn) |
CSS簡介 |
CSS簡介 |
3.0 |
|
| CSS的基本使用 |
CSS的基本使用 |
||||
| CSS選擇器 |
CSS選擇器 |
||||
| CSS常用樣式屬性的設(shè)置 |
CSS常用樣式屬性的設(shè)置-1 |
||||
| CSS常用樣式屬性的設(shè)置-2 |
|||||
| CSS定位與DIV布局 |
盒子模型和元素定位 |
2.0 |
|||
| DIV+CSS布局實戰(zhàn)-1 |
|||||
| DIV+CSS布局實戰(zhàn)-2 |
|||||
| photoshop切圖 |
photoshop切圖配合 |
1.0 |
|||
| 課程案例：彩妝熱賣產(chǎn)品列表天貓美容產(chǎn)品熱點水晶風(fēng)格純代碼按紐中國風(fēng)荷塘月色信箋海文網(wǎng)站導(dǎo)航相冊列表新品游戲頁面制作商品圖片列表課程項目：海文網(wǎng)站 |
第三階段：WUI設(shè)計（網(wǎng)頁交互設(shè)計）
| 章 |
節(jié) |
知識點 |
授課時間（天） |
課程目標 |
||
| 章WUI |
了解網(wǎng)頁UI |
網(wǎng)站類型 |
門戶類網(wǎng)站 |
1 |
掌握網(wǎng)站的基本元素設(shè)計，并能設(shè)計出企業(yè)類、電商類、專題頁網(wǎng)站 |
|
| 企業(yè)類網(wǎng)站 |
||||||
| 營銷型網(wǎng)站 |
||||||
| 電商網(wǎng)站 |
||||||
| 個人網(wǎng)站 |
||||||
| 網(wǎng)頁UI的設(shè)計要點 |
設(shè)計與技術(shù)結(jié)合 |
|||||
| 立體空間節(jié)奏感 |
||||||
| 視覺導(dǎo)向性 |
||||||
| 網(wǎng)站基本元素設(shè)計 |
網(wǎng)頁圖標 |
圖標的概念 |
||||
| 網(wǎng)頁圖標的應(yīng)用 |
||||||
| 課程案例：1.制作簡約風(fēng)格網(wǎng)頁圖標2.設(shè)計按鈕圖標工具欄 |
||||||
| 導(dǎo)航的概述 |
網(wǎng)站導(dǎo)航的定義 |
1 |
||||
| 網(wǎng)站導(dǎo)航的表現(xiàn)形式 |
||||||
| 網(wǎng)站導(dǎo)航的視覺風(fēng)格 |
||||||
| 課程案例： 1.游戲網(wǎng)站導(dǎo)航2.企業(yè)網(wǎng)站導(dǎo)航3.下拉網(wǎng)站導(dǎo)航4.垂直網(wǎng)站導(dǎo)航 |
||||||
| 網(wǎng)頁的文字與廣告設(shè)計 |
文字在網(wǎng)頁界面中的作用 |
1 |
||||
| 網(wǎng)頁界面中文字設(shè)計的要求 |
||||||
| 文字的設(shè)計原則 |
||||||
| 網(wǎng)頁界面文字的排版設(shè)計 |
||||||
| 圖文結(jié)合 |
||||||
| 課程案例： 1.電商廣告banner設(shè)計2.男士皮包電商banner設(shè)計3.女鞋電商banner設(shè)計 |
||||||
| 網(wǎng)頁版式 |
網(wǎng)頁布局與版式設(shè)計 |
了解網(wǎng)頁布局 |
2 |
|||
| 網(wǎng)頁布局方式 |
||||||
| 課程案例：衛(wèi)浴網(wǎng)站 課程項目：企業(yè)型網(wǎng)站 |
||||||
| 網(wǎng)頁配色 |
網(wǎng)頁UI配色 |
認識色彩 |
1 |
|||
| 色彩搭配 |
||||||
| 網(wǎng)頁UI的配色方法 |
||||||
| 網(wǎng)頁元素的色彩搭配 |
||||||
| 網(wǎng)頁配色常見的問題 |
||||||
| 專題類 |
設(shè)計企業(yè)專題類網(wǎng)站 |
設(shè)計分析 |
1 |
|||
| 企業(yè)專題類網(wǎng)站頁面 |
||||||
| 課程案例：企業(yè)專題頁設(shè)計 |
||||||
| 設(shè)計電商專題類網(wǎng)站 |
設(shè)計分析 |
1 |
||||
| 設(shè)計電商專題類網(wǎng)站頁面 |
||||||
| 課程案例：電商專題頁設(shè)計 |
||||||
| 課程項目： 原創(chuàng)一套網(wǎng)站界面 |
||||||
| 原創(chuàng) |
網(wǎng)站界面 |
1.企業(yè)類網(wǎng)站 |
2 |
原創(chuàng)項目 |
||
| 2.電商類網(wǎng)站 |
||||||
| 3.專題類網(wǎng)站 |
||||||
| 第二章Flash |
入門篇 |
flash軟件全接觸 |
使用和程序安裝 |
1 |
通過學(xué)習(xí)，能制作flash網(wǎng)頁小動畫，深入了解關(guān)鍵幀與普通幀的概念，以及傳統(tǒng)補間與補間動畫的區(qū)別 |
|
| 文檔的基礎(chǔ)操作 |
||||||
| 設(shè)置工作環(huán)境 |
||||||
| 設(shè)置舞臺屬性 |
||||||
| 調(diào)整面板并新建工作區(qū) |
||||||
| 工具的使用 |
||||||
| “時間軸”面板 |
時間軸面板的介紹 |
|||||
| 認識圖層 |
||||||
| 幀 |
||||||
| 幀的基本操作 |
||||||
| 基本圖像的繪制 |
快速繪制基本圖形 |
矩形工具和基本矩形工具 |
||||
| 橢圓工具和基本橢圓工作 |
||||||
| 基本動畫制作 |
逐幀動畫 |
逐幀動畫的制作 |
||||
| 傳統(tǒng)補間動畫 |
傳統(tǒng)補間動畫制作 |
|||||
| 補間形狀 |
補間形狀動畫制作 |
|||||
| 課堂案例： 1.開場動畫效果2.照相機閃光動畫效果3.信紙抽出信封動畫效果4.進度條效果制作5.小熊滑冰6.飛舞的彩球動畫7.飛入動畫8.變形動畫 |
||||||
| 動畫制作 |
遮罩動畫 |
遮罩層動畫的制作 |
1 |
熟練掌握元件和動畫的使用 |
||
| 添加引導(dǎo)層動畫 |
引導(dǎo)層動畫制作 |
|||||
| 課堂案例： 1.汽車閃光效果2.黑白文字移動3.駭客帝國文字4.卷軸效果5.放大鏡效果6.汽車行駛 7.飛機飛行動畫8.書本打開動畫 |
||||||
| 元件的應(yīng)用 |
圖形元件 |
|||||
| 按鈕元件 |
||||||
| 影片剪輯元件 |
||||||
| 第三章AE動效 |
了解AE |
AE的軟件 |
項目與偏好設(shè)置 |
2 |
通過學(xué)習(xí)AE，制作出手機的動效展示 |
|
| 工作區(qū)域的操作 |
||||||
| 導(dǎo)入PSD分層文件 |
||||||
| 輸出影片 |
||||||
| 工具的使用 |
||||||
| 課程案例： 1.圖片移動切換2.圖標小動畫3.UI圖標展示4.APP展示 |
||||||
第四階段：MUI設(shè)計（移動端APP界面設(shè)計）
| 章 |
節(jié) |
知識點 |
授課時間（天） |
課程目標 |
|
| 階段 圖標設(shè)計 |
圖標入門 |
圖標認識 |
什么是圖標 |
1.0 |
通過學(xué)習(xí)兩個平臺圖標的設(shè)計規(guī)范從而達到圖標的視覺統(tǒng)一 |
| 圖標與標識的區(qū)別 |
|||||
| 常見的移動應(yīng)用圖標 |
|||||
| 圖標規(guī)范 |
iOS圖標的規(guī)范 |
||||
| Android圖標規(guī)范 |
|||||
| 圖標的設(shè)計要素 |
APP圖標 |
圖標的特點 |
|||
| 圖標的設(shè)計流程 |
|||||
| APP圖標的設(shè)計方法 |
|||||
| 基礎(chǔ)圖形 |
圓形圖標的繪制 |
||||
| 方形圖標的繪制 |
|||||
| 圓角矩形圖標的繪制 |
|||||
| 組合圖形的繪制 |
|||||
| 圖標結(jié)構(gòu) |
圖標型的把握 |
1.0 |
通過學(xué)習(xí)一些基本圖形的繪制來掌握簡單圖標的繪制方法 |
||
| 圖標的大小以及設(shè)計規(guī)范 |
|||||
| 透視、光源以及陰影 |
|||||
| 元素的組合 |
|||||
| 視覺的均衡 |
|||||
| 2D圖標 |
線性圖標 |
||||
| 剪影圖標 |
|||||
| 課程案例： 一套功能圖標 |
|||||
| 圖標設(shè)計原則 |
圖標設(shè)計原則 |
可識別性原則 |
1.0 |
通過學(xué)習(xí)讓學(xué)生了解圖標的可識別、差異性、一致性等一系列的設(shè)計原則。讓學(xué)生熟練掌握扁平化風(fēng)格圖標的繪制方法 |
|
| 差異性原則 |
|||||
| 風(fēng)格統(tǒng)一性原則 |
|||||
| 原創(chuàng)性原則 |
|||||
| 圖標創(chuàng)意 |
圖標創(chuàng)意 |
界面需求 |
|||
| 圖標的創(chuàng)意元素 |
|||||
| 創(chuàng)意圖標的特點 |
|||||
| 圖標設(shè)計與軟件操作 |
扁平化圖標 |
圖層樣式的運用 |
|||
| 圖標設(shè)計方法及技巧 |
|||||
| 扁平化圖標的繪制 |
|||||
| 課程案例： 一套扁平化風(fēng)格圖標 |
|||||
| 質(zhì)感圖標設(shè)計 |
立體透明圖標的繪制技巧 |
1.0 |
通過學(xué)習(xí)圖層樣式來了解擬物圖標的繪制技巧 |
||
| 毛絨圖標的繪制技巧 |
|||||
| 3D圖標 |
繪制3D圖標技巧 |
||||
| 寫實圖標 |
金屬質(zhì)感的繪制技巧 |
1.0 |
|||
| 逼真食物圖標的繪制技巧 |
|||||
| 課程案例 |
1.無字表圖標 |
||||
| 2.開關(guān)按鈕圖標 |
|||||
| 3.相機圖標 |
|||||
| 4.ps藥丸圖標 |
|||||
| 5.金屬日歷圖標 |
|||||
| 6.透明圖標 |
|||||
| 7.金屬圖標 |
|||||
| 8.毛絨圖標 |
|||||
| 9.透視圖標 |
|||||
| 10.播放器制作 |
|||||
| 項目案例 |
1.啟動圖標設(shè)計 |
||||
| 2.中國風(fēng)手機主題 |
|||||
| 3.扁平化手機主題 |
|||||
| 4.擬物化手機主題 |
|||||
| 第二階段APP設(shè)計 |
初識APP |
APP的概念 |
什么是APP |
3.0 |
分別從iOS、Android、Windows移動設(shè)備的三大主流系統(tǒng)軟件來設(shè)計移動應(yīng)用 |
| APP的開發(fā)流程 |
APP的開發(fā)流程 |
||||
| 常見的手機操作系統(tǒng) |
主流操作系統(tǒng) |
||||
| APP設(shè)計要點 |
設(shè)計要點 |
||||
| 移動UI的經(jīng)典案例 |
移動UI經(jīng)典案例 |
||||
| 智能手機的屏幕 |
手機規(guī)格 |
英寸 |
|||
| 像素 |
|||||
| 分辨率 |
|||||
| 移動三大主流平臺基本原則 |
iOS平臺和設(shè)計的基本原則 |
iOS屏幕分辨率 |
|||
| iOS設(shè)計尺寸 |
|||||
| Android平臺和設(shè)計的基本原則 |
Android屏幕分辨率 |
||||
| Android設(shè)計尺寸 |
|||||
| Windows平臺和設(shè)計的基本原則 |
Windows屏幕分辨率 |
||||
| Windows設(shè)計尺寸 |
|||||
| 課程案例： iOS手機界面扁平化風(fēng)格制作 |
|||||
| 兩大平臺之間的區(qū)別 |
導(dǎo)航機制 |
硬件特性 |
1.0 |
通過學(xué)習(xí)了解iOS與Android之間的差異方式，來熟悉不同平臺的設(shè)計方式 |
|
| iOS導(dǎo)航 |
|||||
| Android導(dǎo)航 |
|||||
| 界面布局 |
兩大平臺間結(jié)構(gòu)差異 |
||||
| 方式不同 |
推送方式 |
||||
| 通知方式 |
|||||
| 操作方式 |
|||||
| 文字規(guī)范 |
文字規(guī)范 |
iOS系統(tǒng)文字規(guī)范 |
|||
| Android系統(tǒng)文字規(guī)范 |
|||||
| 課程案例： Android手機界面扁平化風(fēng)格制作 |
|||||
| 設(shè)計要點 |
風(fēng)格 |
什么是設(shè)計風(fēng)格 |
1.0 |
熟悉確定設(shè)計風(fēng)格以及配色方式 |
|
| 如何確立設(shè)計風(fēng)格 |
|||||
| 顏色 |
認識色彩 |
||||
| 顏色搭配基礎(chǔ) |
|||||
| 常見APP顏色 |
|||||
| 顏色的性格 |
|||||
| 界面設(shè)計 |
導(dǎo)航設(shè)計 |
扁平導(dǎo)航 |
1.0 |
通過學(xué)習(xí)分析導(dǎo)航、界面布局、和操作方式等來更加規(guī)范的設(shè)計移動應(yīng)用 |
|
| 列表式導(dǎo)航 |
|||||
| 其他導(dǎo)航 |
|||||
| 首頁設(shè)計 |
搜索欄 |
||||
| 標簽欄 |
|||||
| 卡片式設(shè)計 |
|||||
| 樓層設(shè)計 |
|||||
| 詳情頁設(shè)計 |
消息列表 |
1.0 |
|||
| 瀑布流 |
|||||
| 個人中心 |
頭像區(qū)域 |
||||
| 個人信息 |
|||||
| 啟動頁 |
品牌宣傳類 |
||||
| 首頁樣式類 |
|||||
| 情感故事類 |
|||||
| 節(jié)日氣氛類 |
|||||
| 引導(dǎo)頁 |
功能說明類 |
1.0 |
|||
| 使用說明類 |
|||||
| 情感故事類 |
|||||
| 課程案例 |
1.手機時鐘設(shè)置界面 |
||||
| 2.手機音樂應(yīng)用界面 |
|||||
| 3.手機天氣應(yīng)用界面 |
|||||
| 4.平板主題界面設(shè)計 |
|||||
| 5.安卓系統(tǒng)主題界面設(shè)計 |
|||||
| 設(shè)計適配 |
iOS系統(tǒng) |
iOS系統(tǒng)適配方法 |
1.0 |
通過學(xué)習(xí)，熟悉眾多尺寸的一個設(shè)計規(guī)格，并通過一定的比例換算去適應(yīng)不同分辨率的需求以及適配 |
|
| Android系統(tǒng) |
Android系統(tǒng)適配方法 |
||||
| 標注設(shè)計 |
標注設(shè)計 |
標注方法 |
|||
| 切圖 |
點九圖 |
什么是點九圖 |
|||
| 如何制作點九圖 |
|||||
| 界面切圖 |
界面切圖 |
||||
| 圖標切圖 |
|||||
| 命名規(guī)則 |
|||||
| 第三階段交互設(shè)計 |
原型APP |
原型設(shè)計 |
什么是原型設(shè)計 |
1.0 |
通過學(xué)習(xí)，了解Axure |
| 原型設(shè)計工具 |
|||||
| Axure基礎(chǔ)交互 |
了解Axure |
工作界面 |
|||
| Axure文件格式 |
|||||
| 團隊項目 |
|||||
| 工作環(huán)境 |
|||||
| 自定義工作區(qū) |
|||||
| 站點地圖 |
|||||
| 部件操作 |
部件概述 |
||||
| 部件操作 |
|||||
| 頁面樣式 |
|||||
| 交互基礎(chǔ) |
事件 |
||||
| 用例 |
|||||
| 動作 |
|||||
| 課程案例： 登錄低保真原型的登錄 |
|||||
| 母版操作 |
母版基礎(chǔ) |
1.0 |
通過學(xué)習(xí)，熟悉Axure的一些基礎(chǔ)交互，并能設(shè)計出低保真原型圖 |
||
| 使用母版 |
|||||
| 動態(tài)面板應(yīng)用 |
狀態(tài)改變時 |
||||
| 拖動時 |
|||||
| 滾動時 |
|||||
| 改變大小時 |
|||||
| 載入時 |
|||||
| 流程圖 |
流程圖概述 |
||||
| 創(chuàng)建流程圖 |
|||||
| 生成流程圖 |
|||||
| 課程案例 |
1.“百度”登錄原型設(shè)計 |
||||
| 2.“大眾點評”打分效果 |
|||||
| 3.淘寶首頁幻燈 |
|||||
| Axure交互 |
條件邏輯 |
條件邏輯概述 |
2.0 |
通過一些條件和邏輯判斷設(shè)計出一些高保真原型圖 |
|
| 交互和條件邏輯概述 |
|||||
| 多條件用例 |
|||||
| 設(shè)置部件值 |
|||||
| 變量 |
變量概述 |
||||
| 創(chuàng)建和設(shè)置變量值 |
|||||
| 使用變量值 |
|||||
| 全局、局部變量的使用 |
|||||
| 課程案例 |
1.登錄列表頁面跳轉(zhuǎn) |
||||
| 2.全局變量在不同頁面間與動態(tài)面板的交互 |
|||||
| 觸發(fā)事件 |
觸發(fā)事件 |
1.0 |
熟悉交互事件、邏輯判斷 |
||
| 交互條件 |
新建、刪除條件和條件之間的關(guān)系 |
||||
| 條件設(shè)置 |
|||||
| 交互條件應(yīng)用 |
|||||
| 切換用戶 |
|||||
| 用戶界面文檔規(guī)范 |
規(guī)范文檔 |
規(guī)范文檔的概述 |
1.0 |
用戶界面的文檔規(guī)范 |
|
| Axure規(guī)范文檔 |
|||||
| 生成器和輸出文件 |
生成器和輸出文件 |
||||
| 部件注釋 |
自定義注釋集合 |
||||
| 添加注釋 |
|||||
| 多部件添加、編輯、刪除注釋 |
|||||
| 頁面注釋 |
自定義頁面注釋字段 |
||||
| 頁面注釋 |
|||||
| 生成規(guī)范文檔 |
配置一個或多個部件表 |
||||
| 配置布局 |
|||||
| 課程案例 |
電商原型設(shè)計 |
||||
| 1.登錄功能的實現(xiàn) |
|||||
| 2.首頁基本布局 |
|||||
| 3.制作菜單效果 |
|||||
| 4.制作幻燈片輪播效果 |
|||||
| 5.制作搜索欄隨滾動條上下滾動效果 |
|||||
| APP微信高保真原型設(shè)計 |
|||||
| 1.微信登錄功能 |
|||||
| 2.軟件進入動畫效果 |
|||||
| 3.導(dǎo)航菜單切換效果 |
|||||
| 4.給好友發(fā)送聊天內(nèi)容 |
|||||
| 5.上下拖動微信頁面內(nèi)容 |
|||||
| 6.顯示隱藏按鈕的下拉菜單 |
|||||
| 項目實戰(zhàn) |
項目實戰(zhàn)（一） |
題材 |
掌握企業(yè)項目實戰(zhàn)的流程和技術(shù) |
||
| 1.美食類低保真原型設(shè)計 |
五選一 |
||||
| 2.旅游類低保真原型設(shè)計 |
|||||
| 3.新聞類低保真原型設(shè)計 |
|||||
| 4.音樂類低保真原型設(shè)計 |
|||||
| 5.社交類低保真原型設(shè)計 |
|||||
| 通過原型設(shè)計成相對應(yīng)的一套視覺設(shè)計稿 |
|||||
| 項目實戰(zhàn)（二） |
題材 |
||||
| 自己設(shè)計一款A(yù)PP(類型不限，盡量選取你所傾向的行業(yè)) |
|||||
| 1.用戶調(diào)研 |
|||||
| 2.設(shè)計低保真原型 |
|||||
| 3.交互文檔 |
|||||
| 4.通過原型設(shè)計成相對應(yīng)的一套視覺設(shè)計稿 |
|||||
| 5.設(shè)計規(guī)范文檔 |
|||||
| 項目實戰(zhàn)（三） |
一套手機主題（icon圖標） |
||||
| 項目實戰(zhàn)（四） |
設(shè)計一套企業(yè)網(wǎng)站 |
||||
| 項目實戰(zhàn)（五） |
作品集設(shè)計 |
贈送課程：素描和手繪
| 素描和手繪 |
||||||
| 階段 |
課程明細 |
內(nèi)容簡介 |
培訓(xùn)目標 |
案例 |
||
| 章 |
節(jié) |
知識點 |
||||
| Part 1美術(shù)基礎(chǔ)及藝術(shù)鑒賞 |
章素描 |
1.1 素描基礎(chǔ) |
1.1.1 認識素描 |
素描的定義，素描的形式，以及我們學(xué)習(xí)素描的意義。 |
通過素描的訓(xùn)練，可以提高學(xué)生觀察、理解和認識事物本身的能力，培養(yǎng)學(xué)生準確概括和整體描繪對象的能力。 |
|
| 1.1.2 素描的表現(xiàn)形式 |
世界知名美術(shù)大師素描作品欣賞。 |
|||||
| 1.1.3 素描進階 |
繪畫中點、線、面的構(gòu)成原理及繪畫工具的認識和使用。 |
|||||
| 1.1.4 素描線條 |
線條在繪畫作品中的應(yīng)用技巧。 |
進行線條手繪的訓(xùn)練。 |
||||
| 1.1.4 素描欣賞 |
世界知名美術(shù)大師素描作品欣賞。 |
欣賞。 |
||||
| 1.2 素描關(guān)系 |
1.2.1 光照現(xiàn)象 |
分析光的強弱、角度、位置和衰減等各種因素可能造成光影的不同變化。 |
培養(yǎng)學(xué)生對透視原理的掌握，理解近大遠小，近高遠低的規(guī)律。在今后的設(shè)計創(chuàng)作過程中正確運用透視關(guān)系，塑造正確的三維空間。 |
|||
| 1.2.2 光影解析 |
了解光源照射物體時的明暗變化以及層次關(guān)系，提高空間表現(xiàn)能力。 |
讓學(xué)生進行光影的分析。 |
||||
| 1.2.3 構(gòu)圖與虛實 |
實例解析矩形構(gòu)圖、三角形構(gòu)圖、S形構(gòu)圖及斜線構(gòu)圖四種繪畫構(gòu)圖和平行透視、成角透視兩種繪畫透視。 |
|||||
| 1.2.4 比例關(guān)系 |
重點學(xué)習(xí)形式美法則。 |
繪制透視圖。 |
||||
| 1.3 速寫訓(xùn)練 |
1.3.1 速寫的基本知識 |
講解速寫的基礎(chǔ)及繪畫方法。 |
通過對結(jié)構(gòu)的理解和把握，用簡潔的線條的繪制對象。 |
|||
| 1.3.2 風(fēng)景速寫 |
風(fēng)景速寫作品的欣賞以及臨摹。 |
臨摹風(fēng)景速寫作品。 |
||||
| 1.3.3 人物速寫 |
人物速寫作品的欣賞以及臨摹。 |
臨摹人物速寫作品。 |
||||
| 1.4 素描臨摹 |
1.4.1 素描石膏體 |
臨摹球體，圓柱體，立方體。 |
掌握形體塑造的基本技能，用結(jié)構(gòu)和明暗關(guān)系科學(xué)的描繪對象。 |
臨摹球體，圓柱體，立方體。 |
||
| 1.4.2 素描石膏像 |
臨摹石膏像。 |
臨摹石膏像（2個）。 |
||||
| 1.4.3 素描靜物 |
臨摹水果、瓷器、襯布等靜物。 |
臨摹水果、瓷器、襯布等靜物。 |
||||
| 1.4.4 素描人物 |
臨摹兒童與老者的人物肖像。 |
臨摹兒童與老者的人物肖像。 |
||||
| 第二章色彩 |
2.1 色彩原理 |
2.1.1 三原色 |
光的三原色是紅 、綠和藍，而色料的三原色是紅、黃和藍。 |
學(xué)習(xí)色彩的目的是讓學(xué)生學(xué)會用顏色塑造形體、結(jié)構(gòu)、空間、光感、質(zhì)感。學(xué)會用自己的眼睛和心靈去感受和捕捉大自然中瞬息萬變的色彩，鍛煉敏銳的觀察力和生動的表達能力。 |
||
| 2.1.2 冷色與暖色 |
講述冷色與暖色的概念及應(yīng)用。 |
|||||
| 2.2.1 對比色與互補色 |
講述對比色與互補色的概念及應(yīng)用。 |
|||||
| 2.2.2 色相、飽和度與明度 |
色相、飽和度與明度的概念及應(yīng)用。 |
|||||
| 2.2.3 色彩漸變與視覺錯覺 |
的視覺錯覺圖的解析。 |
用案例與學(xué)生互動。 |
||||
| 2.2 繪畫工具的認識和使用方法 |
2.2.1 馬克筆使用技法 |
|||||
| 2.2.2 水溶彩鉛使用技法 |
靜物水彩作品的欣賞以及臨摹。 |
臨摹水彩靜物作品（）。 |
||||
| 2.2.3 紙張及其他工具介紹 |
風(fēng)景水彩作品的欣賞以及臨摹。 |
臨摹水彩風(fēng)景作品（）。 |
||||
| 2.3 馬克筆臨摹 |
2.3.1 平面裝飾圖案臨摹 |
平面裝飾圖案的臨摹。 |
訓(xùn)練學(xué)生掌握色調(diào)處理、畫面構(gòu)成、情感表達和形式美規(guī)律。 |
臨摹平面裝飾圖案（）。 |
||
| 2.3.2 平面裝飾欣賞 |
平面裝飾圖案的賞析及運用。 |
|||||
| 2.3.3 平面裝飾圖案設(shè)計 |
平面裝飾圖案的設(shè)計。 |
獨立設(shè)計一幅平面裝飾圖案。 |
||||
| 第三章設(shè)計史 |
3.1 中國設(shè)計史 |
3.1.1 奴隸社會時期 |
讓學(xué)生了解中國設(shè)計史，西方設(shè)計史，以及近現(xiàn)代設(shè)計。 |
|||
| 3.1.2 封建時期 |
||||||
| 3.1.3 民國時期 |
||||||
| 3.2 西方設(shè)計史 |
3.2.1 古代歐洲 |
|||||
| 3.2.2 巴洛克與洛可可 |
||||||
| 3.2.3 新藝術(shù)運動 |
||||||
| 3.3 當(dāng)代設(shè)計 |
3.3.1 包豪斯 |
|||||
| 3.3.2 Art Deco |
||||||
| 第四章設(shè)計基礎(chǔ) |
4.1 平面構(gòu)成 |
4.1.1 概述 |
設(shè)計構(gòu)成概述與發(fā)展。 |
本課程要求學(xué)生理解構(gòu)成的基本理論；理解并掌握形式美的規(guī)律，能夠?qū)υO(shè)計作品進行正確地分析和思考；能夠在設(shè)計中熟練應(yīng)用各項基本構(gòu)成法則；能夠理解綜合構(gòu)成的具體方法進行形象思維和設(shè)計創(chuàng)意。 |
||
| 4.1.2 形態(tài)要素 |
平面構(gòu)成中的形態(tài)要素。 |
|||||
| 4.1.3 平面構(gòu)成運用 |
平面構(gòu)成中的基本要素與實際運用。 |
|||||
| 4.2 色彩構(gòu)成 |
4.2.1 色彩混合 |
色彩感知與空間混合的概念。 |
||||
| 4.2.1 色彩的搭配運用 |
實例解析色彩原色對比、對比色對比、復(fù)色對比。 |
色彩搭配練習(xí)。 |
||||
| 4.2.2 色彩心理學(xué) |
色彩不但影響視覺，同時還會影響人的心理。 |
|||||
| 4.3 立體構(gòu)成 |
4.2.1 立體構(gòu)成概述 |
立體構(gòu)成的基本概念。 |
||||
| 4.2.2 立體構(gòu)成在現(xiàn)代設(shè)計中的運用 |
色彩不但影響視覺，同時還會影響人的心理。 |
|||||
| 4.4 圖案構(gòu)成 |
4.3.1 圖案構(gòu)成概述 |
講解獨立圖案、二方連續(xù)與四方連續(xù)。 |
||||
| 4.3.2 圖案及心理暗示 |
不同的圖案給人不同的心理暗示。 |
|||||
| 4.3.3 組合紋樣 |
組合紋樣的設(shè)計制作。 |
|||||
| 第五章設(shè)計原則與設(shè)計賞析 |
5.1 藝術(shù)鑒賞 |
5.1.1 黃金比例原則 |
掌握視覺分割的發(fā)生原理，了解黃金比例等在設(shè)計中的應(yīng)用。 |
不斷訓(xùn)練學(xué)習(xí)者應(yīng)該具有良好與敏銳的造型意識和恰當(dāng)?shù)谋憩F(xiàn)方法。 |
||
| 5.1.2 節(jié)奏、虛實與留白 |
標題、文字、圖案的比例關(guān)系。 |
|||||
| 5.1.3 文案與設(shè)計的關(guān)系 |
文案的基礎(chǔ)知識，廣告語的提煉。 |
|||||
| 5.2 美學(xué)原則 |
5.2.1 西方審美鑒賞 |
對西方設(shè)計進行經(jīng)典案例分析。 |
淺析西方與東方美學(xué)的共同點和差異。 |
|||
| 5.2.2 中國風(fēng)設(shè)計鑒賞 |
對近年來國際上大熱的中國風(fēng)設(shè)計進行案例賞析。 |
|||||
| 5.2.3 中式美學(xué)VS日式美學(xué) |
中式美學(xué)與日式美學(xué)的要素，共同點及對比。 |
|||||
| 5.3 流行趨勢 |
5.3.1 當(dāng)前流行趨勢分析 |
對當(dāng)前國際流行趨勢進行案例賞析介紹。 |
讓學(xué)生保持對時尚的關(guān)注和認知。 |
談?wù)剬α餍汹厔莸恼J識。 |
||
| 本階段課程在訓(xùn)練學(xué)生美術(shù)基礎(chǔ)的同時注重開拓學(xué)生的視野，提高其審美品位及藝術(shù)鑒賞能力。 |
【合作企業(yè)】
【常見問題】
很多人初次接觸UI都會很多，那就是學(xué)習(xí)UI需不需要報一個培訓(xùn)班？又或者是報培訓(xùn)班要多少錢，報哪個培訓(xùn)班好？UI設(shè)計前景怎么樣？UI工資怎么樣？學(xué)完后能找什么樣的工作等等問題？下面就是否要報班這個問題做詳細解答。
首先你得弄清楚自己是什么段位，屬于零基礎(chǔ)，有基礎(chǔ)，還是在其它設(shè)計方面經(jīng)驗非常豐富。
零基礎(chǔ)：建議報培訓(xùn)班
理由：因為你根本不知道UI是個什么東西，所能了解到的不過就是網(wǎng)絡(luò)上的只言片語，如何入門，如何學(xué)習(xí)，你根本無從下手。很多人說可以自學(xué)，但是自學(xué)的局限性非常的大。比如說學(xué)習(xí)UI，你可以從PS入手，但就光是PS這一門軟件就可以讓不少新手傷透了頭腦，網(wǎng)絡(luò)上雖然有很多視頻教程，但是實際操作起來還是問題不少。然后學(xué)習(xí)了PS呢，你又算了解了UI嗎？還是一頭霧水不是嗎？不得不說，培訓(xùn)班是目前為止，針對零基礎(chǔ)的人，有效快速地讓其上手入行的手段。
有基礎(chǔ)：建議可以去報一個專項學(xué)習(xí)班，差哪兒補哪兒，也可以根據(jù)自身的情況選擇自學(xué)。
經(jīng)驗豐富者：網(wǎng)上的視頻教程以及相關(guān)知識，相信一個經(jīng)驗豐富的人理解起來也會容易很多，也可以在網(wǎng)上和牛人交流，互相交互技術(shù)。
【關(guān)于我們】
海文集團成立于2006年，總部設(shè)在上海，是甲骨文公司全球合作伙伴，負責(zé)運營甲骨文OAEC人才產(chǎn)業(yè)基地項目?，F(xiàn)已分別在山東濟寧、廣西北海、貴州遵義、河北秦皇島、江蘇徐州、湖南常德建立六個OAEC人才產(chǎn)業(yè)基地，分別在萊蕪、煙臺建立了兩個甲骨文OAEC教育解決方案中心，并在上海、南京、徐州、貴陽、長沙、南昌、濟南、煙臺、石家莊、杭州等地建立了十多個分中心。海文集團全面引入了甲骨文的技術(shù)標準、人才標準和服務(wù)標準，建設(shè)甲骨文云教育中心、甲骨文國際認證考試中心、甲骨文綜合云服務(wù)平臺、解決方案中心、線下體驗及展示中心、高校共建實驗室、IT生態(tài)鏈企業(yè)孵化中心和區(qū)域性研發(fā)銷售中心。
海文集團致力于分銷Oracle軟硬件產(chǎn)品、服務(wù)、培訓(xùn)等業(yè)務(wù)，為政府、企業(yè)、高校和教育機構(gòu)提供專業(yè)的甲骨文產(chǎn)品分銷、課程培訓(xùn)、技術(shù)維護等服務(wù)；同時致力于為移動、交通、政府、大型企業(yè)等行業(yè)客戶提供深入和長期的顧問咨詢、客戶化定制開發(fā)及配套的系統(tǒng)集成服務(wù)，面向中小企業(yè)市場提供自主品牌的的軟件產(chǎn)品。
主要領(lǐng)域涉及保險、教育、金融、政府、能源、媒體、公共衛(wèi)生等各行業(yè)，現(xiàn)為中國電子政務(wù)百強企業(yè)、中國電子企業(yè)具潛力品牌單位、保險行業(yè)解決方案具影響力企業(yè)，在保險行業(yè)IT綜合實力及應(yīng)用解決國內(nèi)排名前十位。海文集團擁有持續(xù)的技術(shù)創(chuàng)新能力，通過軟件產(chǎn)品與行業(yè)應(yīng)用的結(jié)合、技術(shù)與服務(wù)的結(jié)合，形成了海文集團獨特的競爭優(yōu)勢。
海文集團擁有多年從事軟件工程實施、國內(nèi)外合作開發(fā)及推廣的豐富經(jīng)驗，有百人研發(fā)團隊，是典型的技術(shù)性企業(yè)。
海文集團在員工隊伍的建設(shè)中，秉持“和諧共贏，追求卓越”的企業(yè)文化，不拘一格發(fā)展人才，勇攀高峰，現(xiàn)集團已有500多名員工，同時擁有一支顧問團隊，主要成員分別來自于行業(yè)，政府高管及業(yè)界巨頭，隨著公司在高校，信息化，互聯(lián)網(wǎng)等各個領(lǐng)域的迅猛發(fā)展，也吸引了越來越多的來自世界各地的跨國企業(yè)與公司進行合作。
戰(zhàn)略合作伙伴
包括Oracle、Microsoft、IBM 、HP、BEA、SUN、SGI、DELL、BakBone、BMC及NEC、Toshiba、Lotus、SAP等公司。
很高興您的加入，讓我們攜手共贏，共創(chuàng)未來，有任何建議和意見可以聯(lián)系集團中心。
校區(qū)地址
學(xué)校相冊
更多 >
看過的人還關(guān)注了
更多適合課程
全城UI設(shè)計學(xué)校，一網(wǎng)打盡，立即搜索：
在線預(yù)約免費試聽
Copyright? 2012-2024 91goodschool.all rights reserved. 粵ICP備09027680號 
粵公網(wǎng)安備 44010602004272號
版權(quán)所有 廣州冠鵬信息技術(shù)有限公司
.png)
.png)
.png)
.png)
