用戶體驗(yàn)設(shè)計(jì)是一個不斷發(fā)現(xiàn)和迭代的過程，在數(shù)字產(chǎn)品方面，總會有改進(jìn)的空間和值得探索的增長機(jī)會，因此設(shè)計(jì)過程是增長過程中不可分割的一部分。不過，在可用性（usability）和設(shè)計(jì)原則（design principle）方面，有一些久經(jīng)考驗(yàn)的規(guī)則，我們可以應(yīng)用。
本文總結(jié)了16種UX和UI的設(shè)計(jì)策略，這些策略可對于已上線的產(chǎn)品提供即時(shí)的增長效果，可以為更多的用戶帶來更卓越的產(chǎn)品使用體驗(yàn)。
1、效果最好的CTA（Call-To-Action）
如果您在操作中添加了一些上下文信息，那么號召性用語按鈕的效果將始終更好，但是請盡量不要超過三個字。如上圖案例所示，您可以使用“添加到購物車”來代替“添加”，或者使用“立即購買“按鈕來替代“購買”。
2、移動端字符
針對移動設(shè)備可讀性的最佳可用性原則是每行不超過9個字或50至60個字符，這項(xiàng)設(shè)計(jì)規(guī)則已經(jīng)經(jīng)過了大量的測試檢驗(yàn)。
3、移動端CTA
麻省理工學(xué)院觸摸實(shí)驗(yàn)室對人的指尖的研究得出結(jié)論，對于大多數(shù)成年人，食指的平均寬度為16-20毫米，這使得在移動端設(shè)備上，理想的按鈕尺寸為40-50像素。
4、單選按鈕和下拉清單
不確定何時(shí)使用單選按鈕以及何時(shí)使用下拉菜單的時(shí)候，謹(jǐn)記以下UX規(guī)則：對少于5個選項(xiàng)使用單選按鈕樣式，對超過5個選項(xiàng)使用下拉菜單。
5、分頁或無限滾動
許多用戶體驗(yàn)設(shè)計(jì)師傾向于使用無限滾動來使他們的設(shè)計(jì)更加時(shí)尚現(xiàn)代。但是，這對于嘗試查找正確內(nèi)容的用戶不起作用。對于電子商務(wù)或數(shù)據(jù)豐富的網(wǎng)站，面向目標(biāo)的UX應(yīng)該使用無限滾動進(jìn)行內(nèi)容探索和分頁。
6、默認(rèn)選擇
鍵入和額外的單擊具有很高的交互成本。要提高表單轉(zhuǎn)換率，請始終給予默認(rèn)選擇選項(xiàng)，以便用戶進(jìn)行最頻繁的交互選擇。
7、適度使用圖標(biāo)
過度使用圖標(biāo)是一個UI錯誤，通常會損害產(chǎn)品的使用體驗(yàn)。圖標(biāo)的使用應(yīng)始終具有強(qiáng)烈的含義，永遠(yuǎn)不要將功能隱藏在模糊的圖標(biāo)后面。UX黃金法則：如果標(biāo)簽不足以說明操作，請使用圖標(biāo)來代替。
8、錯誤消息
為了提高轉(zhuǎn)化率，請務(wù)必提供糾正錯誤的建議，以減輕用戶的認(rèn)知負(fù)擔(dān)。保持人性化和幽默感，避免在用戶面對錯誤界面或錯誤消息時(shí)流失。
9、清單或單選按鈕？
對于多選選擇，請使用清單選項(xiàng)，對單選選擇，使用單選按鈕。
10、使用占位符（Placeholder）顯示示例
使用占位符副本可設(shè)置更好的上下文并增加表單轉(zhuǎn)換。但是您應(yīng)該更進(jìn)一步-使用示例，而不是必需的字段名稱。例如，插入示例電話號碼（+44 757 869…），而不要輸入“電話號碼”或“ hi@pony.studio”而不是“電子郵件”。
11、手機(jī)上的可點(diǎn)擊區(qū)域更廣
移動設(shè)備上較寬的按鈕和可點(diǎn)擊區(qū)域始終比微型UI組件性能更好。因此，如果設(shè)計(jì)允許，請始終使用比移動設(shè)備上的單選按鈕，下拉列表或復(fù)制鏈接更大的視覺效果。
12、使用顏色進(jìn)行分類
用于重要分類的基于顏色的標(biāo)簽減少了認(rèn)知負(fù)擔(dān)。作為設(shè)計(jì)師，我們始終可以在關(guān)鍵設(shè)計(jì)屏幕上使用一些顏色，但是不要過度使用它，因?yàn)樗赡墚a(chǎn)生相反的效果并弄亂UX的層次結(jié)構(gòu)。
13、表單字段按鈕
始終對文本字段旁邊的按鈕使用不同的顏色，以確保它不會與文本輸入?yún)^(qū)域融合在一起。
14、完美的線條高度
我們都希望字體大小和行距之間能有一個完美的比例，通用UX規(guī)則是-保持行高比字符高20–30％，以提高可讀性。
15、合適的字體大小
界面中的字體大小可以區(qū)分文字內(nèi)容的層次，提升視覺效果。但是，為了避免文字出現(xiàn)模糊混亂的情況，設(shè)計(jì)師可以使用行高1.5的16px字體，這是進(jìn)行正文復(fù)制的最安全的選擇。
16、重疊的圖像使外觀更優(yōu)美
如果您想給設(shè)計(jì)增添些別致的色彩，請選擇重疊的圖片，尤其是在設(shè)計(jì)用戶個人資料頁面或卡片時(shí)。為確保視覺平衡，請始終保持圖像邊框與背景色匹配。
這16個有助于提升產(chǎn)品增長的技巧，你get到了嗎？請分享本文給更多小伙伴們一起學(xué)習(xí)吧！
作者 | 美國交互設(shè)計(jì)資訊
來源公眾號 | 美國交互設(shè)計(jì)資訊
