01

寫(xiě)在前面

什么是UI設(shè)計(jì)？每當(dāng)你告訴非設(shè)計(jì)人員你的工作是什么，就會(huì)出現(xiàn)這個(gè)問(wèn)題。

當(dāng)今工作的大多數(shù)UI設(shè)計(jì)原則都圍繞著簡(jiǎn)單的導(dǎo)航和基本的聯(lián)系表單。另一方面，設(shè)計(jì)界正變得越來(lái)越富有新標(biāo)準(zhǔn)和技術(shù)，這意味著設(shè)計(jì)師將創(chuàng)造更多定制和動(dòng)態(tài)體驗(yàn)。

什么是用戶界面設(shè)計(jì)？該術(shù)語(yǔ)包含為機(jī)器和軟件創(chuàng)建的所有界面設(shè)計(jì)，例如網(wǎng)站和移動(dòng)應(yīng)用程序的外觀，以及它們的方向和易用性。一些界面設(shè)計(jì)師還將UI設(shè)計(jì)定義為創(chuàng)建圖形界面的藝術(shù)，不包括用戶語(yǔ)音和自然界面。

由于軟件是無(wú)形的，因此GUI設(shè)計(jì)在用戶與應(yīng)用程序或網(wǎng)站的交互方式中起著至關(guān)重要的作用，這意味著唯一良好的UI設(shè)計(jì)是實(shí)現(xiàn)簡(jiǎn)化和無(wú)縫體驗(yàn)的設(shè)計(jì)。

因此，兩個(gè)主要的設(shè)計(jì)基礎(chǔ)是效率和可用性，因此界面將使用戶能夠完成他們的任務(wù)，甚至沒(méi)有注意到設(shè)計(jì)如何工作。

基本上，最好的用戶界面設(shè)計(jì)示例是那些“隱形”的，并且它們?nèi)绱擞行У孛枥L現(xiàn)實(shí)，以至于用戶不會(huì)認(rèn)為是他生成了屏幕上發(fā)生的變化。

然而，有了這么多優(yōu)秀的UI設(shè)計(jì)，依靠效率來(lái)創(chuàng)建功能性產(chǎn)品已經(jīng)不夠了 - 界面也應(yīng)該是美觀和愉快的，就像聊天應(yīng)用和游戲一樣。

大多數(shù)時(shí)候，UI界面設(shè)計(jì)出現(xiàn)在服務(wù)上，用戶需要進(jìn)行交互才能完成任務(wù)，并且應(yīng)該包括執(zhí)行所需操作所需的所有工具和按鈕。GUI設(shè)計(jì)決定了用戶對(duì)軟件和硬件的方法，并通過(guò)使這些操作盡可能無(wú)摩擦來(lái)提高可用性。

UI設(shè)計(jì)者需要滿足用戶的功能和美學(xué)期望。他可以使用紙和筆，使用任何專用的可視化程序進(jìn)行草圖繪制，甚至可以使用任何材料直接構(gòu)建他的設(shè)計(jì)。他還可以創(chuàng)建模擬界面，以在發(fā)布之前測(cè)試其最終產(chǎn)品的效果。

重要的是區(qū)分用戶體驗(yàn)設(shè)計(jì)和用戶界面設(shè)計(jì) - 它們既復(fù)雜又多面，但具有不同的作用。創(chuàng)建用戶界面設(shè)計(jì)是為了將產(chǎn)品的布局，內(nèi)容甚至開(kāi)發(fā)轉(zhuǎn)換為用戶愉快和有效的體驗(yàn)。因此，它代表了嚴(yán)格的數(shù)字化任務(wù)。

UI設(shè)計(jì)師的主要職責(zé)如下：外觀，感覺(jué)，市場(chǎng)和客戶分析，研究，圖形開(kāi)發(fā)，品牌推廣，導(dǎo)航指南，故事情節(jié)，響應(yīng)性，交互性，原型設(shè)計(jì)，動(dòng)畫(huà)。

02

適用于所有設(shè)備和不同的屏幕尺寸

