Sketch交互設(shè)計之美：從零基礎(chǔ)到完整項目實現(xiàn)

目 錄

第1章初識Sketch

1.1擁抱變化，交互設(shè)計師的蛻變之旅
1.2Sketch簡介
1.2.1Sketch是什么
1.2.2Sketch的優(yōu)勢
1.2.3Sketch對于團隊特別是交互設(shè)計師的價值
1.2.4Sketch的應(yīng)用前景
1.2.5Sketch和Photoshop對比
1.3Sketch獲取
1.3.1Sketch下載
1.3.2Sketch安裝
1.3.3Sketch激活
1.3.4Sketch定價策略
1.4Sketch界面介紹
1.4.1菜單欄
1.4.2工具欄
1.4.3頁面
1.4.4圖層
1.4.5畫布
1.4.6檢查器
1.5Sketch上手試用
1.6團隊項目介紹
1.6.1項目背景說明
1.6.2項目功能需求
1.6.3項目產(chǎn)品架構(gòu)
知識拓展
動腦思考
動手操作
第2章快速入門

2.1交互設(shè)計入門
2.1.1認(rèn)識交互設(shè)計
2.1.2認(rèn)識交互設(shè)計師
2.1.3交互設(shè)計師需要具備的素質(zhì)
2.1.4交互設(shè)計師的職責(zé)
2.1.5交互設(shè)計師的專業(yè)背景要求
2.1.6交互設(shè)計師需要的知識體系
2.1.7交互設(shè)計師常用的工具
☆重點2.1.8了解交互設(shè)計流程
2.2明確目標(biāo)和產(chǎn)出物
2.2.1流程圖
2.2.2低、高保真原型
2.2.3交互說明
2.2.4視覺規(guī)范
2.2.5視覺標(biāo)注稿
2.2.6規(guī)范切圖
2.2.7動效參數(shù)
2.3學(xué)習(xí)基本工具使用
☆重點2.3.1線條工具
☆重點2.3.2幾何工具
☆重點2.3.3文字工具
2.4學(xué)習(xí)高級工具使用
2.4.1剪刀工具
2.4.2變形工具
2.5學(xué)習(xí)其他工具使用
2.5.1插入類工具
2.5.2組織類工具
2.5.3編輯類工具
2.5.4輔助類工具
2.6學(xué)會版本管理
2.6.1使用多個Sketch文件管理
2.6.2使用Sketch自動保存歷史
版本
2.7了解原型尺寸和命名規(guī)范
☆重點2.7.1原型尺寸
2.7.2命名規(guī)范
2.8掌握交互設(shè)計方法論
2.8.1交互設(shè)計方法論的概念
2.8.2交互設(shè)計方法論——5W2H
2.8.3其他交互設(shè)計方法論
知識拓展
實戰(zhàn)教學(xué)
動腦思考
動手操作
第3章基礎(chǔ)運用

3.1創(chuàng)作空間
3.1.1畫布
☆重點3.1.2Artboard（畫板）
☆重點3.1.3柵格布局
3.2框架設(shè)計
3.2.1發(fā)散思維
3.2.2人物角色
3.2.3故事板
3.2.4流程設(shè)計
3.2.5信息架構(gòu)
3.3界面設(shè)計
3.3.1界面設(shè)計原則
3.3.2界面設(shè)計理論
3.3.3界面設(shè)計實踐
3.4圖像處理
3.4.1圖像導(dǎo)入
☆重點3.4.2圖像處理方式
3.4.3Mask（蒙版）處理
3.5圖標(biāo)設(shè)計
☆重點3.5.1認(rèn)識圖標(biāo)
3.5.2圖標(biāo)繪制規(guī)范
☆重點3.5.3圖標(biāo)繪制
3.5.4圖標(biāo)引用
3.6測距和對齊
3.6.1測距
3.6.2對齊
知識拓展
實戰(zhàn)教學(xué)
動腦思考
動手操作
第4章高級運用

