VI設計項目式教程（第3版）（微課版）課件 項目15、16 移動端App界面設計 三彩馬創(chuàng)意文化公司App界面設計、VI手冊編制“中國結(jié)藝”VI手冊編制

項目15移動端App界面設計——三彩馬創(chuàng)意文化公司App界面設計VI設計項目式教程第3版｜微課版高等院校藝術(shù)設計精品系列教材15.1項目描述15.2項目目標15.3知識講解15.4項目分解目錄Content15.5作品欣賞小結(jié)15.1項目描述深入了解移動端App應用界面設計的特性，從啟動頁、引導頁、首頁、登錄頁等組成部分和功能方面，完成App界面的設計。本項目選擇三彩馬創(chuàng)意文化公司App界面設計作為實訓內(nèi)容，讀者需根據(jù)項目內(nèi)容完成項目目標。15.1項目描述15.2項目目標15.3知識講解15.4項目分解目錄Content15.5作品欣賞小結(jié)15.2項目目標123能夠熟練應用軟件進行界面設計，并能夠根據(jù)客戶需求與企業(yè)文化進行界面設計。培養(yǎng)讀者的平面設計能力和形象概括能力。知識目標技能目標素質(zhì)目標了解界面設計的意義、作用和藝術(shù)特點，掌握界面設計的基礎(chǔ)知識15.1項目描述15.2項目目標15.3知識講解15.4項目分解目錄Content15.5作品欣賞小結(jié)15.3知識講解1．啟動頁啟動頁是用戶打開App時看到的第一個界面，它們通常很簡潔，往往是一個Logo、App的名稱或者是這個產(chǎn)品的一句宣傳語。▲App名稱啟動頁▲App名稱啟動頁+宣傳語15.3知識講解2．引導頁引導頁一般用于首次打開App時展示。引導頁通常情況下用于操作引導或活動，目的是傳遞給用戶App更新的重要功能、引導用戶了解產(chǎn)品的主要功能、宣傳近期的重大活動等，為用戶提供美的享受的同時達到宣傳的目的。引導頁通常會根據(jù)產(chǎn)品特征及節(jié)日、促銷活動等進行變化?！鶕?jù)促銷活動設計的不同主題的引導頁▲宣傳產(chǎn)品特征的引導頁15.3知識講解首頁是展示App內(nèi)容和性質(zhì)的第一個界面，是用戶與App產(chǎn)生交互的主要界面，每個手機App都會在這部分展示自己的風格特點。首頁的設計取決于產(chǎn)品的類型、產(chǎn)品的核心功能、產(chǎn)品調(diào)性、產(chǎn)品版本等。首頁包含各種各樣常見的重要組件，通常會設置導航欄讓用戶根據(jù)需要訪問不同的單元模塊。

