你是不是很常聽到UI、UX設計師，但卻搞不懂UI、UX到底是什麼，究竟在工作項目上又有哪些差別呢？這篇文章讓你快速先搞懂UI、UX，並告訴你9個關於網站的UX設計提高轉換率的方法。
 
讓我們來透過幾張圖瞭解UI、UX的差別。
 
簡單來說，UI（User Interface）使用者介面，主要專業是設計頁面上的功能、顧及使用的便利性與整個設計的美學，網站的美觀性和他息息相關；UX（User Experience）使用者體驗，則是根據使用者的習慣，安排整個網站頁面的內容規劃，像是哪些區塊的內容要先在網站上出現，行動呼籲按鈕（Call to Action, CTA）的位置應該擺在哪裡。


Photo source | UI-UX Services | Web Designing Services
 
說到這裡，你可能還是有點搞不清楚這兩者之間的差異，因為通常在一個較小的公司或企業裡面，UIUX可能會混在一起。下面這張圖，簡述了UI、UX之間的差異。UI主要負責的項目是整體視覺呈現，UX的則是從使用者的角度去看怎麼樣對使用者來說最直覺。


Photo source | Zillion Designs

讓我們再透過一張圖，進一步瞭解UI、UX實際工作上的差異：


Photo source | Writing for designer
 
從上面這張圖你會發現，UX所做的是網站的骨架設計（Wireframe & Prototype），哪些版面位置該放哪些內容，網站的互動設計。你會看到他們畫出如下圖所示的內容，但在畫這些圖之前，謹慎的話，應該包括使用者的研究（User Research）和情境分析（Scenario）。


Photo source | 好感度No.1的網頁設計: RWD不出槌法則，網站在任何裝置都完美呈現
 
一般來說，研究必須透過如眼球追蹤、問卷調查、焦點團體調查，或是大量的研究資料背景調查，才能獲得潛在客群的使用習慣報告分析。
 
而在透過研究與分析將網站的架構勾勒出來之後，接著才交棒給UI。UI可以是將UX理念實踐的美學工程師，包括整個網站的顏色、字型、字體大小、配置安排。
 
如果用醫生與病人作為舉例，UX設計師的前期作業，UX研究員就是門診醫生—負責研究使用者背景的資料（潛在消費族群的使用行為與習慣）—病人是什麼樣的症狀，經過初步的分析後，交由UX設計師—主治醫生來決定治療方法，進行策略、產品設計和資訊版面安排，確認網站的結構。最後則是再接棒由UI設計師—外科醫生，動手術開刀，執行網站內容設計的細節。（參考資料：台灣赫斯特媒體數位總監Ruby Kuan 關芸如UI UX概論簡報）



再用一個比較實際、容易了解的例子來比喻UI、UX設計師。


Photo source | 如何讓你愛上我 從服務設計看UI/UX

 
若你想要讓一個人愛上你，UX的專業是瞭解你的心儀對象，如何從看見你之後，經過什麼樣的歷程與轉變，到最後才會愛上你，中間歷經的過程可能包含：看見、記住、瞭解、試探、接受、在乎、愛上。
 
而UI的專業則是透過實際的行為，讓對方產生如UX所陳述的感覺，以一步步走向愛上你的路，比方說，如果想要讓對方看見你，你可能可以耍帥、打扮得很漂亮、展現自己的風趣幽默等，而要讓對方記住你，你可能要進一步與他有更多的互動、像是聊天、關心等⋯⋯
 
簡單來說，UX的工作是要讓使用者的心理認知產生轉變，瞭解誘發動機，是一種無形的設計過程，關乎感覺；而UI則是要讓UX想要產生的轉變，透過視覺安排與設計具體呈現，比如說整個網站的安排設計或是產品的包裝，達成UX期望讓使用者產生心理轉變的具體行為。
 
事實上UI、UX在設計師的世界仍然是有部份重疊且複雜。


Photo source | Asinthecity
 
廣義的UX Designer指的是以設計為方法作為優化用戶體驗，多專注在使用者介面的設計，而種類可以再細分成互動設計（Interaction Design）、視覺設計師（Visual Designer）/ 視覺界面設計師（Graphic User Interface Designer），以及設計研究員（Design Researcher）。
 
若以網站上的一個行動呼籲（Call to Action, CTA）按鈕來說，設計研究員是提出為什麼需要那個按鈕的人，視覺設計師是負責設計按鈕長的樣子（如形狀、顏色、大小），而互動設計師則是決定當使用者點選了CTA後，要導向哪個網頁的人。
 
參考資料＆延伸閱讀：第一次轉UX Designer就上手
 
讀到這裡你會發現，UX Designer跟你想像的「設計師」不太一樣，很多公司可能在徵才的時候寫UX Designer，但事實上他們聘請來的UX Designer可能都在做和UI Designer重複的Visual Design，而沒有發揮到「用戶體驗」的這項專業。

作者 | Doris Lin | 本文轉載自TransBiz跨境電商顧問 x Amazon品牌代營運《UI UX設計是什麼？用9個提高網站轉換率的方法告訴你》