網(wǎng)頁UI設計

項目一 頁面草圖繪制 1
任務1 手繪草圖 4
1.1.1 網(wǎng)頁布局的基本知識 5
1.1.2 響應式網(wǎng)頁布局的設計特點 8
1.1.3 手繪草圖的方法 14
任務2 手繪流程圖 21
1.2.1 繪制流程圖 21
1.2.2 POP軟件 23
項目二 頁面原型設計 28
任務1 認識Axure軟件 29
2.1.1 軟件安裝 29
2.1.2 軟件的工作環(huán)境 34
2.1.3 基本元件 34
2.1.4 元件的樣式與屬性 35
任務2 使用Axure軟件繪制頁面原型 40
2.2.1 自適應視圖 41
2.2.2 柵格系統(tǒng) 42
2.2.3 元件使用 48
任務3 使用Axure軟件進行交互設計 71
2.3.1 交互樣式設置 71
2.3.2 動態(tài)面板 73
2.3.3 組合/取消組合元件 74
2.3.4 元件交互的使用―顯示/隱藏 76
2.3.5 變量 78
2.3.6 內(nèi)聯(lián)框架 78
任務4 使用Axure軟件進行流程設計 117
2.4.1 流程圖組件 117
2.4.2 母版 120
任務5 發(fā)布原型設計作品 124
2.5.1 快速預覽查看原型 125
2.5.2 生成HTML文件查看原型 125
2.5.3 Web字體設置 126
2.5.4 移動設備設置 127
2.5.5 發(fā)布原型到AxShare 127
項目三 網(wǎng)頁頁面設計 137
任務1 移動端頁面設計 138
3.1.1 網(wǎng)頁設計標準尺寸 138
3.1.2 排版構成 143
3.1.3 色彩構成 146
3.1.4 扁平化概念 147
任務2 平板電腦端頁面設計 182
版式構成 182
任務3 計算機端及寬屏頁面設計 194
版面設計 194
任務4 頁面交互設計 211
簡析交互設計 211
任務5 產(chǎn)品匯報與展示 220
網(wǎng)頁效果圖展示 220
項目四 App產(chǎn)品原型設計 224
任務1 使用Axure軟件繪制App產(chǎn)品線框圖原型 225
4.1.1 App產(chǎn)品與Web產(chǎn)品 226
4.1.2 App產(chǎn)品常見UI組件 227
4.1.3 App產(chǎn)品交互設計注意事項 231
任務2 使用Photoshop軟件制作App產(chǎn)品效果圖和應用圖標原型 234
任務3 使用Axure軟件制作App產(chǎn)品高保真視覺原型 243