電子商務視覺設計 教案 項目二 電商網(wǎng)站的視覺規(guī)劃

《電商網(wǎng)站的視覺規(guī)劃》課程教案教學模塊項目二電商網(wǎng)站的視覺規(guī)劃課時數(shù)9教學班級主講教師教學目的和要求知識目標1.了解產(chǎn)品需求分析的概念、內(nèi)容；2.熟悉產(chǎn)品概念設計的內(nèi)容；3.熟悉產(chǎn)品原型制作的理論知識。技能目標1.能夠獨立進行產(chǎn)品需求分析，并撰寫需求報告；2.能夠根據(jù)產(chǎn)品需求分析，獨立進行產(chǎn)品概念設計；3.能夠進行簡單的產(chǎn)品原型制作。素養(yǎng)目標1.了解社會主義核心價值觀，誠實守信，遵守職業(yè)道德；2.具備積極主動的工作態(tài)度、較強的視覺審美與設計能力；3.具備較強的溝通能力和良好的解決問題能力。教學手法1.基礎(chǔ)知識，教師利用講授法和問答法，首先通過提問引發(fā)學生思考，讓學生發(fā)表自己關(guān)于問題的見解，教師總結(jié)學生答案并講授重要知識點；2.重難點知識，教師利用任務驅(qū)動法，在課程開始前告知學生學習目標，引導學生圍繞學習目標先自行探索、再進行合作探究，總結(jié)遇到的困難和問題，然后老師指導學生進行實操，梳理并總結(jié)出知識要點。教學重難點重點：1.掌握產(chǎn)品概念設計的內(nèi)容；2.撰寫需求報告。難點：1.能夠獨立進行產(chǎn)品概念設計；2.能夠進行簡單的產(chǎn)品原型制作。教學要點設計1.教師設置問題引發(fā)學生自主思考：我們在對產(chǎn)品需求分析的時候需要怎么開展呢？教師鼓勵學生根據(jù)自己所學知識進行回答，教師結(jié)合案例講解產(chǎn)品需求分析和產(chǎn)品概念設計。在學生對于產(chǎn)品需求有一定認識的基礎(chǔ)之上，引導學生分組討論，進行產(chǎn)品分析的內(nèi)容的分析，有哪些注意事項，并在小組內(nèi)推舉代表發(fā)言。教師總結(jié)學生發(fā)言并將所有知識點進行系統(tǒng)講解，為學生講解撰寫需求分析報告的要素，并結(jié)合案例講解需求分析的工作流程；（135分鐘）2.教師在課程一開始，先設置問題，引發(fā)學生思考：如何理解產(chǎn)品概念設計？引導學生對問題進行討論并陳述自己的認識，教師根據(jù)發(fā)言情況進行知識講解產(chǎn)品概念設計的內(nèi)容，并配合案例展示加深學生的印象和理解；實操部分，教師先行進行在產(chǎn)品概念設計規(guī)范和步驟講解，在操作過程中將所有要點進行細致講解，學生明白了如何操作后，進行獨立練習，教師隨時關(guān)注學生的進展并解決設計過程中遇到的各種問題；（135分鐘）3.教師在課程開始前，告訴學生本次課程的目標是認識產(chǎn)品原型制作，鼓勵學生通過資料搜索與閱讀、合作討論等方式先自行了解相關(guān)內(nèi)容。具體操作問題，教師演示利用Axure軟件進行一個“生活類電商網(wǎng)站”高保真原型制作，并引導學生跟隨老師共同操作，教師及時關(guān)注學生學習進展，對學生產(chǎn)生的疑問進行解答，并在課程結(jié)束前總結(jié)知識框架。（135分鐘）教學過程任務一產(chǎn)品需求分析【預備知識】一、認識產(chǎn)品需求分析產(chǎn)品需求分析是進行產(chǎn)品設計的前提,是開發(fā)人員經(jīng)過深入細致的調(diào)研和分析，準確理解用戶和項目的功能、性能、可靠性等具體要求，將用戶非形式的需求表述轉(zhuǎn)化為完整的需求定義，從而確定系統(tǒng)功能的過程。在產(chǎn)品需求分析的過程中需要注意刪減和整合，刪減是去掉不可能實現(xiàn)的需求，這些需求通常不切實際或者說以目前的技術(shù)難以實現(xiàn)；整合是合并類似或相同的需求，這樣有助于后續(xù)的工作。二、產(chǎn)品分析的內(nèi)容1.用戶畫像分析2.競品分析3.用戶場景分析三、需求分析報告在完成需求分析后，為了方便指導后續(xù)工作的進行，需要書寫需求分析報告。需求階段的成果包括用戶需求報告、軟件需求規(guī)格說明書。1.用戶需求報告2.軟件需求規(guī)格說明書3.項目介紹4.應用環(huán)境5.功能規(guī)格6.需求變更7.產(chǎn)品提交【任務實施與分析】需求分析的工作流程，根據(jù)項目的復雜程度有所區(qū)別，但是總的來說，分成以下四個環(huán)節(jié)：步驟1：獲取需求步驟2：分析需求步驟3：整合需求步驟4：形成報告【拓展知識】一、判斷需求優(yōu)先級的方法-四象限法則四象限法則將需求等級劃分為：重要且緊急，重要不緊急，不重要不緊急，不重要卻緊急。重要且緊急，必須盡快分配資源，抓緊時間來實現(xiàn)。重要不緊急，需要花時間、精力去精細化處理好。如果不及時處理，就堆積到第一象限了。不重要不緊急和不重要卻緊急，雖然是不重要的事情，但它們也是需求，可以花費一定的時間統(tǒng)一去處理。注意這類需求要和前面的需求嚴格區(qū)分開來，不能因為邊緣任務影響主線任務進展。任務二產(chǎn)品概念設計【預備知識】一、認識產(chǎn)品概念設計產(chǎn)品概念設計是指由分析用戶需求到生成概念產(chǎn)品的一系列有序的、可組織的、有目標的設計活動，產(chǎn)品概念設計的最終目的是開發(fā)新產(chǎn)品，而新產(chǎn)品必須滿足用戶需求，這就要求產(chǎn)品概念設計要以用戶需求為重要設計依據(jù)。二、產(chǎn)品概念設計的內(nèi)容通常在電商網(wǎng)站產(chǎn)品概念設計時，會用到信息架構(gòu)圖、功能流程圖、頁面流程圖等三種圖形：1.信息架構(gòu)圖2.功能流程圖3.頁面流程圖三、設計規(guī)范在產(chǎn)品概念設計的過程中，需要圍繞需求進行，從得到的需求出發(fā)，根據(jù)現(xiàn)有的互聯(lián)網(wǎng)設計技術(shù)進行產(chǎn)品概念設計。在設計流程圖的過程中，有以下基本要求：1.有中心。這里的中心是指在產(chǎn)品概念設計時，需要圍繞著“需求”進行，設計出來的網(wǎng)站，能夠滿足客戶的需求。2.切合實際。因為是設計，所以有很多的發(fā)揮空間，但產(chǎn)品概念設計影響后續(xù)的產(chǎn)品原型制作，所以整個產(chǎn)品概念設計過程中需要注意設計內(nèi)容能夠落地，進行實施?！救蝿諏嵤┡c分析】通常情況下，產(chǎn)品概念設計的流程分為了以下四個步驟：步驟1：研讀需求報告，梳理產(chǎn)品框架步驟2：設計信息架構(gòu)圖步驟3：設計功能流程圖步驟4：設計頁面流程圖【拓展知識】一、產(chǎn)品概念設計的研究發(fā)展方向隨著科學技術(shù)的不斷發(fā)展，產(chǎn)品概念設計的研究也必須向集成化、智能化、網(wǎng)絡化、數(shù)字化的方向發(fā)展，進一步拓展產(chǎn)品概念設計的研究深度和廣度。在研究內(nèi)容上，要重視對概念設計內(nèi)在規(guī)律、思維模式的研究；在研究對象上，要重視對復雜產(chǎn)品的概念設計研究；在實現(xiàn)技術(shù)上，要重視對網(wǎng)絡技術(shù)和數(shù)字技術(shù)的應用研究。1.復雜產(chǎn)品概念設計模型研究2.統(tǒng)一產(chǎn)品模型描述方式的研究3.協(xié)作式產(chǎn)品概念設計研究4.人機協(xié)作的概念設計系統(tǒng)研究任務三產(chǎn)品原型制作【預備知識】一、認識產(chǎn)品原型制作1.產(chǎn)品原型的定義產(chǎn)品原型是設計方案的表達，是產(chǎn)品經(jīng)理、交互設計師的重要產(chǎn)出物之一，可以讓用戶提前體驗產(chǎn)品，供開發(fā)團隊之間交流設計構(gòu)想、展示復雜交互的方式。2.產(chǎn)品原型的種類產(chǎn)品設計原型按照精細程度來分，可分為低保真產(chǎn)品原型和高保真產(chǎn)品原型。二、產(chǎn)品原型制作工具AxureRP介紹AxureRP是美國AxsureSoftwareSolution公司旗艦產(chǎn)品，一個專業(yè)的快速原型設計工具，支持Windows和MacOS,它能夠讓產(chǎn)品經(jīng)理等設計人員快速創(chuàng)建應用軟件或Web網(wǎng)站的線框圖、流程圖、原型和規(guī)格說明書【任務實施與分析】下面利用Axure軟件進行一個“生活類電商網(wǎng)站”高保真原型制作。步驟1：利用前面所學知識，梳理出“生活類電商網(wǎng)站”——未來生活網(wǎng)的基本；步驟2：根據(jù)信息架構(gòu)圖發(fā)現(xiàn)需要制作6個Web網(wǎng)站頁面，打開AxureRP軟件，在“左側(cè)”頁面處進行文件夾的創(chuàng)建；步驟3：網(wǎng)站首頁制作；步驟3.1：設置原型尺寸步驟3.2：制作網(wǎng)站名稱步驟3.3：制作導航欄步驟3.4：制作單張海報圖步驟3.5：進行“好評如潮”、“新品上線”“買手力薦”等模塊的設置【拓展知識】其他產(chǎn)品原型制作工具介紹1.VisioVisio是微軟公司所研發(fā)的辦公軟件之一，也是目前市場上主流的繪圖軟件。便于IT和商務專業(yè)人員就復雜信息、系統(tǒng)和流程進行可視化處理、分析和交流的軟件，它不僅可以將用戶的思想、設計與最終產(chǎn)品演變成形象化的圖像進行傳播，而且還可以幫助用戶創(chuàng)建具有專業(yè)外觀的圖表，以便理解、記錄和分析信息、數(shù)據(jù)、系統(tǒng)和過程2.墨刀墨刀是一款在線原型設計工具。借助于墨刀，創(chuàng)業(yè)者、產(chǎn)品經(jīng)理及UI/UX設計師能夠快速構(gòu)建移動應用產(chǎn)品原型，并向他人演示。作為一款專注移動應用的原型工具，墨刀把全部功能都進行了模塊