追求卓越一諾千金

藍藍設計-_诺基亚166,2011年成立_-|斯玛特卡余额查询,主創清華團隊||-注册了彩票怎么注销,專注軟件和互聯網ui設計開發_--361彩票官网登录。擅長企業信息化管理||_宋家王朝 喜多郎、監控_-|盈鼎国际、大數據軟件UIUE谘詢和設計開發服務_-7788电视剧百度影音。立足UI_||132彩票平台官网,好好學習|||张柏芝近况,天天進步|-方舟降压仪怎么样!


區分「取消」與「關閉」的設計差異

2019-9-28 泥人張 交互設計及用戶體驗


區分取消與關閉|阴道老化,可以很大程度上避免丟失用戶已操作的內容_|_2000彩官网。在關閉視圖之前保存用戶的更改-|-注册送彩金彩票网,使用文本標簽而不是「X」圖標_众赢国际官网下载,並在破壞性操作之前提供確認對話框-_众发彩票网。

讓人迷惑的「X」圖標

很久以前|--苍井空50分钟无码,「X」這個符號是用在地圖上__集美大学诚毅学院体育教研室,標記「寶藏的藏身地」-_|云顶娱乐网址411。但在今天的數字化界麵中_--第一财经视频网,「X」符號不再用來標記位置-_|零佣通,而是被用來取消進程_-易盈彩票,或者關閉某個臨時頁麵/彈框_|苏州大润发官方网站。但是如何確定「X」代表的是「取消」 還是「關閉」--古蔺教育网?有的時候可以確定_-_求身份证号,有時卻模糊不清難以界定|_-洛阳三套。

其實_-|物合网,主要的問題在於「X」圖標缺少了文本標簽|_券老婆。當同一個圖標在不同的界麵_108彩票娱乐平台,卻代表不同的含義-|爱维侦察 地址,該圖標的可用性就會受到影響-_|红米手机缺点,因為用戶判斷不了到底是什麼含義fifaol4。

為什麼要區分「取消」與「關閉」

當用戶單擊/點擊「X」按鈕來關閉模態彈框或視圖時__河北职称信息管理系统,係統會完全取消該過程並清空之前所有操作|__格瑞特月神学院,這讓人沮喪|-|致富彩票邀请码,甚至抓狂|--125摩托车改装。因為用戶通常認為「X」圖標表示取消或者關閉-_夜游黄浦江,所以區分這兩種可能性對於交互的成功至關重要__-2019最新亚洲足球排名。

在某些情況下_梁创齐,區分取消 or 關閉並不重要-_-霹雳天使1。當一個彈窗占據你的大部分屏幕時|_234彩票提款,點擊「X」按鈕(盡可能快地)__海信成都家电产业园,既可以關閉該模態___阿提查 春那侬,也可以取消它可能觸發的任何進程_--邮电局上班时间。

但是_-坊组词,如果頁麵中包含正在運行的計時器|_-南宁君怡酒店,正在播放的音頻-__11086可信吗,正在選擇多個選項標簽--马三家子,或其他類型未保存的內容_--胆清强磁贴官网,那就很有必要說明「X」圖標所代表的意義-_非常了得 陈星光。因為用戶可能打算讓計時器或音頻繼續運行_-|168彩票怎么不可以用了,或者希望立刻應用這些選好的選項標簽-_108娱乐正规吗,或保存正在進行的工作---超级红人节视频,同時希望關閉該視圖繼續其他操作-_久爱弹弹堂。

例如_-|奥特曼剧场版有哪些:絲芙蘭在結賬過程中|_|畅购卡不能用,使用模態窗口來展示用戶可以添加到購物車的免費商品__|重金属梁铮。在以下示例中-|金陵十三钗小说结局,單擊「 ADD(添加)」按鈕選擇商品後-|-盈众彩票合法吗, 該按鈕直接被變成了「 Remove(移除)」||自由篮球pf加点,看起來似乎商品已經被添加到購物車中了|_|掌信彩赚钱可靠吗。但是|--5800塞班论坛,實際上當用戶單擊右上角的「X」圖標後-_|鲁阁初恋,該商品並不在購物車中_||肉图。他需要再重複這個步驟_-|安利净水器,最後點擊「Done(完成)」按鈕_-_苏州作品版权登记,商品才會被加入購物車|-重庆厨房制造。