4.1快速原型設(shè)計
4.1.1快速復(fù)制
4.1.2批量復(fù)制
4.1.3一級頁面設(shè)計
☆重點4.2歸類整理
4.2.1圖層整理
4.2.2頁面整理
4.2.3圖層查找
4.3原型演示
4.3.1SketchMirror
4.3.2SketchMirrorforiPhone
4.3.3需求驗證
4.3.4二級頁面設(shè)計
4.4Symbol（符號）
☆重點4.4.1Symbol的介紹及應(yīng)用
場景
☆重點4.4.2Symbol基礎(chǔ)教程
☆重點☆難點4.4.3Symbol
嵌套教程
☆重點☆難點4.4.4夜視Symbol庫
制作
4.5StyledText（樣式庫）
4.5.1StyledText的概念
4.5.2TextStyle（字體樣式）
4.5.3ShareStyle（共享樣式）
4.5.4夜視項目樣式庫
4.6細節(jié)設(shè)計
☆重點4.6.1交互邊界
☆重點4.6.2特殊狀態(tài)
☆重點4.6.3場景設(shè)計
4.6.4首頁及播放頁設(shè)計
知識拓展
實戰(zhàn)教學(xué)
動腦思考
動手操作
第5章團隊協(xié)作

5.1Sketch和團隊協(xié)作
5.1.1團隊協(xié)作基礎(chǔ)
5.1.2Sketch協(xié)作流程
5.2使用Libraries減少重復(fù)勞作
☆重點☆新功能5.2.1Libraries
介紹
☆重點5.2.2Libraries制作和
導(dǎo)入
☆重點5.2.3Libraries使用和
更新
☆重點5.2.4Libraries云協(xié)作
5.3使用堅果云構(gòu)建協(xié)作環(huán)境
5.3.1構(gòu)建前的準(zhǔn)備工作
5.3.2創(chuàng)建團隊文件夾
5.3.3設(shè)置本地同步文件夾
5.3.4查看歷史版本
動腦思考
動手操作
第6章交付輸出

6.1交互設(shè)計輸出物
6.1.1交互方案和交互原型
☆重點6.1.2交互說明
☆重點6.1.3交互規(guī)范
6.2視覺設(shè)計輸出物
6.2.1視覺風(fēng)格探索
6.2.2視覺頁面
☆重點6.2.3視覺規(guī)范
☆重點6.2.4視覺標(biāo)注
☆重點6.2.5切圖資源
知識拓展
實戰(zhàn)教學(xué)
動腦思考
動手操作
第7章動效設(shè)計Principle

7.1需要動效設(shè)計的原因
☆重點7.1.1為用戶創(chuàng)造愉悅的
體驗
7.1.2驗證心中的想法和可行性
7.1.3與開發(fā)工程師溝通動態(tài)效果
7.2選擇Principle的原因
7.2.1Principle簡介
7.2.2Principle的優(yōu)勢
7.2.3Principle的獲取、安裝與
激活
7.3Principle初體驗
7.3.1初識界面
☆重點7.3.2交互形態(tài)
☆重點7.3.3事件
☆重點7.3.4動畫
7.4Principle制作原型
7.4.1準(zhǔn)備工作
7.4.2制作翻頁效果
7.4.3制作轉(zhuǎn)場效果
7.4.4制作滾動效果
7.4.5原型演示
7.5Principle制作動畫
☆重點☆難點7.5.1動畫構(gòu)思
☆重點7.5.2動畫制作
☆重點☆難點7.5.3交付開發(fā)
實現(xiàn)
實戰(zhàn)教學(xué)
動腦思考
動手操作
第8章完整后臺設(shè)計實現(xiàn)

8.1后臺設(shè)計目標(biāo)
8.1.1業(yè)務(wù)功能
8.1.2設(shè)計目標(biāo)
8.2后臺框架設(shè)計
8.2.1角色場景
8.2.2權(quán)限設(shè)計
8.2.3流程設(shè)計
8.3后臺界面設(shè)計
8.3.1菜單導(dǎo)航設(shè)計
8.3.2內(nèi)容列表設(shè)計
8.3.3流程頁面設(shè)計
8.3.4頁面細節(jié)設(shè)計
8.3.5創(chuàng)建最小化Symbol庫
8.4后臺交互說明
8.4.1學(xué)會講故事
8.4.2時刻警惕權(quán)限和安全
8.5學(xué)習(xí)建議
8.5.1Sketch學(xué)習(xí)建議
8.5.2交互設(shè)計學(xué)習(xí)建議
結(jié)語
參考文獻