什麼是 UI 設計？它為何如此重要？

如果您曾經使用過智慧型手機或電腦，您可能至少曾經想過「我該怎麼做？」。UI 設計師在設計應用程式或網站時必須不斷思考這個問題。但是，在我們了解使用者介面設計是什麼之前，我們需要先定義什麼是使用者介面。

基本上，使用者介面 (UI) 是人機互動發生的空間 — 在我們的例子中是指應用程式和網站。這仍然是一個廣泛的定義，但它引導我們到下一個問題 — 什麼是使用者介面設計？

什麼是 UI 設計？

UI 設計是專注於我們與之互動的應用程式或網站的外觀和風格的設計領域。與專注於使用者體驗的 UX 設計 不同，UI 設計專注於美學。應用程式的外觀和風格可以是使用者看到的顏色、他們互動的動畫、他們按下的按鈕或他們閱讀的文字。這些都屬於 UI 設計師的工作範圍。

UI 設計師致力於將 線框圖 賦予生命，並 建立原型，這些原型融合了 UX 設計師的意見，同時也滿足所有品牌需求。UI 設計師會關注每個細節，從排版到標誌的使用，並確保他們正在進行的每個專案都與其他接觸點相匹配。例如，您希望您的應用程式、網站和登陸頁面看起來都具有一致性。

同時，UI 設計師可以為設計帶來創新。由於他們更專注於專案的創意方面，他們可以想出更具創新性的方式來顯示資訊。當然，再次與 UX 設計師確認，以確保介面設計不會影響使用者旅程，始終是一個好的做法。

為什麼 UI 設計很重要？

由於使用者只能透過 UI 與您的應用程式或網站互動，因此其設計將決定他們的主要印象。如果您嘗試過任何粗製濫造的應用程式或網站，您就會確切地知道處理設計不良的 UI 有多麼令人沮喪。應用程式現在正在爭奪使用者的時間，因此您沒有太多時間給使用者留下深刻印象。事實上，根據 Localytics 的數據，71% 的應用程式使用者會在 90 天內流失。

使用者介面設計師為專案帶來創意優勢，使您的應用程式或網站在數百萬個其他選項中脫穎而出。即使您遵循的是更廣泛的叫車應用程式或預訂網站模板，創造性的 UI 設計也是您脫穎而出的方式。

除此之外，使用者介面設計也會影響產品的情感訴求。如果設計得宜，使用者介面設計可以激起使用者的興趣，並讓他們更熱衷於探索產品。但反之，它也可能讓使用者敬而遠之。

品牌意識在使用者介面設計中也扮演著至關重要的角色。藉由讓所有設計遵循相同的準則，您可以確保您的產品或服務更易於辨識。使用者介面設計不只停留在特定資產的設計。將其作為專案的重點，設計師就能夠從更宏觀的角度來設計，考量所有元素在最終成品中的整體外觀和協同運作方式。

使用者介面設計的黃金法則

為了幫助您設計出美觀的使用者介面，我們整理了一份您需要遵循的主要使用者介面設計原則清單。根據我們的經驗，以及 Ben Shneiderman 的 介面設計的八項黃金法則，和 Bruce Tognazzini 的 互動設計原則，我們可以將使用者介面設計的黃金法則簡化如下：

以使用者為中心

作為使用者介面設計師，根據您的專案，您很可能正在為廣泛的使用者族群開發應用程式。您終究是一個人，有自己的經驗和偏見。將自己設身處地為任何潛在使用者著想非常重要。堅持熟悉的設計和實務作法，對於確保不同經驗、年齡和能力的使用者都能有效地使用您的產品至關重要。

介面持續提供的回饋有助於使用者順暢地互動。使用者執行的每個動作都應該有某種回應來驗證他們的操作。這可以幫助他們更正動作，或讓他們專注於下一個動作，而不是思考他們是否做了什麼。您的設計也必須以尊重的方式向使用者指出錯誤，以維持他們的參與度。

尊重使用者的時間

對於經驗豐富的使用者和更新，請確保不要讓熟悉您應用程式的使用者感到驚訝。使用者喜歡掌控感，並且知道如何獲得他們想要的東西。使用者幾乎不會花時間去了解新的應用程式和網站應該如何運作。如果您要花時間引導他們了解您的特定使用者介面，請確保簡潔明瞭，並幫助他們達成目標。

