亚洲av午夜福利精品一区人妖,亚洲乱码日产精品a级毛片久久,91精品视频观看,青草青草久热精品视频在线观看

UI組件要點「狙擊」:按鈕設計的這些坑別再踩啦!

2022-3-3    純純

按鈕設計


為了設計正確的交互,我們需要回顧一下物理按鈕的歷史和起源。物理按鈕是UI組件的前身,當今的數字產品都還在大量使用它們。按鈕很棒,即使用戶不了解基本的機制或算法,只用手指觸摸就可以讓電器、汽車或系統運行/關閉。在《Power Button》中,作者Rachel Plotnick描述了當今按鈕文化的起源,并解釋了按鈕是如何成為數字命令方式的。


“你按下按鈕,剩下的我們來做。” ——柯達相機的醒目標語吸引了潛在消費者。


即使在今天,這也是吸引用戶的地方——通過簡單觸摸就能讓事情發生的即時滿足感。盡管有大量新的家用電器和設備都變成了觸摸屏,但物理按鈕并不會消失,因為它們讓人形成的行為習慣,會影響按鈕設計的直觀性和易用性,是一種永遠存在的實物參考。


01 按鈕 vs 鏈接

按鈕向用戶傳遞了操作的可執行性,在整個UI里很常見,例如:對話框、表單和工具欄等。按鈕和鏈接之間的區別,請注意:

-鏈接是導航到另一個地方時應用的,例如:“查看全部”頁面、“ Roger Wright”個人簡介等;

-按鈕是在執行動作時應用的,例如:“提交”、“合并”、“創建”、“上傳”等。



02 讓用戶直觀感受按鈕狀態

為按鈕創建正確的交互和樣式,是按鈕設計過程中重要的組成部分之一。在不改變組件或產生視覺干擾的前提下,每個按鈕的狀態都必須有明確定義,以使其與周圍布局區別開來。



正常—表示該組件已啟用交互;

突出提示—用戶使用鍵盤,進入編輯狀態;

鼠標懸停—當用戶將鼠標置于交互式元素上方時;

點擊—按下狀態表示用戶已輕點按鈕;

進度/加載—用戶操作行為沒有立即執行,表示正在完成操作中;

禁用—表示該組件當前處于非交互狀態,但將來可以啟用。


03 按鈕的顏色、形狀和大小

常見的是圓角矩形按鈕,這些按鈕即使在輸入框旁,用戶也能快速識別。按鈕樣式的選擇取決于用途、平臺和應用準則。以下是一些最受歡迎的樣式變化:



04 建立按鈕樣式等級

樣式主要用于區分重要和不重要的動作。創建動作層次結構,該層次結構將指導用戶進行多種選擇。通常,可以有一個突出的按鈕(該樣式通常稱為“首要”按鈕),剩下的按鈕則依據重要程度建立不同的樣式等級。



05 《Don’t Make Me Think》

這是可用性工程師Steve Krug撰寫的書籍標題,其中講到了一點:對用戶而言,界面清晰明了非常重要,不要給用戶制造難題。人們周圍其實已經被電子產品包圍了,多年使用各種設備、軟件的經驗,一定程度上固化了人們對按鈕外觀和功能的認知。如果與常見的“標準”存在較大偏差,也會給用戶造成困惑。



避免對交互式和非交互式元素使用相同的顏色,否則用戶不知道該點擊哪里。


06 一致性的重要性

“一致性是最強大的可用性原則之一:當事物始終表現相同時,用戶不必擔心會發生什么。” —雅各布·尼爾森(Jakob Nielsen)


一致性提升了速度性和準確性,有助于避免錯誤。創建可預測性,幫助用戶控制和實現產品中的目標。當創建主要、次要和第三種樣式時,試著找找一致元素,如顏色、形狀等。按鈕設計不僅要在設計系統內部保持一致,在整體平臺也要進行統一。



07 使按鈕足夠大以實現可靠交互

按下按鈕應該是一個簡單的操作任務,如果用戶無法正常進行,或在過程中錯誤地按到了相鄰元素,不但給用戶造成了負面體驗又浪費了時間。


對于大多數平臺,請考慮被觸摸的目標至少為48x48dp。無論屏幕大小,這種尺寸的觸摸目標的物理尺寸應為9mm,觸摸屏元件的目標尺寸至少是7-10mm。



對于圖標按鈕來說,請確保觸摸目標超出元素的可視范圍。這不僅適用于移動設備、平板電腦,同時也適用于網絡上的指示設備,比如鼠標。


08 無障礙設計

所有組件都應推行無障礙設計。目標區域的大小是影響可訪問性的因素之一,其他的則是字體大小、顏色和對比度,也有很多工具能檢查組件的設計性能。