Sephora__-川师附中初中部:單擊右上角的「X」會取消選擇這些試用商品整個過程_-张柏芝约谈谢霆锋。用戶必須先單擊「ADD」|_大连好旺角房屋中介,再單擊「Done」才能將商品添加到購物車|__洛阳绿营。

如何避免丟失用戶正在操作的內容

要避免丟失用戶正在操作的內容|-云购彩票这个app可信吗,首先需要確定用戶的意圖_|亿彩彩票首页,是取消還是關閉-|-卓易彩票怎么暂停服务,並提供明確的選項--_雨过天晴序列号。有以下幾種方法_-易彩彩票是不是黑平台:

  • 主動要求用戶確認他們的意圖||山东淄博陶瓷展;
  • 使用明確的文本標簽而不是模糊圖標|果酱汉堡店变态版;
  • 顯示兩個不同的按鈕-_侍从加文:「X」圖標表示關閉視圖(可以自動保存頁麵內容/操作)||16楼影院,而「取消」則代表放棄該過程_-关于月球的知识。

1. 要求確認

如果用戶在已經執行操作的模態彈框或頁麵視圖中--医疗政策,點擊「X」圖標||苏锡常镇,app 則可以在關閉視圖之前_-暗组,直接詢問用戶是否應用該操作|-|聚会去哪里,來確認其意圖-|五里牌租房。此解決方案非常適合會破壞用戶工作的破壞性取消操作_亿发国际官网ibb。例如|-小学生美术作品,過濾器視圖可能會被意外關閉__|最新刷q币软件,並且關閉會導致用戶丟失其選定的選項_-朗姿代购。

這個問題在移動端界麵上很常見--234彩票,因為過濾器視圖占用了很大的屏幕空間|-_澳优积分网站,這使用戶很難或不能判斷是否已經應用了那些選擇_-_阿拉尔租房。為了防止這種潛在的錯誤_|卡玛苏特拉,在關閉過濾器視圖之前__|通辽刘大鹏,跟用戶確認是否要應用這些選擇並關閉視圖_-|开店教程,抑或是清除這些選擇-|-扬州八怪画竹子。例如--_娱乐天地下载:下圖中_|093彩票提现,當用戶選擇後-||新金庸群侠传2攻略,點擊「X」圖標時-邯郸晚报电子版,Lowes 會出現如下確認彈框--_132彩票官网注册。

左 -|-妇之宝:點擊「X」圖標或返回箭頭||-苏约卡盟,所有的選項都會被取消|-看图猜成语高级版,並將用戶帶回上一個頁麵__优博仿生配方奶粉段。右__-球衫堂:點擊「X」後|_106时时彩网站,出現一個確認對話框--_花都区教育局,確認用戶是應用還是取消篩選--_药品炒作,然後再返回結果列表頁|_15号买的福利彩什么时候开奖。

同樣__氨糖为何橄固力牌最好,當用戶關閉正在進行的課程時||_小爸爸13集插曲,語言學習應用Duolingo 會顯示一個確認對話框||_108官网彩票,課程進行中不能中途離開_-|android java模拟器,除非確認「退出」|--7k 7k小游戏。至少_-_苏州网上车管所,該 APP 向用戶傳達了這一限製_--陈国栋简历,同時他們也可以選擇「取消」來繼續課程-中成快递。點擊「X」按鈕將結束當前課程__林志炫北京演唱会。為了防止出錯|-清穿之花妖耿氏,結束前會出現一個確認對話框|-霓虹灯led动画软件。

缺點|结婚照要求:

  • 雖然確認對話框在避免「X」圖標有歧義方麵很有效|-105彩票cc苹果版,但它卻添加了額外的步驟-_novela机械碟刹;
  • 用戶在按下「X」圖標之前還是不知道它到底做了什麼-|四川特色,代表什麼意思-|陈中信,因此他們可能會對這個操作感到疑惑___永胜讨债2000会上门吗。

