第5章-Android界面設(shè)計

1、Sketch 網(wǎng)站UI設(shè)計（微課版）主講老師：05 Android界面設(shè)計目錄02繪制Android信息界面01繪制Android音樂播放器界面繪制Android音樂播放器界面組件的編輯使用Sketch為用戶提供了組件的概念，它可以方便的讓用戶在多個頁面和畫板中重復(fù)運用某組內(nèi)容。創(chuàng)建組件傳感器不同 要想創(chuàng)建新的組件，只需選中一個組或者幾個圖層，單擊工作界面上方的“創(chuàng)建組件”按鈕或者執(zhí)行“圖層創(chuàng)建組件”命令。彈出“創(chuàng)建新的組件”對話框。 執(zhí)行“插入組件”命令，選擇想要插入的組件，即可在頁面中重復(fù)使用該組件。更換文本傳感器不同組件被廣泛應(yīng)用到APP界面中，最為常見的是應(yīng)用到界面的頭部和底部。也常常

2、會用作按鈕圖標(biāo)元素。此時用戶就會希望按鈕組件上的文字可以獨立編輯，以便實現(xiàn)每個按鈕看起來一樣，但里面的文本內(nèi)容各不相同。管理組件傳感器不同當(dāng)用戶創(chuàng)建組件后，Sketch會自動的創(chuàng)建一個組件頁面，用來保存所有的組件內(nèi)容，用戶可以在該頁面中完成對組件的復(fù)制刪除等操作。當(dāng)用戶同時創(chuàng)建多個組件時，可以執(zhí)行“圖層替換”命令，選擇想要替換的組件，可以為現(xiàn)有的組件更換組件。操作案例使用組件工具繪制導(dǎo)航欄應(yīng)用軟件界面 軟件界面也稱軟件UI，是人機交互的重要部分，也是軟件帶給用戶的第一印象，同時還是軟件的重要組成部分。應(yīng)用軟件界面設(shè)計規(guī)范基于Web網(wǎng)頁重新設(shè)計簡單易用為用戶考慮清晰易懂風(fēng)格一致操作靈活人性化安全

3、防護規(guī)范軟件啟動界面設(shè)計 軟件啟動界面的作用主要表現(xiàn)為兩個方面，一是在軟件啟動界面中顯示軟件的代表性標(biāo)志、版權(quán)信息、注冊用戶、軟件版本號等信息；二是在顯示軟件界面是載入運行軟件所需要的文件，避免用戶在一種盲目的狀態(tài)下等待。什么APP？APP即手機應(yīng)用程序，也就是安裝在智能手機上的軟件?？梢晕粸g覽者顯示更多的個性化元素。移動UI的設(shè)計趨勢APP的開發(fā)和設(shè)計選擇專注于較少和叫較關(guān)鍵的功能。也是在這樣的背景下，真正體驗的優(yōu)秀應(yīng)用廣告和特立獨行的導(dǎo)航模式開始出現(xiàn)。移動UI的設(shè)計趨勢專注用戶體驗使用模糊背景簡單的導(dǎo)航模式大膽而醒目的文字更簡單的配色用戶界面的情景感知移動UI和平面UI的的區(qū)別手機UI的平

4、臺主要是手機的APP客戶端，而平面UI的范疇則非常廣泛，包括絕大部分的UI領(lǐng)域。手機UI的獨特性，比如尺寸要求、控件和組件類型使得很多平面設(shè)計師需要重新調(diào)整審美基礎(chǔ)。Android系統(tǒng)文字規(guī)范設(shè)計為不同控件引入字體大小上的反差有助于營造有序、易懂的排版效果。但同時在一個界面中使用過多的的不同的字體和大小則會造成混亂。Android設(shè)計框架使用有限的字體和大小。操作案例繪制返回或菜單按鈕Android系統(tǒng)UI設(shè)計特色更加簡單便捷的操作漂亮的界面繪制Android 信息界面文本命令添加文本在插入面板中選擇“文本”工具選項或者按快捷鍵T鍵。移動光標(biāo)到頁面中，光標(biāo)變成文本光標(biāo)時，在頁面中任一點單擊即可

5、添加文本。用戶也可以在頁面上單擊并拖動鼠標(biāo)以創(chuàng)建一個固定尺寸的文本框。文本框文本檢查器共享樣式編輯文本選中一段文本，在界面的右側(cè)即可看到文本檢查器面板。在該面板中可以分別設(shè)置文本的字體、字重、對齊、寬、間距和不透明度。用戶可能會經(jīng)常想將多個文本設(shè)置為同一樣式，共享樣式能實現(xiàn)這一點，他們會將分散在不同圖層中的文本都保持同步。操作案例使用共享樣式繪制界面文本路徑Sketch支持文本渲染路徑。首選創(chuàng)建一個矢量圖形和一個文本圖層，且文本圖層在矢量圖形的上面。選中文本框?qū)ο?，?zhí)行“文本路徑文字”命令。文本轉(zhuǎn)換輪廓 在某些特殊情況下，需要將文本轉(zhuǎn)化為矢量圖形。例如要制作特殊形狀的藝術(shù)字時。選中需要轉(zhuǎn)化的文本，執(zhí)行“圖層轉(zhuǎn)化為輪廓”命令。操作案例轉(zhuǎn)化為輪廓繪制界面元素導(dǎo)出文字顯示器通常是由網(wǎng)格狀的像素組成的。當(dāng)遇到曲線文字的時候，通常會顯示鋸齒的文字效果。使用子像素抗鋸齒效果可以將文字曲線遮住的部分像素稍微變亮一點，在視覺上產(chǎn)生平滑的效果。應(yīng)用樣式陰影內(nèi)陰影動感模糊高斯模糊放大模糊混合模式Sketch中的“混合”與Photoshop等軟件中的混合功能相