Web開(kāi)發(fā)實(shí)施和調(diào)整

創(chuàng)建良好的用戶界面意味著任何交互式設(shè)計(jì)的世界，它通常定義最終客戶如何看待和欣賞品牌。設(shè)計(jì)師顯然不是唯一負(fù)責(zé)品牌推廣的人，但將品牌轉(zhuǎn)化為產(chǎn)品將是他的責(zé)任。

要?jiǎng)?chuàng)建一個(gè)可靠的用戶體驗(yàn)體驗(yàn)不需要編碼，但設(shè)計(jì)人員也應(yīng)該了解當(dāng)前趨勢(shì)和技術(shù)。

通過(guò)這種方式，用戶體驗(yàn)設(shè)計(jì)對(duì)每個(gè)有興趣創(chuàng)建優(yōu)秀產(chǎn)品的人都很重要，而且還要了解客戶真正想要的東西。

另一方面，如果您進(jìn)入界面設(shè)計(jì)，您應(yīng)該對(duì)數(shù)字設(shè)計(jì)的基本原則更感興趣，并考慮向用戶呈現(xiàn)產(chǎn)品的方式，包括輸入反應(yīng)性和顯示質(zhì)量。

03

UI設(shè)計(jì)基礎(chǔ)

知道你在為誰(shuí)創(chuàng)造

你不會(huì)總是喜歡你正在設(shè)計(jì)的東西，但是你必須與這個(gè)想法和平相處。你應(yīng)始終將目標(biāo)與客戶的目標(biāo)保持一致，并全面了解他們需要什么以及他們想要什么。

從他們喜歡的界面中學(xué)習(xí)，并與趨勢(shì)和調(diào)整保持一致。是的 - 模仿競(jìng)爭(zhēng)對(duì)手的趨勢(shì)設(shè)計(jì)無(wú)助于您實(shí)現(xiàn)這些目標(biāo)！

小心模式

讓用戶有賓至如歸的感覺(jué)！您的界面不會(huì)是客戶第一次遇到此類設(shè)計(jì)，特別是現(xiàn)在人們使用各種網(wǎng)絡(luò)和移動(dòng)應(yīng)用程序時(shí)。

因此，您不需要重新發(fā)明輪子，而是簡(jiǎn)化這些過(guò)程，并解決問(wèn)題而不是創(chuàng)建問(wèn)題。出于此目的，嘗試堅(jiān)持常見(jiàn)和熟悉的模式，您的用戶將不會(huì)有任何問(wèn)題了解您的工作。

04

一致性很重要

保持工作一致。當(dāng)用戶了解如何在您的設(shè)計(jì)中執(zhí)行某些操作時(shí)，他們希望再次執(zhí)行相同的操作。一致性對(duì)布局和語(yǔ)言都很重要，并且僅適用于在所有實(shí)例上必須保持相同的少數(shù)主要元素。這樣，您和您的客戶都會(huì)更有效率。

05

以可視層次結(jié)構(gòu)排列元素

不要浪費(fèi)財(cái)產(chǎn)來(lái)向客戶解釋什么是重要的，而是使用界面設(shè)計(jì)來(lái)告知訂單。元素的位置，大小和顏色可以幫助您創(chuàng)建可視層次結(jié)構(gòu)，并為用戶提供明確的跟蹤路徑。請(qǐng)注意，成功顯示的層次結(jié)構(gòu)也會(huì)使您的設(shè)計(jì)不那么復(fù)雜。

給予反饋

接口都是關(guān)于交互的，這意味著您應(yīng)該與用戶保持聯(lián)系，讓他們知道他們正在做的是對(duì)還是錯(cuò)。使用消息和可視提示來(lái)評(píng)估操作，通知更改并建議解決方案，您的用戶將很容易理解您的工作。

期待錯(cuò)誤

