# 線稿圖 Wireframe
線稿圖就是把想要的網站規劃內容、排版、文案都盡量詳細地畫出來
這時就會確立大概的排版跟內容，越詳細越好
設計師就會根據線稿圖來幫忙設計首頁、擬定色系
之後用這些線稿來作為切板的主要參考（實做時還是會隨時調整）
有完成線稿圖並且通過審核，才有機會可以獲得跟設計師配合的服務

我大約是在第三週把三、四週的眼鏡電商作業完成後才開始畫線稿圖
有些同學在更早期就已經完成，雖然時間算充裕，還是建議越早開始越好，可以更詳細地去規劃想要的內容

<br>

左邊為前台頁面，右邊主要是會員跟後台系統的頁面，綠色底是最後有切出來的頁面
這次作品主要是以 Boostrap 5 切板為主，加入少量 jQuery 跟 外部套件如視差滾動（AOS）、瀑布流（Masonry），較無 JS 做太多功能　
所以最後就捨棄了同質性較高的頁面（就呈現切板技術來說）


<br>


###### tags: `網頁切版直播班 - 2022 夏季班`