使用者也會對不斷輸入資料或重複已完成的提示感到厭煩。如果您要求他們建立使用者帳戶或輸入一些資料，請思考「我如何能讓他們快速回到他們想做的事情」。

一致性是關鍵

在設計出既新穎又引人注目，同時又能讓新使用者感到熟悉的產品之間取得平衡是一項巨大的挑戰，但這很值得。提示、按鈕、顏色、字體、文案、選單和控制項都應該讓人感覺像是同一個協調一致的程式的一部分。

如果使用者從一個畫面到另一個畫面感到迷失，或者覺得某個區塊的外觀和感覺不同，他們更有可能回頭或完全停止使用您的產品。

不要讓使用者負擔過重

作為應用程式或網站的使用者介面設計師，您一次可以使用的空間有限。您可能會想盡可能地向使用者提供更多資訊，但在這裡，簡潔是您的好朋友。使用者不希望產品讓他們感到不知所措，他們想要的是清晰和簡潔。

如果使用者正在深入探索您的應用程式，請向他們顯示他們是如何到達那裡的，例如：男士 > 鞋子 > 運動鞋 > 時尚運動鞋。這將幫助他們更輕鬆地瀏覽，不必擔心記住資訊，而是可以專注於眼前的产品或服務。

使用者介面設計範例

既然我們已經涵蓋了使用者介面設計的黃金法則，讓我們看看它們的實際應用。以下是一些我們最喜歡的使用者介面設計範例，以及原因

Headspace

對於冥想愛好者來說，Headspace 不需要多做介紹。這個健康應用程式擁有超過 500 種冥想練習，每一種都針對獨特的健康主題。但是，如果您是他們內容的新手，甚至還不確定自己在尋找什麼，您可能會擔心不知所措，然後永遠關閉應用程式。Headspace 降低了您第一次接觸他們時的風險。

您建立帳戶後，應用程式會立即邀請您嘗試簡單的呼吸練習，讓您輕鬆體驗他們的內容，而不必先瀏覽龐大的資料庫。他們還會使用簡短、具體的文案邀請您，讓您清楚知道自己註冊後會得到什麼。更不用說它還搭配了一個醒目、清晰的「開始」按鈕。這表示您可以花更少的時間了解頁面要求您執行的操作，而將更多時間用於試用內容。

不想一開始就被迫進行呼吸練習嗎？您可以在螢幕右上角輕鬆找到退出按鈕，讓您可以選擇退出並自行探索應用程式。值得注意的是，退出按鈕清晰可見，但又不會太大而與「開始」按鈕爭奪您的注意力。這一切都有助於保持頁面的主要意圖清晰明確，並且超級容易遵循。

1Password

很少有密碼管理器能比得上 1Password 優雅、簡潔的使用者介面。當您打開應用程式時，您會看到一個鎖定的數位保險庫，它只提供一種與之互動的方式：輸入主密碼。沒有密碼？禁止進入。換句話說，使用者介面旨在完全按照密碼管理器的用途設計 - 保護您的密碼免受不速之客的侵害。

當然，您需要想出一個高度複雜且令人難忘的密碼，以降低其他人破解密碼的可能性。但是 1Password 提供了很多技巧！一旦您解決了這個問題，您就不必擔心有人會看到任何東西，除非他們知道您的超級秘密主密碼。

顧名思義：一個密碼統治所有密碼。

AirBnB

尋找旅行住宿可能是一場噩夢，尤其是當您試圖同時滿足多個條件時，例如價格合理、位置便利、大小和舒適度。這就是為什麼 AirBnB 的使用者介面讓這麼多旅行者回流的原因。這個概念很簡單。您輸入您要去的城市或國家，輸入您要入住的日期，然後就會獲得該地區房源的一系列搜尋結果。

每個房源列表都會預先顯示使用者最重要的資訊：地點照片、每晚價格、床位數量、五星平均評分，以及是獨立房間還是整套房源。此外，每個列表還會根據您選擇的日期提供總預估價格。

在不必點進房源列表的情況下就能獲得這麼多資訊，真是替使用者節省時間！

現在您已經了解 UI 設計的定義及其重要性，是時候將這些黃金法則應用到您自己的設計中了。無論您是經驗豐富的設計師還是初學者，這些原則都將永遠伴隨您。您也可以參考我們的免費 Sketch 初學者課程，了解更多關於 Sketch 設計的知識。

如果您才剛開始學習 UI 設計，我們希望這篇文章能幫助您了解它對產品品質的影響有多大。