設計師應與開發團隊緊密合作,確保按鈕與屏幕閱讀器協同工作。添加role =“ button”將使一個元素作為按鈕控件出現在屏幕閱讀器上。


09 手勢應用

手勢應用,讓用戶可以通過觸摸與應用程序進行交互。使用觸摸來完成任務,不僅提供了觸覺控制還非常節約時間。某些手勢(比如滑動以觸發上下文動作、雙擊或長按來標記喜歡等)每天都被人們廣泛使用,但對于普通用戶而言,它們仍然不太明顯,建議把它們替換給高級用戶執行操作。



10 按鈕標簽信息易于理解

按鈕傳達的信息與其外觀一樣重要,錯誤的信息會讓用戶感到困惑,甚至是誤導用戶操作。正確的按鈕標簽會引導用戶完成操作,最好使用動詞,并在按鈕上標記其實際功能。


就像按鈕在問用戶——“您要(添加到購物籃中)嗎?” 或“您要(確認訂單)嗎?”,避免使用Yes/No或過于通用的標簽,比如Submit。



11 確定/取消,還是取消/確定?

兩者都是正確選擇,但設計師可能會花幾個小時來討論哪個更合適。

-確定按鈕在前,是自然流暢的閱讀順序。Windows把確定按鈕放在了前面;

-確定按鈕在后,可以幫助改善流程。這種順序形式,幫助用戶再采取行動前,對所有選項評估,有效地幫助人們避免錯誤。蘋果則是把確定按鈕放在最后的;

任何一種選擇其實都沒有錯,也不會造成什么可用性災難。



12 避免使用禁用按鈕

每個人都遇到過這種情況:在屏幕上停留了幾秒或幾分鐘,怎么操作都沒反應,這才發現原來是禁用按鈕使我們無法進行下一步。禁用控件讓組件短暫處于非交互狀態,但如果使用不當,則非常容易讓用戶產生負面情緒。



我建議盡量避免禁用按鈕,最好始終啟用它,如果用戶未提供某些必需信息,則只需突出顯示空白字段或顯示通知可。


文章來源:UX辭典(站酷)

分享此文一切功德,皆悉回向給文章原作者及眾讀者.

免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

藍藍設計m.skdbbs.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 平面設計服務



日歷

鏈接

個人資料

藍藍設計的小編 http://m.skdbbs.com

存檔

