在有了專案流程、理解工具與了解基本的介面設計Design Guideline後,接續前堂課製作的Wireframe,為了讓作品能夠更被精準地展現,讓客戶能夠清楚理解最終的畫面,這次將帶入網頁製作必須理解的切版觀念技巧,同時說明在不同平台上需要考量的尺寸單位、用途。同時介紹程式Zeplin的基本功能。Zeplin是Sketch的擴增工具,這套工具的好處在於能夠幫助設計師迅速傳達設計內容,包含字型、顏色在介面上的安排,以便與前端工程師溝通。在網站介面上的最終呈現是最接近實體狀況的Prototype,能夠同時表達動態與靜態,因此這堂課也將教導基礎的Prototype,同時帶入設計技巧,給予正確的設計觀念以協助製作課後作業Mockup。