2. 使用文本標簽

不要完全依賴對話框來讓用戶確認模糊的「X」圖標||105彩票网页版,而是使用明確的文本標簽_-_众赢彩票开奖直播网。文本可以消除歧義-|梨花女御多肉,並清楚地傳達將發生的操作__卧槽路:取消與關閉银彩免费注册。

Yelp 的篩選頁麵在屏幕頂部提供了標有「Cancel(取消)」和「Reset(重製)」的按鈕-尼伯特台风实时路径,在底部提供了一個大大的「Apply(應用)」按鈕_傲霸九州星辰。類似地-_苏易正,Etsy 中的 Filters 視圖提供了「Clear(清除)」和「Done(完成)」兩個按鈕-_-定陶县教育信息网。

注意---亿发彩票安不安全:Etsy 使用「Done」而不是「Apply」|__陇桥学院地址,因為過濾器一經選擇就可以被應用-||阿ben白吉胜,而這裏是關於開關切換與否的建議-|_金根男爵。

(左)Yelp|金堆城贴吧:Cancel|_-1吨水多少立方米、Reset 和 Apply 這三個文本標簽既直接又清晰-|设备维护记录表,這樣用戶就不太可能不小心關閉視圖而丟失他們過濾器中的選擇__|拳皇97无限气下载。(右)Etsy--众博彩票是正规的吗:Clear 為用戶取消提供了一種清晰的方式|__诺基亚7070拆机教程,而點擊 Done 則返回到「產品列表」頁-阜新苏阳事件,其中的選擇已經應用|__靓眼网。

3. 關閉並保存

如果必須使用「X」圖標而不是文本標簽(比如為了以節省空間_-校园邪奏曲,或者正在遵循團隊的設計語言)|_-256老彩票,請謹慎使用_-小黄视频,並在用戶完成前保存操作/內容_||鼻科手术中文版。另外||硫酸小檗碱,可以提供一個單獨的「取消」按鈕-|栾海燕,讓用戶在進程之外有一個緊急出口|--106在线彩票安卓,並消除「X」在兩種含義之間的歧義|-_云顶娱乐是不是真的吗。

例如__|云发购快三:Gmail 會自動保存在非模態窗口中填寫的郵件信息到草稿(Drafts)-生化电影排行榜。這樣的好處是_-_火瀑吧,用戶在需要折疊或關閉該窗口時|-金庸群侠传之苍龙逐日地图,仍然保存原來的內容以便於下次繼續編輯-|阶梯教室层高。將鼠標懸停在消息窗口右上角的「X」圖標上時-_易彩票网站wwwycpan,會顯示一段提示|||美年达揭盖赢奖:Save & Close(保存到草稿並關閉)|_-女总统音译歌词。此外__2013年考驾照多少钱,點擊窗口右下角的「垃圾桶」圖標可以刪除該郵件|众盈彩票投资是真的吗?,這個圖標離頂部的「保存和關閉」選項很遠__|银河时时彩,可以防止用戶誤點-||永州八记作者。

Gmail---众盈娱乐:Hover 透露_-石钟乳和石笋,「X」圖標是用於關閉窗口而不是刪除草稿||-谈爱李白原文,它允許用戶保存並關閉消息窗口而不會丟失剛剛正在編輯的郵件--7k双人小游戏。

對於長進程或傾向於在後台運行的進程(如計時器)_-出售事故车手续,默認自動保存也是一種很好的解決方案-_|093彩票邀请码。

例如|秦皇岛高中排名,Glow Baby 中__-陈龙 羽毛球,後台運行喂食或睡眠計時器時-|-画家乡的画,用戶還可以瀏覽 APP 的其他區域|鹰爪门。因為這些計時器一般會運行很長一段時間__-老师给学生的毕业赠言。此功能還能讓用戶在 APP 中做其他的任務操作_|公顷换算,例如記錄之前換尿布的時間|勇者斗恶龙怪兽篇joker2金手指、瀏覽文章_-锦龙堂、逛論壇等_秦国赵弋。點擊計時器視圖中的「X」圖標也隻是關閉窗口並不會取消正在運行的計時器男儿当入樽粤语版。

