製作/模仿一頁精美的 App 畫面

作業目的: 學習使用 storyboard 設計 App 畫面。模仿現成的 App 畫面，或發揮設計的浪漫血液，製作設計一頁精美的 App 畫面。

既然身體裡不存在設計的浪漫血液，就只好先從「致敬」下手了。決定來效法我喜歡的Netflix吧。

原本的App畫面先來二張（打開全都都是小孩子看的動漫⋯⋯）。

看得到是App以黑色為底色，分成幾個大區塊，整個畫面是可以向下捲動顯示不同的影片分類的，下面每一個分類中的影片也是可以橫向捲動來看分類中的影片。注意到的是，不管上下左右的捲動，Netflix都沒有顯示出 scroll bar，可能是為了美觀、節省空間、再加上使用者大概也都知道要怎麼操作吧？

首先遇到的難題就是那條 Tab Bar 的那四個按鍵。花了好幾個小時研究 Sketch 和 Zeplin，決定先試著用 Sketch來做做看 symbol，結果這個 "試試看" 就又是半天之後的事了，連個點都沒生出來啊～（崩潰～）。在N小時後，終於用超笨的方法用了 Sketch 裡的 tab bar template，再用download下來的免費 icon，一個一個override 成我想要的圖。

成果看起來好像有那麼一回事，但是⋯⋯ 它．的．底．是．白．色．的．啊．（啊，不想管了，已經沒有力氣再重來一次了）。接下來把這個圖輸出成圖檔，丟到 Xcode備用。

畫面的大魔王算是解決了，下面就很快了，全部都是圖片剪貼工作。先把底色調成灰色的，加了一個View 做黑色底，其它所有的圖片都用ImageView來貼，看似簡單，但是光調整大小位置也花了不少時間。來一張最後的成果圖 （發現 simulator 也有 screenshot 功能）。

下面是在Xcode裡看起來的樣子 （Home 按鍵看來好醜⋯⋯）。