本章介紹：

本章對閃屏頁、引導(dǎo)頁、首頁、個人中心頁、詳情頁以及注冊登錄頁等常用頁面的基礎(chǔ)知識及繪制方法進行系統(tǒng)講解與演練。通過本章的學(xué)習，讀者可以對UI頁面設(shè)計有一個基本的認識，并快速掌握繪制UI中常用頁面的規(guī)范和方法。項目5打造生動的頁面—UI頁面設(shè)計學(xué)習引導(dǎo)掌握UI頁面的設(shè)計規(guī)則掌握UI頁面的核心模塊了解UI頁面的設(shè)計思路掌握UI頁面的制作方法培養(yǎng)對UI頁面的審美鑒賞能力培養(yǎng)對UI頁面的設(shè)計創(chuàng)意能力任務(wù)5.1

設(shè)計旅游類App閃屏頁任務(wù)引入任務(wù)知識設(shè)計理念任務(wù)實施5.1.1任務(wù)引入本任務(wù)通過學(xué)習使用軟件Photoshop設(shè)計旅游類App閃屏頁，掌握閃屏頁的設(shè)計要點與制作方法。5.1.2設(shè)計理念在設(shè)計過程中，圍繞旅游類App閃屏頁進行創(chuàng)意。整體設(shè)計具有突出產(chǎn)品、展示營銷的作用。以實際圖片作為背景，能夠增強用戶對產(chǎn)品的期待?！爱a(chǎn)品logo+產(chǎn)品名稱+產(chǎn)品”的簡潔化設(shè)計形式，使視覺更加舒適，突出重點。5.1.3任務(wù)知識使用“置入嵌入對象”命令置入圖像，使用“顏色疊加”命令添加效果。5.1.4任務(wù)實施任務(wù)5.2設(shè)計旅游類App引導(dǎo)頁任務(wù)引入任務(wù)知識設(shè)計理念任務(wù)實施5.2.1任務(wù)引入本任務(wù)通過學(xué)習使用軟件Photoshop設(shè)計旅游類App引導(dǎo)頁，掌握引導(dǎo)頁的設(shè)計要點與制作方法。5.2.2設(shè)計理念在設(shè)計過程中，圍繞旅游類App引導(dǎo)頁進行創(chuàng)意。整體設(shè)計具有操作引導(dǎo)、講解功能的作用。背景采用了與旅游類相關(guān)的風景圖片，符合旅游類APP的品牌調(diào)性，同時能夠增強用戶對產(chǎn)品的期待，讓用戶更了解這款A(yù)PP的情懷。視覺表現(xiàn)應(yīng)與任務(wù)5.1的設(shè)計風格保持一致。5.2.3任務(wù)知識使用“置入嵌入對象”命令置入圖像和圖標，使用“漸變疊加”命令和“顏色疊加”命令添加效果，使用“橫排文字”工具輸入文字。5.2.4任務(wù)實施任務(wù)5.3設(shè)計旅游類App首頁任務(wù)引入設(shè)計理念任務(wù)知識任務(wù)實施5.3.1任務(wù)引入本任務(wù)通過學(xué)習使用軟件Photoshop設(shè)計旅游類App首頁，掌握首頁的設(shè)計要點與制作方法。5.3.2設(shè)計理念在設(shè)計過程中，圍繞主題旅游進行創(chuàng)意。背景為純色和風景圖片作為襯托。多種色彩呈現(xiàn)了豐富的設(shè)計形式。字體選用蘋方和方正蘭亭大黑起到了呼應(yīng)主題的作用。頁面是由搜索欄、Banner、金剛區(qū)、瓷片區(qū)以及標簽欄等組成的綜合性頁面，能夠滿足用戶的多種需求。視覺表現(xiàn)應(yīng)與任務(wù)5.1的設(shè)計風格保持一致。整體設(shè)計充滿特色，契合主題。5.3.3任務(wù)知識使用“圓角矩形”工具、“矩形”工具和“橢圓”工具繪制形狀，使用“置入嵌入對象”命令置入圖片和圖標，使用“創(chuàng)建剪貼蒙版”命令調(diào)整圖片顯示區(qū)域，使用“漸變疊加”命令添加效果，使用“屬性”面板制作彌散投影，使用“橫排文字”工具輸入文字。5.3.4任務(wù)實施任務(wù)5.4設(shè)計旅游類App個人中心頁任務(wù)引入設(shè)計理念任務(wù)知識任務(wù)實施5.4.1任務(wù)引入本任務(wù)通過學(xué)習使用軟件Photoshop設(shè)計旅游類App個人中心頁，掌握個人中心頁的設(shè)計要點與制作方法。5.4.2設(shè)計理念在設(shè)計過程中，圍繞主題旅游進行創(chuàng)意。背景為純色和風景圖片作為襯托。色彩選取橘黃色、深黃色和淺灰色分別體現(xiàn)了歡快、熱情和柔和。字體選用蘋方符合設(shè)計規(guī)范。視覺表現(xiàn)應(yīng)與任務(wù)5.1的設(shè)計風格保持一致。整體設(shè)計充滿特色，契合主題。5.4.3任務(wù)知識使用“圓角矩形”工具、“矩形”工具、“橢圓”工具和“直線”工具繪制形狀，使用“置入嵌入對象”命令置入圖片和圖標，使用“創(chuàng)建剪貼蒙版”命令調(diào)整圖片顯示區(qū)域，使用“漸變疊加”命令添加效果，使用“屬性”面板制作彌散投影，使用“橫排文字”工具輸入文字。5.4.4任務(wù)實施任務(wù)5.5項目演練-設(shè)計旅游類App詳情頁任務(wù)引入設(shè)計理念5.5.1任務(wù)引入本任務(wù)通過學(xué)習使用軟件Photoshop設(shè)計旅游類App詳情頁，掌握詳情頁的設(shè)計要點與制作方法。5.5.2設(shè)計理念在設(shè)計過程中，圍繞主題旅游進行創(chuàng)意。背景為純色和風景圖片作為襯托。色彩選取橘黃色、深黃色和淺灰色分別體現(xiàn)了歡快、熱情和柔和。字體選用蘋方符合設(shè)計規(guī)范。視覺表現(xiàn)應(yīng)與任務(wù)5.1的設(shè)計風格保持一致。整體設(shè)計充滿特色，契合主題。任務(wù)5.6項目演練-設(shè)計旅游類App注冊登錄頁任務(wù)引入設(shè)計理念5.6.1任務(wù)引入本任務(wù)通過學(xué)習使用軟件Photoshop設(shè)計旅游類App注冊登錄頁，掌握注冊登錄頁的設(shè)計要點與制作方法。5.6.2設(shè)計理念在設(shè)計過程中，圍繞主題旅游進行創(chuàng)意。整體設(shè)計具有清晰的操作流程。以實際圖片作為背景，能夠增強用戶對產(chǎn)品的期待。色彩選用橙色能夠體現(xiàn)旅游的歡快熱情并突出重點。字體選用蘋方符合設(shè)計規(guī)范。視覺表現(xiàn)應(yīng)與任務(wù)5.1的設(shè)計風格保持一致。任務(wù)5.7項目演練-設(shè)計電商類App頁面任務(wù)引入設(shè)計理念5.7.1