目標
　　A.繪製出線稿，後續的開發都會按照上面的設計
　　B.
　　　　其實工程師最大的問題是，很常有自己的想法
　　　　變成開發途中，東做一個西做一個
　　　　產出的東西有時候不是使用者要的
　　　　這時候就需要美術的線稿能夠參考，較能避免這個問題。

步驟
因為要做的是遊戲活動關卡查詢
所以需要遊戲中的敵方資訊、關卡資訊。

1.參考資料

　　國外日文網站Gamewith黒ウィズ攻略wiki
　　以下節錄該網站的敵方資訊、關卡資訊圖片
　　後續我們開發使用到的資料
　　其資料處理的結構也會與圖中表格有關

2.打草稿
　　依據參考資料規劃手打草稿
　　確認初步的想法實現在紙上
　　預計畫面會配置成三塊
　　　　　　●左半邊放上敵方資訊
　　　　　　●右半邊則是選單
　　　　　　●中間則放上關卡資訊

3.畫線稿(WireFrame)
　　使用Miro白板協作平台來繪製線稿
　　初步設計規劃出4張線稿

備註
　　由於電腦效能的關係，Figma我開不起來、Adobe XD需要訂閱方案
　　所以這次採用的是Miro的免費方案來規劃網站版面設計
　　下面連結為Miro完成繪製的四張線稿
連結