對(duì)于某些人來(lái)說(shuō)，即使真正為他們服務(wù)，技術(shù)也是一種負(fù)擔(dān)。這告訴我們的是UI設(shè)計(jì)應(yīng)該容忍錯(cuò)誤和誤解，并且總是想出一種方法讓用戶撤消他們的行為（你是否因?yàn)槌錾掌阱e(cuò)誤而開(kāi)始填寫(xiě)應(yīng)用程序？）。同時(shí)，用戶應(yīng)該確切地知道他們搞砸了哪里，這樣他們就不會(huì)再讓它發(fā)生了。

為用戶轉(zhuǎn)移電源

只要用戶了解如何使用您的設(shè)計(jì)，就可以將力量轉(zhuǎn)移到他們的手中。讓他們獨(dú)立工作，將他們的行動(dòng)切割成消耗單位，這樣他們就不會(huì)在途中分心。完成任務(wù)的抽象方法也應(yīng)該是該過(guò)程的一部分，例如使用鍵盤(pán)快捷鍵。

06

保持對(duì)話基調(diào)

即使在最好的界面中，文案也很常見(jiàn)，因?yàn)樵O(shè)計(jì)師并沒(méi)有試圖引起轟動(dòng)。相反，他們用簡(jiǎn)潔明了的標(biāo)簽和說(shuō)明走在他們的用戶的腳下。用戶喜歡這樣，即使它不是花哨的，因?yàn)樗杏X(jué)不像是在聽(tīng)別人而是自己。

簡(jiǎn)單一點(diǎn)

許多人無(wú)法回答“什么是UI設(shè)計(jì)”的問(wèn)題，并且有充分的理由。他們中的大多數(shù)甚至都沒(méi)有看到界面，因?yàn)樗且粋€(gè)向前移動(dòng)的靜音引擎，但仍然可以脫穎而出。在對(duì)設(shè)計(jì)進(jìn)行任何更改之前，請(qǐng)估計(jì)用戶是否真的需要它以及他們是否能夠使用它。這是對(duì)你來(lái)說(shuō)唯一重要的事情。

保持下去

開(kāi)發(fā)接口不是一次性任務(wù)，而是需要頻繁迭代的持續(xù)過(guò)程。錯(cuò)誤會(huì)發(fā)生，但不要讓他們勸阻你！學(xué)習(xí)和練習(xí)，并嘗試創(chuàng)建用戶甚至不會(huì)注意到的無(wú)縫界面。

最佳用戶界面設(shè)計(jì)實(shí)踐

什么是UI設(shè)計(jì)？在了解更多信息時(shí)，您的第一課應(yīng)該是了解您的用戶，并清楚地估算他們能做什么或不能做什么。您還需要發(fā)現(xiàn)他們的興趣，偏好，傾向和技能。

以下是最重要的用戶界面設(shè)計(jì)實(shí)踐：

少即是多。界面越不可見(jiàn)，它就越成功。因此，擺脫無(wú)用的元素，并使用清晰的標(biāo)簽和消息。

保持一致性并僅使用熟悉的元素和模式。這樣做可以提高您網(wǎng)站的舒適度和信心，并幫助用戶在不到一時(shí)的時(shí)間內(nèi)完成工作。一致性是指布局，語(yǔ)言和許多其他設(shè)計(jì)元素，最好的方法是教會(huì)用戶如何優(yōu)化設(shè)計(jì)的功能。

通過(guò)排版提高清晰度。做出智能型決策，明智地使用字體，大小和文本排列。這樣，您的文本將更易于閱讀和理解。

07

您必須遵守的用戶界面設(shè)計(jì)法

清晰的法則

導(dǎo)致混淆和誤解的所有因素都會(huì)留在陰影中，這個(gè)規(guī)則也不例外！

您是Gmail用戶嗎？如果是這樣，您會(huì)記得Google更改頂部的導(dǎo)航面板，您可以在其中輕松訪問(wèn)云端硬盤(pán)，日歷，表格或其他服務(wù)。

然而，該公司提出了這樣的想法：他們可以通過(guò)將所有這些元素隱藏在抽象圖標(biāo)后來(lái)簡(jiǎn)化導(dǎo)航，因此許多Gmail用戶無(wú)法找到它的方式。后果是什么？問(wèn)Google的支持團(tuán)隊(duì)！

