UI UX設計是什麼？用9個提高網站轉換率的方法告訴你[ Part 1 ]

這篇文章讓你快速先搞懂UI、UX，並告訴你9個關於網站的UX設計提高轉換率的方法。

讓我們來透過幾張圖瞭解UI、UX的差別。

簡單來說，UI（User Interface）使用者介面， ... 數位行銷學院 訊息專區 所有課程 數位行銷師資團隊 數位行銷知識 數位行銷影片 登入 數位行銷知識 首頁 > 數位行銷知識 > UIUX設計是什麼？用9個提高網站轉換率的方法告訴你[Part1] Tweet UIUX設計是什麼？用9個提高網站轉換率的方法告訴你[Part1] 你是不是很常聽到UI、UX設計師，但卻搞不懂UI、UX到底是什麼，究竟在工作項目上又有哪些差別呢？這篇文章讓你快速先搞懂UI、UX，並告訴你9個關於網站的UX設計提高轉換率的方法。

  讓我們來透過幾張圖瞭解UI、UX的差別。

  簡單來說，UI（UserInterface）使用者介面，主要專業是設計頁面上的功能、顧及使用的便利性與整個設計的美學，網站的美觀性和他息息相關；UX（UserExperience）使用者體驗，則是根據使用者的習慣，安排整個網站頁面的內容規劃，像是哪些區塊的內容要先在網站上出現，行動呼籲按鈕（CalltoAction,CTA）的位置應該擺在哪裡。

Photosource| UI-UXServices|WebDesigningServices   說到這裡，你可能還是有點搞不清楚這兩者之間的差異，因為通常在一個較小的公司或企業裡面，UIUX可能會混在一起。

下面這張圖，簡述了UI、UX之間的差異。

UI主要負責的項目是整體視覺呈現，UX的則是從使用者的角度去看怎麼樣對使用者來說最直覺。

Photosource| ZillionDesigns 讓我們再透過一張圖，進一步瞭解UI、UX實際工作上的差異： Photosource| Writingfordesigner   從上面這張圖你會發現，UX所做的是網站的骨架設計（Wireframe&Prototype），哪些版面位置該放哪些內容，網站的互動設計。

你會看到他們畫出如下圖所示的內容，但在畫這些圖之前，謹慎的話，應該包括使用者的研究（UserResearch）和情境分析（Scenario）。

Photosource|好感度No.1的網頁設計:RWD不出槌法則，網站在任何裝置都完美呈現   一般來說，研究必須透過如眼球追蹤、問卷調查、焦點團體調查，或是大量的研究資料背景調查，才能獲得潛在客群的使用習慣報告分析。

  而在透過研究與分析將網站的架構勾勒出來之後，接著才交棒給UI。

UI可以是將UX理念實踐的美學工程師，包括整個網站的顏色、字型、字體大小、配置安排。

  如果用醫生與病人作為舉例，UX設計師的前期作業，UX研究員就是門診醫生—負責研究使用者背景的資料（潛在消費族群的使用行為與習慣）—病人是什麼樣的症狀，經過初步的分析後，交由UX設計師—主治醫生來決定治療方法，進行策略、產品設計和資訊版面安排，確認網站的結構。

最後則是再接棒由UI設計師—外科醫生，動手術開刀，執行網站內容設計的細節。

（參考資料：台灣赫斯特媒體數位總監RubyKuan關芸如UIUX概論簡報） 再用一個比較實際、容易了解的例子來比喻UI、UX設計師。

Photosource|如何讓你愛上我從服務設計看UI/UX   若你想要讓一個人愛上你，UX的專業是瞭解你的心儀對象，如何從看見你之後，經過什麼樣的歷程與轉變，到最後才會愛上你，中間歷經的過程可能包含：看見、記住、瞭解、試探、接受、在乎、愛上。

  而UI的專業則是透過實際的行為，讓對方產生如UX所陳述的感覺，以一步步走向愛上你的路，比方說，如果想要讓對方看見你，你可能可以耍帥、打扮得很漂亮、展現自己的風趣幽默等，而要讓對方記住你，你可能要進一步與他有更多的互動、像是聊天、關心等⋯⋯   簡單來說，UX的工作是要讓使用者的心理認知產生轉變，瞭解誘發動機，是一種無形的設計過程，關乎感覺；而UI則是要讓UX想要產生的轉變，透過視覺安排與設計具體呈現，比如說整個網站的安排設計或是產品的包裝，達成UX期望讓使用者產生心理轉變的具體行為。

  事實上UI、UX在設計師的世界仍然是有部份重疊且複雜。

Photosource| Asinthecity   廣義的UXDesigner指的是以設計為方法作為優化用戶體驗，多專注在使用者介面的設計，而種類可以再細分成互動設計（InteractionDesign）、視覺設計師（VisualDesigner）/視覺界面設計師（GraphicUserInterfaceDesigner），以及設計研究員（DesignResearcher）。

  若以網站上的一個行動呼籲（CalltoAction,CTA）按鈕來說，設計研究員是提出為什麼需要那個按鈕的人，視覺設計師是負責設計按鈕長的樣子（如形狀、顏色、大小），而互動設計師則是決定當使用者點選了CTA後，要導向哪個網頁的人。

  參考資料＆延伸閱讀：第一次轉UXDesigner就上手   讀到這裡你會發現，UXDesigner跟你想像的「設計師」不太一樣，很多公司可能在徵才的時候寫UXDesigner，但事實上他們聘請來的UXDesigner可能都在做和UIDesigner重複的VisualDesign，而沒有發揮到「用戶體驗」的這項專業。

作者| DorisLin |本文轉載自TransBiz跨境電商顧問xAmazon品牌代營運《UIUX設計是什麼？用9個提高網站轉換率的方法告訴你》   魔鬼訓練營為年輕人解決低薪，搶攻高薪職缺-請上1111富酬者大聯盟 為自己加薪30%，請上數位行銷學院爭取加薪機會更多高薪職缺、進修課程、加薪證照請上1111 立即前往【1111解決低薪】了解更多 上一則 回列表 下一則 延伸閱讀 【我如何靠賣數位商品賺進六位數】上篇–點子生成：如何知道到底要賣什麼？ Mixkit — CC0可商用免費影片素材下載 一年全球增加964家店，看「一芳」的展店哲學與行銷策略 IG網紅買了多少粉絲？殭屍粉絲、互動數、熱門貼文分析工具 台灣：亞洲唯一「消失的高薪服務業」國家 Videezy免費下載上千個高畫質HD、4K影片素材，可個人或商用免註冊 你知道Switch什麼遊戲最紅嗎？「這款遊戲」靠網路聲量碾壓眾人！ 寵物玩具也推訂閱制！紐約新創5年賣出2億美金 【行銷趨勢】影響力行銷，怎麼讓KOL幫企業增加影響力？ 【AIE】美食贊助這樣才吸睛！品牌找網紅合作找對人了嗎？ 品牌電商經營Instagram必知的好用工具，抓住眼球就靠這個了！ 2019電商PM都應了解的5大數據運營指標-【數據乾貨大全】 大家都在找的社群小編要會多少技能？十大特質第二種讓人崩潰… 【社群行銷】9個必學的Instagram廣告案例 AdobeSpark–最平易近人的Adobe線上製圖／做影片免費工具 善用GoogleAnalytics「跨裝置報表」，精確掌握消費者行為 全球華人股份有限公司(1111人力銀行)版權所有©1111JobBankAllRightsReserved.