亚洲av午夜福利精品一区人妖,亚洲乱码日产精品a级毛片久久,91精品视频观看,青草青草久热精品视频在线观看
<strike id="cy2gs"><menu id="cy2gs"></menu></strike>
  • <del id="cy2gs"><dfn id="cy2gs"></dfn></del>
  • 亚洲欧洲日本专区| 欧美—级高清免费播放| 激情综合五月天| 国产女主播一区二区三区| 欧美日韩综合在线免费观看| 欧美电影在线播放| 欧美v国产在线一区二区三区| 久久精品亚洲精品国产欧美kt∨| 午夜视频在线观看一区二区三区 | 久久久国产一区二区| 亚洲一区二区三| 一区二区欧美亚洲| 一本色道久久综合亚洲精品高清 | 欲香欲色天天天综合和网| 国产一区二区福利| 狠狠色综合色区| 红桃视频一区| 在线观看亚洲精品视频| 亚洲激情专区| 一区二区欧美日韩| 亚洲综合精品四区| 欧美一区二区视频97| 久久精品首页| 麻豆成人91精品二区三区| 欧美99在线视频观看| 欧美精品在线观看91| 欧美日韩在线视频一区| 亚洲一区二区三区涩| 亚洲私人影院在线观看| 亚洲欧美一区二区三区久久| 久久爱www.| 蜜桃av一区二区| 欧美日韩激情网| 国产精品丝袜久久久久久app| 国产日韩精品电影| 一区免费观看| 91久久精品久久国产性色也91| 99热免费精品| 午夜影院日韩| 美女脱光内衣内裤视频久久影院 | 亚洲精品乱码久久久久久黑人| av不卡在线看| 欧美一区亚洲| 欧美不卡一区| 欧美午夜电影在线| 国外成人免费视频| 91久久综合亚洲鲁鲁五月天| 亚洲视频中文字幕| 久久久久久伊人| 欧美激情中文不卡| 国产精品中文字幕欧美| 亚洲电影在线播放| 亚洲一区二区三区在线看| 久久久久久91香蕉国产| 欧美精品一区二| 国产欧美日韩一区二区三区| 亚洲国产成人av| 亚洲午夜av在线| 久久性天堂网| 欧美性猛片xxxx免费看久爱| 伊人精品成人久久综合软件| 99在线热播精品免费99热| 久久精品视频亚洲| 欧美视频精品一区| 国产亚洲欧美日韩在线一区 | 国产亚洲一区二区三区在线观看 | 欧美日韩伦理在线| 国产偷国产偷亚洲高清97cao| 亚洲欧洲视频| 欧美在线免费看| 欧美日韩国产电影| 国产中文一区| 亚洲尤物在线视频观看| 欧美成人免费一级人片100| 国产精品网站在线| 日韩午夜中文字幕| 久久亚洲国产精品一区二区| 国产精品久久久久高潮| 91久久久亚洲精品| 久久黄色影院| 国产精品啊啊啊| 91久久精品久久国产性色也91 | 久久久免费av| 欧美午夜剧场| 亚洲人成啪啪网站| 久久精品国产一区二区电影| 欧美午夜在线观看| 亚洲理论在线| 老牛嫩草一区二区三区日本 | 久久综合狠狠综合久久综合88| 国产精品欧美久久久久无广告| 亚洲九九爱视频| 久久综合一区二区三区| 国产亚洲午夜| 中国女人久久久| 欧美精品18+| 亚洲国产aⅴ天堂久久| 久久久久网站| 国产日产欧美一区| 午夜精彩视频在线观看不卡 | 一区二区激情视频| 欧美大片18| 激情综合色综合久久综合| 欧美一区二区三区在线播放| 国产精品免费一区豆花| 亚洲视频自拍偷拍| 欧美日韩p片| 亚洲美女性视频| 欧美成人网在线| 在线播放日韩欧美| 久久琪琪电影院| 国内精品写真在线观看| 午夜久久电影网| 国产精品一卡| 亚洲综合日韩| 国产精品久久久久久久第一福利 | 亚洲欧美一区二区原创| 国产精品海角社区在线观看| 亚洲无限乱码一二三四麻| 国产精品jvid在线观看蜜臀 | 欧美一级片一区| 国产精品美女久久久久久久| 亚洲一区二区三区精品视频| 国产精品福利影院| 亚洲一线二线三线久久久| 欧美午夜宅男影院在线观看| 亚洲素人在线| 国产精品视频网址| 亚洲欧美一区二区精品久久久| 国产欧美日韩在线观看| 欧美怡红院视频一区二区三区| 国产一区二区黄| 美国十次了思思久久精品导航| 亚洲第一天堂av| 欧美大片第1页| 夜夜嗨av一区二区三区中文字幕 | 久久aⅴ国产紧身牛仔裤| 国产一区二区黄| 久久久久久久久久看片| 1000部国产精品成人观看| 欧美成人精品三级在线观看| 亚洲精品一区二区在线观看| 欧美日韩精品免费看| 亚洲一区www| 国产欧美日韩综合精品二区| 久久精品在线观看| 亚洲成色777777在线观看影院| 欧美国产第一页| 亚洲午夜久久久久久久久电影院| 国产精品日韩欧美一区| 久久精品亚洲乱码伦伦中文| 亚洲国产精品成人综合| 欧美日韩国产免费观看| 亚洲在线网站| 国产一区二区三区最好精华液| 另类av一区二区| 日韩一级黄色大片| 国产精品久久久一区二区三区 | 欧美精品在线免费播放| 中文亚洲免费| 国产亚洲精品一区二区| 免费看亚洲片| 一区二区三区www| 国产一区二区三区在线播放免费观看 | 欧美看片网站| 亚洲欧美日韩中文播放| 黄色亚洲免费| 欧美日韩一区二区在线观看视频 | 亚洲欧美日韩精品| **欧美日韩vr在线| 欧美日韩亚洲在线| 久久精品1区| 日韩午夜电影在线观看| 国产日韩综合| 欧美国产日韩在线| 午夜一区不卡| 亚洲欧洲日本一区二区三区| 国产日韩欧美在线| 欧美日韩国产成人高清视频| 久久久精品tv| 宅男噜噜噜66一区二区66| 激情小说另类小说亚洲欧美| 欧美日韩免费高清| 久久久久久久久久久一区| 亚洲天堂av高清| 亚洲高清视频中文字幕| 国产精品美女诱惑| 欧美电影免费观看高清完整版| 亚洲中字在线| 亚洲人成网站在线播| 国产视频一区三区| 欧美日韩日日夜夜| 久久字幕精品一区| 亚洲欧美成人网| 亚洲精选91| 狠狠综合久久av一区二区小说| 国产精品黄视频| 欧美激情1区2区| 久久国产日韩| 亚洲欧美日韩国产|