忽略您不理解的內(nèi)容絕對(duì)是人類，因此請(qǐng)確保您的界面不會(huì)導(dǎo)致此問(wèn)題。

背景法則

如果您邀請(qǐng)用戶控制設(shè)計(jì)中的某個(gè)對(duì)象，請(qǐng)將界面控件盡可能靠近它。用戶希望看到接口控件靠近他想要控制的對(duì)象。

這種嘗試的成功在LinkedIn上顯而易見(jiàn)，您可以通過(guò)單擊旁邊的小鉛筆輕松更改所需的所有數(shù)據(jù)（以及您的名字?。?。另一方面，F(xiàn)acebook允許你這樣做，它有一個(gè)非常漫長(zhǎng)而復(fù)雜的過(guò)程。

UI設(shè)計(jì)中的上下文要求讓人聯(lián)想到現(xiàn)實(shí)生活中的背景 - 準(zhǔn)備爆米花，將其放入微波爐并打開(kāi)設(shè)備。

如果您被要求跑到電箱并切換按鈕使其工作，您是否仍然會(huì)被鼓勵(lì)這樣做？可能不是，這也是大多數(shù)用戶改變他們的Facebook名稱的原因。

用戶希望操作流暢簡(jiǎn)單，讓他們成功！

指示行為的法則

大多數(shù)用戶因?yàn)楸灰蠖诰W(wǎng)站上執(zhí)行操作。原因很明顯，因?yàn)槊總€(gè)人都感到害怕采取了一步他沒(méi)有任何線索。

為了了解我們所說(shuō)的內(nèi)容，想想LinkedIn - 因?yàn)樗麄円肓薊ndorsements功能，他們并不依賴于用戶會(huì)知道它是什么的假設(shè)。

相反，他們?cè)趥€(gè)人資料頁(yè)面上提出了大型號(hào)召性用語(yǔ)橫幅，并將該功能轉(zhuǎn)變?yōu)樽罴迅轮弧?/span>

規(guī)則很簡(jiǎn)單：如果他們需要做某事，請(qǐng)他們?nèi)プ觥?/span>

及時(shí)反饋的法律

為了讓用戶感到自信，請(qǐng)給予他持續(xù)而明確的反饋。您可以按照Gmail的示例 - 您在此處執(zhí)行的每項(xiàng)操作都會(huì)收到通知，并且人們會(huì)覺(jué)得他們完全可以控制服務(wù)。

簡(jiǎn)化法則

用于完成復(fù)雜任務(wù)的Web設(shè)計(jì)應(yīng)分為幾個(gè)可管理的操作。沒(méi)有人喜歡復(fù)雜和冗長(zhǎng)的形式，因?yàn)樗鼈兪菈旱剐缘?，并且總是必須仔?xì)檢查插入的信息是否正確。

然而，如果你采用這種形式并將其分成更小的步驟（理想情況下有進(jìn)度條），人們就不會(huì)覺(jué)得它很無(wú)聊。

這就是所謂的簡(jiǎn)化和寬松法則，它告訴我們?nèi)藗儗幵附?jīng)歷5個(gè)簡(jiǎn)單步驟而不是單個(gè)大步驟。你恐嚇?biāo)麄冊(cè)缴?，他們就越有能力完成他們追求的任?wù)。

寫(xiě)在最后

UI設(shè)計(jì)可以通過(guò)許多不同的方式進(jìn)行解釋，因?yàn)樗梢越M合動(dòng)作的融合，幫助創(chuàng)建者在功能和形式上優(yōu)化其服務(wù)。

簡(jiǎn)而言之，UI設(shè)計(jì)決定了用戶如何與產(chǎn)品/服務(wù)進(jìn)行交互，以及他們對(duì)產(chǎn)品/服務(wù)的感受?，F(xiàn)在您可以獲得什么是UI設(shè)計(jì)問(wèn)題的答案。