Glow Baby__shinee隐藏摄像机:(左)點擊運行計時器視圖中的「X」圖標||_霍林河政府网,在不停止計時器的情況下取消視圖|__奢侈品牌标志,從而允許用戶繼續使用 APP 記錄其他類型的事件_--诸葛亮哭周瑜歇后语、參與社區討論|_锅盔牙子、閱讀文章等-|_公羊羽。(中)運行計時器的狀態顯示在屏幕頂部的狀態欄中_||胡静雨。(右)在計時器暫停時點擊「X」圖標__红酒倒进高脚杯,彈出「放棄」或「取消」按鈕以確認用戶的真正意圖-|文殊菩萨是男是女。

請注意|_易发彩票app:在關閉前保存中間工作或維護正在進行的過程是主動的__五年陈艾,但有時可能會與用戶的意圖相反-_金寨租房信息。如果用戶打算通過單擊「X」按鈕取消其選擇_|一千个奥特曼大战一千个怪兽电影,那自動應用這些選擇可能會令人困惑和沮喪|-喜孕宝。

這就是為什麼還必須有一個單獨的「取消」按鈕_优点彩票怎么样,給用戶一個出口-_八仙绘,而不是強迫他們必須關閉時自動保存__-中国电信iphone4。

結論

雖然「X」圖標會造成模棱兩可|_雯雅婷漫画全集,而且經常導致可用性問題||远博娱乐彩票,但它不太可能馬上從所有接口中消失--往期聚划算。設計人員應該注意「X」圖標的多重含義_|敕令大将军到此,消除「關閉」和「取消」之間的歧義_-良田摄像头,並提供確認對話框或自動保存等保護性措施|_诺亚舟np1000,避免丟失任何用戶正在操作的內容-诺基亚3110c游戏下载。

若存在疑問__舒南,請記住_洛兹法雷德:先保存_|_致富彩票主页,再退出|_银神。

小思考

為什麼手機驗證碼登錄微信/淘寶時||云顶彩票官网,驗證碼輸入錯誤慢生活,二者都是用的模態對話框提示用戶-_众发彩票代打兼职,而不是用 Toast 呢__火焰之纹章圣魔之光石金手指?

  • 微信和淘寶的用戶群體都很龐大|-泰安银泰中心,幾乎橫跨所有年齡層_-湖南基础教育网。Toast 出現又自動消失的交互體驗-|亿博彩票是真的吗,用戶會感到不可控|_365彩票能提现吗,尤其是對大齡-_|注册现金送彩票、老齡的用戶不夠友好-_|诛仙漫画下载。
  • 也有悖於 iOS 人機交互指南中提到的「用戶控製」這一原則||hp5200打印机驱动下载,我想這也是 iOS 設計語言沒有 Toast 這種控件的原因之一吧-_铠甲勇士2刑天后传。
  • 而模態對話框雖然幹擾性較強__易彩网是真的吗?,但用戶可以隨時控製|||炫彩魔盒,在使用過程中是用戶掌握主導權|_s2总决赛we。

補充||_闪电强效瘦:Toast 這一控件|-浙江中小学教师培训管理平台,原是 Android 係統的控件_-众益彩下载专区。但自 Android 5.0 推出原質化設計後-_-绍兴三味影院,Toast 就被弱化|_玄魔神变,而是將 Snackbar 作為官方推薦的控件_-干洗价格。如今在 Material Design 中更是找不到 Toast 的蹤影-|-众发平台下载。主要原因還是 Snackbar 在交互友好性方麵比 Toast 要好_||苏州日报电子版,例如|-_长沙口碑网:支持手勢交互金华职业技术学院信息工程学院、支持與 CoordinatorLayout 聯動等-11086苹果移动彩票。

標簽: 設計差異___庆聊;取消按鈕|_喜悦张海军;關閉按鈕 « 品牌年輕化=品牌年輕人化_冰心原名? | 跨平台設計 ___陆虎自由人:平台選擇»


訂閱Rss