2020-12-17 前端達人
你是想給用戶提舒適體驗，還是想給他們一個麻煩？
如果您想讓他們的體驗更快更容易，請使用輸入框上面的字段對齊標簽.或輸入框內的對齊標簽模式。
與左對齊和右對齊的標簽相比，頂部對齊或內部左對齊標簽填寫起來更快、更容易。這是因為標簽只需要有一半多的視覺固定物。
頂部對齊標簽還允許用戶以一個可視方向向下移動輸入框。左對齊和右對齊的標簽需要兩個視覺指示才能填寫。
頂部對齊標簽的唯一缺點是，它們可以使表單變得很長。但是現在用戶滾動的頻率越來越高，所以這不是問題。
通過減少字段之間的空白，可以減少表單長度。您還可以將表單拆分成多個頁面，以使表單更短。
頂部和左/右對齊標簽之間的差異很明顯。頂部對齊標簽更容易在眼睛上，并使表格更容易填寫。雖然他們可以使表單更長，
但用戶將從完成表單所需的時間和精力的減少中獲益更多。
如果頂部對齊的標簽能夠給用戶提供更好的表單體驗，那么它是值得采用的。設計師應該更多地考慮他們的字段標簽對齊。
它可以區別于用戶填寫表單還是放棄表單。
“取消”按鈕是在沒有完成任務的情況下將用戶帶回原來屏幕的輔助動作。
根據它們的功能，最好的順序是什么？“確定”按鈕應該出現在“取消”按鈕之前還是之后？
許多人提到了以下幾點平臺約定作為答案。雖然這似乎是一個解決問題的方法，但實際上并非如此。它不能回答哪個位置對用戶更好，以及為什么。為了一致性而遵循平臺慣例的建議是不夠好的，給設計師留下了空手而歸的機會。
“一致性”是設計師們常用的一個詞。不深入考慮用戶面臨的設計問題也是一個流行的借口。如果一個人不知道為什么會存在，遵循設計慣例有什么好處呢？
如果某個設計約定對用戶有害呢？設計師應該為了一致性而盲目地遵循嗎？糟糕的設計實踐是否應該持續下去，因為設計師們希望通過平臺設計的一致性來解決每一個問題？
今天，有一些平臺設計約定被廣泛使用，因為它們是為用戶工作的。但這里的要點是，平臺設計的一致性永遠不應該讓設計師滿意，因為這是做某事的唯一理由。理解為什么您應該以一種方式而不是另一種方式來設計您的用戶界面的原因是關鍵。
人們可能會說，讓你的動作按鈕突出給它更多的視覺重量和一個清晰清晰的標簽比它的位置更重要。雖然動作按鈕的視覺重量和標簽是一個重要的設計方面需要考慮，但它不是唯一的方面。
只關注一個設計方面而不是其他方面是一個粗心的設計師的行為。一絲不茍的設計師會思考每個設計方面是如何影響用戶的。
對于設計師來說，最難搞清楚的是主動作和次要動作是如何放置的。這就是為什么“確認”/“取消”按鈕的爭論在設計師中如此流行的原因。
當你通過了平臺慣例的爭論后，你會質疑哪個位置最有效。您可以通過分析設計如何影響用戶來解決這個問題。
一些設計師認為，在第二個操作之前將主操作放在左邊對用戶更好，因為它更接近，因此，點擊的時間更少。
這是有意義的，但您不能忽視這樣一個事實，即用戶在選擇要采取的操作之前將查看他們的所有選項。
這意味著大多數用戶不會盲目地單擊主操作按鈕而不查看它旁邊的輔助操作按鈕。
他們將首先看到左邊的主要動作，然后查看右邊的次要動作。然后，他們會把眼睛移回主要的動作，點擊它。這將在多個方向上總共創建三個視覺固定。
將其與放置在對話框右側的主操作和放置在左側的輔助操作進行比較。用戶從第二個動作的眼睛開始，然后將眼睛移到主動作上單擊按鈕。這在一個方向上總共創建了兩個視覺固定，給用戶一個更快的視覺流。
用戶只關注每個按鈕一次，并在主動作按鈕上結束。將主操作放在左邊可能會使用戶更容易到達，但是當您從用戶的思維過程和視覺固定的角度來看速度時，將主操作放置在對話框的右側實際上更快。
當用戶單擊輔助操作按鈕時，他們期望應用程序什么也不做，并將它們帶回到原來的屏幕。因此，“取消”按鈕的功能類似于“后退”按鈕。
當用戶單擊主操作按鈕時，他們期望應用程序執行按鈕所述的操作，并將其轉到下一個屏幕。因此，“確認”按鈕的功能類似于“下一頁”按鈕。將輔助動作按鈕放置在左側，主動作按鈕在右邊映射到用戶可以期待的‘后退’和‘下一步’按鈕功能。
它類似于分頁按鈕的放置方式。將用戶帶到下一頁的按鈕位于右側，將用戶帶回其早期頁面的按鈕位于左側。這個按鈕的放置工作是因為它映射到用戶從左到右的閱讀和導航方向，其中右是前進的方向，左是后退的方向。
對話框中的“確認”和“取消”按鈕應該遵循類似的交互模式，因為它們的功能類似于分頁按鈕。
不僅如此，在中國用戶習慣了左右方向的模式。
將您的主要操作放在右側，將次要操作放置在左側，將使您的對話框按鈕更容易、更直觀地為用戶所理解。
將您的按鈕放置在終端區域可以讓用戶看到他們最后需要采取的主要操作。這不僅改善了視覺流，也改善了任務流。
用戶在掃描時不會跳過主動作按鈕。當他們通過時，他們的眼睛就會盯著它，所以他們可以立刻點擊它。
另一個問題是設計師經常想知道他們是應該把按鈕放在角落里，還是把它們放在一起。當您將主操作和輔助操作放置在對話框
的角中時，它將很好地映射到左右方向。但是，由于‘取消’和‘確認’按鈕不是導航按鈕，所以沒有必要遵循方向映射。有時它弊大于利。
如果應用程序要執行用戶無法撤消的關鍵操作，那么用戶可以看到“取消”按鈕和“確定”按鈕是很重要的。在這種情況下，“取消”按鈕的功能可能像“先前”按鈕，但更重要的是，因為它充當安全按鈕，以防止任何更改。
在左下角放置“取消”按鈕的危險是，由于兩個按鈕之間的視覺分隔很大，它可能導致用戶忽略它。將“取消”按鈕和“確定”按鈕放在一起，可以使用戶更容易在一次凝視中查看和比較這兩個動作，從而選擇最佳的操作和點擊。
我們經常卸載軟件的時候一不留神就會點錯，或者是我們在裝某一個軟件的時候全家桶一擁而上。所以在不同場景當中我們所用的按鈕形態也是不一致的。
菜單欄沒有主次之分
當您對菜單項進行全文本或全圖標處理時，問題就會出現.當用戶掃描他們想要的項目時，他們的注意力分散在菜單周圍。這是因為沒有層次來吸引他們的注意力。
通過將用戶的注意力引導到您的主要項目，使您的菜單可掃描。
要實現這一點，我們可以看下面設計形式來強調重點內容
與其在每個菜單項上放置圖標，還不如將其放置在主菜單項上。視覺強調首先將用戶的注意力引導到這些項目上。
次要項目上缺少圖標，這使得它們能夠得到其余的關注。
如果要使所有圖標處，請稍微放大需要突出的圖標。
稍微的增大會使視覺效果有很大的不同，同時字形更容易辨認，每一行的線高也會增加。讓整個看起來更加有空間感一些。
讓用戶瀏覽閱讀起來也會更加舒暢一些。
甚多的設計師設通常喜歡使用主按鈕的輪廓形狀作為輔助按鈕。按鈕樣式看起來可能不一樣，但還不夠。
他們仍然會競爭，因為他們的顏色對比度相等。
為了給主按鈕更多的注意，削弱輪廓按鈕的對比度。與其使用重顏色，不如使用它的色調。你可以通過降低重顏色的亮度和飽和度來制作。確保對比度足夠高，以達到主要的按鈕突出性。
設計師的另一個趨勢是把第二個按鈕變成黑色。他們認為，使用中性的顏色，它是不會競爭的。然而，黑色按鈕更為突出，因為它有一個更高的對比度。
不要使用黑色，而要使用重顏色的色調，以使輔助按鈕比主按鈕更弱。要做到這一點，增加亮度和降低飽和水平。
將彩色按鈕與中性灰色配對并不總是意味著彩色按鈕會得到更多的關注。如果主按鈕的顏色太輕，則中性輔助按鈕將更加突出
要避免這一錯誤，請選擇不太明亮的顏色。明亮的顏色可能看起來很有吸引力，但它與白色背景或文字的對比不太好。在主按鈕上使用更暗的顏色，這樣第二個按鈕就不會引起注意。
在設計當中我們經常會遇到做選擇性的勾選，往往很多設計師會犯的一些錯誤問題和選擇障礙問題。
我們設計單選框的時候這不是秘密而是讓用戶做出選擇，復選框是很難點擊，因為他們的小擊中目標。
設計師通常會讓標簽點擊，但如果它不是直觀的，那也于事無補。
通過將復選框轉換為復選標記，您可以為用戶提供更大的命中目標和更清晰的交互提示。
有時你可能想提供不同數量的商品。使用多個復選框復制它會產生更多的文本來讀取，并使界面混亂,且讓用戶難以進行選擇。對于增量輸入更改使用數字選擇器一次顯示該項會為更好些。
總結以上兩點，實際商用應用案例如下所示
卡片內容有幾種文本類型，提供不同的信息功能。讓我們看看基本內容卡的文本類型。
首先是眉毛，它是一個明確的詞或短語，用來描述內容的主題。
還有一個標題，它用一個句子中的幾個單詞告訴用戶內容是關于什么的。
在此之后，就會有一個描述內容的正文。
最后，就是時間與操作的按鈕
必須通過確定哪些文本類型對用戶更重要，從而為您的卡片新聞建立文本層次結構。
此內容新聞卡片的適當文本層次結構為：
1.眉毛-可以是時間，可以是新聞分類
2.標題-最重要的是，因為它描述的內容最快。
3.正文-包含一個描述性段落，但閱讀時間最長。
4.描述內容的正文對內內容的簡要描述。
您的內容卡應指導用戶按此順序瀏覽文本類型。要實現這一點，您需要使用瀏覽控制對文本類型應用適當的視覺強調。
通過適當的視覺強調，可以控制用戶瀏覽的順序，并指定反映文本層次結構的瀏覽模式。
當掃描遵循文本層次結構時，用戶會浪費更少的眼球運動，并且可以更快地處理信息。
下面的示例說明了瀏覽控制如何讓眼球工作比較。不同的是強調不同的文本類型。
其他文本類型具有相同的強調度，這使得它們爭奪用戶的注意力。
在內容顏色的控制上我們可以為三種，重要的突出的需要用戶重點進行關注的就用黑色
例如：#333333 #222222 #454545 等等色值
在不需要突出的內容上我們可以用稍微淺一點的色值保證用戶能夠進行閱讀即可，
例如：#999999 #787878 #666666 等等色值更加容易記住
其他輔助的內容表達比內容正文更淺
例如：#bbbbbb #A8A8A8 等等色值
說到這里我要說一用戶體驗關于文字的事情如果做出來的設計文字是給自己看的隨意設計讀沒人會說你，有句話說的好：現在
是內容為王的時代，如果在內容上不夠吸引或者顏色不夠吸引眼球那就是一個很失敗的案例。
轉自：站酷
藍藍設計( www.dzxscac.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務