有幾個剛接觸 UI/UX 的朋友都問過我：『到底該怎麼著手開始設計，完全沒方向，提了好多個版型每次都打槍，我是不是不適合當網頁設計師？』
為了讓網站順利執行，及抓準設計方向，我們會花費較多的時間在事前準備，以免做白工，以下幾點幫助不知如何著手設計，或每次都抓不到方向的新手設計師們，理出一些頭緒。
1.了解客戶的產業內容
雖然我們是網頁設計師，卻需要了解各行各業，每接觸一個陌生產業的專案，都要重新去了解該產業內容和價值，才能完整呈現在網站中。 主動去搜集資料並詢問客戶，是最有效率的方式。
2.網站架設目的
客戶架設網站的目的很多種，可能為了品牌宣傳、銷售產品，或企業轉型等等，不同的目的在設計邏輯上差異很大，UI 和 UX 的著重比例也不同，以下分享幾項常見網站類型，在設計上的思考方向：
▪品牌宣傳及曝光的形象官網
新創公司或企業轉型都會需要重新建立品牌形象，網站需要呈現品牌的辨識度和專業感，讓客戶建立好的印象。色彩的調性會從品牌識別或品牌性質下去延伸，像是科技業可能會偏冷色調塑造專業感、食品業會用鮮豔一些的顏色讓食物看起來更美味。有些客戶也會希望讓網站更注重感受，因此著重UI上的呈現捨棄部分 UX 的流暢性，都是常見的。
設計關鍵：品牌辨識度、色調選擇、注重感受
來源：ボラギノール
▪商業目的為主的購物網站
購物網站結合了視覺與功能性，吸引使用者購買 (UI) 的同時，也能有好的購物體驗 (UX)，在兩者的平衡間要花較多功夫思考，恰到好處的點綴 (UI) 會讓產品更亮眼，流暢的步驟 (UX) 能讓使用者順利完成購買。
設計關鍵：設計與功能面的平衡、流暢的 UX
來源：asos
▪短時間達成某種目的的活動站
業者為了在短時間曝光產品或搜集客戶資料，會架設時效性短的活動站，可能是遊戲類、問卷類等等。設計上會需要較強烈的視覺效果，和一目了然的活動內容和獎項，才能提高使用者的參與感。通常有意願參與活動的使用者，大多是為了獎項而不是活動本身，所以 UX 上需要簡單流暢的操作，盡量簡化不必要個流程，別讓使用中途離開！
設計關鍵：強烈視覺效果、 一目了然的活動內容、簡單的操作
▪資訊分享的部落格
通常視覺比例較低，著重資訊的傳達與使用體驗，使用者能順利找到想閱讀的內容，儲存、分享、回覆等，頁面中可能會有非常多的連結與按鈕，他們之間的關聯與位置都須納入考量。
設計關鍵：清晰的架構、按鈕的擺放位置
來源：medium
▪一頁式的 landing page
它是為了讓使用者在此頁面完成某件事情，像是登入、購買，下載等，注重目的性和主題性。資訊量可能很多，要注意內容的安排和比重，重要的區塊要強烈顯眼，也可以多利用輪播或收合等功能，讓頁面不要太攏長。
設計關鍵：目的、主題性、資訊整合
來源：shopify
▪結合多種架構的綜合型網站
結合了官網、購物、部落格，或是更多功能，大型網站需要更多的事前準備，完整的架構圖、wireframe。也可能會有兩位以上的設計師共同參與，設計的統一性就變得相當重要。
設計關鍵：邏輯統整、團隊默契、統一性
來源：愛料理
3.使用族群分佈
使用族群的年齡和類型也影響了網站調性，可以先詢問客戶品牌的使用族群分佈，舉例來說：
▪族群 A – 中老年使用者：
最需注意的是文字大小，通常會比一般字體大一些，方便中老年人閱讀，設計和動態上也偏中規中矩，避免眼花撩亂無法傳達資訊。
▪族群 B – 媽媽們或毛小孩的主人：
活潑的風格中保留一些專業感，會讓使用者覺得舒服且安心，像是利用簡潔的 icon (專業感)加入一些動態效果(活潑)，多放入一些情境照，也能增強整體的感受。
來源：katvig
▪族群 C – 電動玩家：
電玩類的商品通常帶有炫光，設計上很常利用深色背景來襯托華麗的炫光效果，玩家很在意產品的功能和性能，可以用視覺畫的效果代替文字去表達。
4.電腦優先 or 行動優先
了解使用族群大多從行動裝置還是電腦進入，決定從哪個介面優先設計。
5.資料搜集和定調
最後了解了整個專案方向，就是搜集相關資料跟客戶討論啦！建議可以找兩到三種不同風格或色調，讓客戶可以比較差異，客戶通常都要看到畫面才能想像，盡量避免用文字敘述。除了網站參考資料外，也可以找一些不同風格的相片素材，製作時更清楚要使用哪類型的相片素材。
前置作業都妥善了，就開始著手首頁的設計吧！