▲上部應用導航模塊，下部推薦資源3．首頁▲卡片宮格式界面布局適用于功能眾多、各模塊相對獨立的App15.3知識講解登錄頁是保存用戶信息的界面，可以為用戶提供最有效的數(shù)據(jù)信息。登錄頁設計的主要任務是保證用戶登錄信息錄入的流暢性，引導用戶順利進入App。4．登錄頁登錄頁設計15.1項目描述15.2項目目標15.3知識講解15.4項目分解目錄Content15.5作品欣賞小結(jié)15.4項目分解“三彩馬創(chuàng)意文化公司”以銷售唐三彩文化產(chǎn)品，展示唐三彩藝術(shù)作品為主要運營模式，旨在推廣唐三彩文化的傳承與技藝的創(chuàng)新發(fā)展。此次項目是針對公司App做界面設計，設計時要充分考慮唐朝文化的特點，從色彩、造型、內(nèi)容上展現(xiàn)唐三彩的藝術(shù)特征，另要滿足青年受眾的喜好，力求符合現(xiàn)在設計潮流，做好唐三彩的傳承、保護與發(fā)展。15.4項目分解任務1啟動頁設計啟動頁是用戶對App的最先感知部分,決定著用戶是否進入App，是用戶對App的第一印象，影響著用戶對產(chǎn)品的整體感受。本任務主要針對手機啟動頁進行設計。設計要點用戶為了使用App的某一項功能，在啟動頁停留時間極短，在最短的時間內(nèi)把產(chǎn)品核心內(nèi)容告知用戶是啟動頁設計的要點。15.4項目分解任務實施12上網(wǎng)或查閱書籍搜集移動端手機的類型、尺寸等資料。根據(jù)手機尺寸，使用Illustrator進行計算機繪制。15.4項目分解第一步繪制手機輪廓。第二步繪制和添加標志和宣傳語，并進行整體修飾。15.4項目分解任務2引導頁設計引導頁設計決定了App的設計風格，是用戶在首次安裝并打開App后，呈現(xiàn)給用戶的“說明書”。引導頁應摒棄所有多余的設計，用干凈的界面及有力的宣傳語體現(xiàn)本App是真實可信的媒體平臺。設計要點引導頁的作用是讓用戶了解這個App的主要功能、操作方式并迅速上手。因此引導頁以展示應用的主要功能與特點為主，通常設置3至5張圖片即可。15.4項目分解任務實施12確定手機類型、尺寸和引導頁模板。根據(jù)引導頁模板，使用Illustrator進行計算機繪制。11.4項目分解第一步繪制手機輪廓。第二步添加相關(guān)內(nèi)容，調(diào)整標志組合形式，進行版式設計和整體修飾15.4項目分解任務3首頁設計首頁內(nèi)容要簡單明了，一目了然，重在宣傳核心內(nèi)容。設計要點用戶所需的所有數(shù)據(jù)內(nèi)容按主次合理安排，重要條目要始終顯示，并位于頁面的頂端中間位置。導航消息、提示、通知等重要信息位于屏幕中容易找到的位置。App的導航一般采用底部導航的形式，菜單數(shù)目4～5個最佳。主頁的長度不宜過長，采用上下滾屏的形式，但滾屏不宜過長(最長4個整屏)。各條目合理分類于各模塊內(nèi)，并運用標題將各區(qū)域進行清晰劃分，文本區(qū)域之間還應留有足夠的間隔。按照操作習慣，一級導航放置在左側(cè)面板。15.4項目分解任務實施12確定手機類型、尺寸和首頁模板。根據(jù)首頁模板，使用Illustrator進行計算機繪制。15.4項目分解第一步繪制手機輪廓。第二步添加相關(guān)內(nèi)容，調(diào)整標志組合形式，進行版式設計和整體修飾。15.4項目分解任務4登錄頁設計大多數(shù)App都要求用戶注冊和登錄個人賬戶，登錄頁設計應該簡潔清晰，方便填寫注冊信息。設計要點登錄頁是App中最常展示的界面之一，是用于用戶輸入個人信息的界面。登錄頁內(nèi)容設計應簡潔、清晰，使用戶能快速完成操作。15.4項目分解任務實施12確定手機類型、尺寸和登錄頁模板。根據(jù)登錄頁模板，使用Illustrator進行計算機繪制。15.4項目分解第一步繪制手機輪廓。第二步添加相關(guān)內(nèi)容，確定登錄頁的版式設計與標志的組合形式后，進行整體調(diào)整11.1項目描述11.2項目目標11.3知識講解11.4項目分解目錄Content11.5作品欣賞小結(jié)11.5作品欣賞11.5作品欣賞小結(jié)本項目旨在使讀者熟悉移動端App啟動頁、引導頁、首頁、登錄頁設計的知識，掌握設計的方法與技巧，使讀者能夠運用所學知識根據(jù)App宣傳主體的風格來完成各類界面的設計。項目16VI手冊編制——“中國結(jié)藝”VI手冊編制VI設計項目式教程第3版｜微課版高等院校藝術(shù)設計精品系列教材16.1項目描述16.2項目目標16.3知識講解16.4項目分解目錄Content小結(jié)16.1項目描述VI手冊的組成內(nèi)容部分需要設計師根據(jù)企業(yè)理念高度概括地說明手冊的內(nèi)容，基礎(chǔ)系統(tǒng)部分包括企業(yè)標志設計詮釋、公司名稱標準字體設計、公司名稱組合形式、企業(yè)輔助色和輔助圖形等內(nèi)容；應用系統(tǒng)部分包括企業(yè)標志設計在不同區(qū)域的標準或設計樣本，以及每一個應用項目的規(guī)格及施工標準。本項目選擇“中國結(jié)藝”為實訓內(nèi)容，學生需根據(jù)項目要求完成VI手冊內(nèi)容的編排。16.1項目描述16.2項目目標16.3知識講解16.4項目分解目錄Content小結(jié)16.2項目目標123能夠結(jié)合計算機軟件編排手冊內(nèi)容，并能夠進行后期制作，能在規(guī)定時間內(nèi)完成VI手冊的印刷裝訂。培養(yǎng)學生對VI手冊整體設計的把握程度。知識目標技能目標素質(zhì)目標了解VI手冊的編制原則、編制形式，并結(jié)合企業(yè)理念的要求，制定企業(yè)形象宣傳的規(guī)范標準。16.1項目描述16.2項目目標16.3知識講解16.4項目分解目錄Content小結(jié)16.3知識講解一、VI手冊的編制原則123VI設計，必須以標志為核心，從開發(fā)VI設計系統(tǒng)做起，將基礎(chǔ)要素設計定型、規(guī)范，再將之運用于應用項目中，并結(jié)合不同的項目特點進行設計。一般應先選擇具有代表性的應用項目范例，將它們規(guī)范化并制成企業(yè)識別手冊，這樣就可以以手冊為標準，相近的應用設計項目參照執(zhí)行，以便企業(yè)形象的規(guī)范和統(tǒng)一。嚴格遵守VI手冊內(nèi)的規(guī)定，在具體使用過程中，還要注意創(chuàng)造力的發(fā)揮。16.3知識講解1．單冊編制二、VI手冊編制形式將基本要素系統(tǒng)和應用要素系統(tǒng)項目，按一定的次序進行編制并裝訂成一冊，采用活頁形式，以便修正、替換或增補?！√柦逃萍脊綱I手冊16.3知識講解依照基本要素系統(tǒng)和應用要素系統(tǒng)項目的不同，或者企業(yè)內(nèi)部機構(gòu)的不同（如分公司），分開編制，各自裝訂成冊，通常采用活頁形式，以便修正、替換或增補。2．分冊編制日本長崎制鐵VI手冊設計16.3知識講解因為VI手冊是根據(jù)企業(yè)經(jīng)營的內(nèi)容而定的，隨著企業(yè)經(jīng)營或服務的內(nèi)容不斷增加，VI手冊的內(nèi)容可以不斷充實。另外，VI手冊做成活頁或分冊的另一個原因就是使用方便，可以任意取出需要的部分，使用后再放回去?！鴬W斯陸申辦2022年冬奧會VI手冊設計16.1項目描述16.2項目目標16.3知識講解16.4項目分解目錄Content小結(jié)16.4項目分解“中國結(jié)藝”是一家以銷售中國結(jié)為主的特色店鋪。為突出中國結(jié)的形象特征，標志設計以中國結(jié)為主體形象，搭配中國紅的主體顏色。設計時要體現(xiàn)出我國傳統(tǒng)意味的典雅、喜慶，還要結(jié)合現(xiàn)代生活的簡約、時尚等特點，同時注意排版的統(tǒng)一性和主色調(diào)與標準色的統(tǒng)一。16.4項目分解任務1VI手冊封面、封底設計設計要點設計VI手冊封面和封底部分時需要考慮標志設計中標準色、輔助圖形部分，使其與VI手冊形成統(tǒng)一的整體。16.4項目分解任務實施1.在Illustrator中設定尺寸，寬度420mm，高度285mm。16.4項目分解2.根據(jù)企業(yè)理念，選用標志設計基礎(chǔ)系統(tǒng)部分中的標準色或輔助圖形等內(nèi)容，作為VI手冊封面和封底中的底圖部分。16.4項目分解3.根據(jù)標準色設計的封面與封底，最終效果如下。16.4項目分解任務2

VI手冊內(nèi)頁設計1.標志設計基礎(chǔ)系統(tǒng)內(nèi)頁設計，主要傳達企業(yè)標志設計規(guī)范。因此，內(nèi)容需明確，排版需整齊富有節(jié)奏性，方便實施。2.標志設計應用系統(tǒng)內(nèi)頁設計，以突顯效果圖為目的的編排設計。設計要點16.4項目分解任務實施中國結(jié)藝VI手冊總目錄設計▲16.4項目分解中國結(jié)藝VI手冊A