中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

筆者從設(shè)計(jì)原理、分類和使用場景角度入手，結(jié)合實(shí)際案例梳理分析了彈窗中的交互體驗(yàn)設(shè)計(jì)。

工作越久，越會(huì)感覺到于細(xì)微處更見學(xué)問，但是，這個(gè)前提是我們能夠不斷總結(jié)自己做過的每一個(gè)案例，形成自己的知識(shí)體系，從而為我所用。這也就是人們常說的，工作中真正自己能夠帶走的是什么 。

?今天小胖就針對(duì)性的總結(jié)一下“彈窗”這個(gè)高頻的設(shè)計(jì)模塊，自己梳理總結(jié)，也希望對(duì)大家有用。

一、彈窗的定義、分類、使用場景

1. 彈窗的定義

定義：中斷用戶當(dāng)前操作并對(duì)其作出補(bǔ)充，或中斷用戶當(dāng)前操作并對(duì)其作出反饋。

這是很官方的一個(gè)說法，其實(shí)就是我們?nèi)粘Ｖ薪?jīng)?？吹降模T如“確認(rèn)要關(guān)閉這個(gè)頁面嗎？”、“送你10000元大禮包”、“主人，頁面加載中，請(qǐng)耐心等待”，等等。

2. 彈窗的分類

彈窗一般分為“模態(tài)彈窗”和“非模態(tài)彈窗”。

模態(tài)彈窗就像剛剛提到的“送你10000元大禮包”，帶有一定的強(qiáng)制性、打擾性，需要你點(diǎn)擊或者關(guān)閉；

非模態(tài)彈窗一般是對(duì)我們的某一處點(diǎn)擊做的系統(tǒng)回應(yīng)，如“您的私人助手已上線，有事情可以找她哦”，這種一般是不用點(diǎn)擊的。

彈窗種類：Dialog（Alerts）

彈窗種類：Actionbar

彈窗種類：Popover

彈窗種類：Toast/HUD

彈窗種類：Snackbar

3. 彈窗的使用場景

彈窗的使用場景，小胖這里總結(jié)了6點(diǎn)，大家可以作為參考。

（1）重要功能/信息提示

如功能更新小紅點(diǎn)、優(yōu)惠券彈窗。這一類一般是強(qiáng)制你看到的。

（2）信息反饋

已支付成功、已下載完畢。這一類是告訴你某個(gè)動(dòng)作結(jié)束了，舉個(gè)栗子，比如你買東西付錢或者銀行轉(zhuǎn)賬，系統(tǒng)告訴你你自己操作完了，后邊有問題不要來找我哦。

（3）錯(cuò)誤反饋

404、系統(tǒng)開小差兒等。人的耐心是有限的，出問題了趕緊認(rèn)錯(cuò)，還能博得片刻同情。

（4）顯示快捷菜單

智能指引。隨著人工智能的普及，一些交互上也增加了智能的指引，這種一般是正常操作過程中給的一些快捷操作指示，可以減少你查找和重復(fù)工作，也是智能推薦的一個(gè)慣用場景。

（5）進(jìn)度條（數(shù)據(jù)加載、登陸中）

這個(gè)很好理解，不解釋了。

（6）退出

我們的許多產(chǎn)品都需要我們登錄賬號(hào)，這樣一方面可以同步信息，一方面也可以形成用戶對(duì)產(chǎn)品的依賴感。所以，當(dāng)我們要推出一個(gè)產(chǎn)品的時(shí)候，系統(tǒng)就會(huì)問你“您確定要退出此賬號(hào)么？”。

另外一個(gè)經(jīng)典案例就是360清理大師這些PC桌面軟件，當(dāng)你要卸載他的時(shí)候，你會(huì)一遍遍的問你、跪求你“是不是確定要卸載他”，我就呵呵。

二、彈窗的設(shè)計(jì)理念及規(guī)范建議

彈窗雖然看似一個(gè)簡單、常見的功能，但是其承載的作用也是很重要的，因此，我們對(duì)于彈窗的設(shè)計(jì)仍然要從彈窗的本身價(jià)值出發(fā)，然后結(jié)合用戶體驗(yàn)，達(dá)到體驗(yàn)和價(jià)值的完美平衡。

彈窗的價(jià)值就是提示重點(diǎn)內(nèi)容，給與用戶一個(gè)實(shí)時(shí)的反饋，當(dāng)然也有部分是用來做運(yùn)營的強(qiáng)關(guān)聯(lián)操作，大概有如下幾條規(guī)則可以遵守和靈活運(yùn)用。

第一不要打擾用戶：控制好頻率、節(jié)點(diǎn)（如只有節(jié)日可以彈大的全屏彈窗，平常盡量不要彈）；控制好彈出的位置和大小，不要給用戶太多的交互負(fù)擔(dān)。

第二要清晰直接：文案要簡短明了、配合一定的示意圖、重點(diǎn)內(nèi)容要突出；雖然有些產(chǎn)品經(jīng)常忽悠用戶，如送1000元這種可能分解了20個(gè)券，但是請(qǐng)不要赤裸裸的欺騙。

第三交互：按鈕有主次之分，雖然有些產(chǎn)品故意把取消按鈕置灰使之不明顯，但是要適度，因人、因產(chǎn)品而不同。

第四要客觀設(shè)計(jì)：要有關(guān)掉彈窗的入口，不要讓用戶懵逼，當(dāng)然，如果你要強(qiáng)推、強(qiáng)彈，你的地盤你做主。

第五，如果有多種內(nèi)容同時(shí)需要在一個(gè)彈窗彈出，怎么辦？一是要做好多種內(nèi)容的排序，二是不同類的內(nèi)容盡量分開場景彈，不然會(huì)顯得不倫不類；還有一種情況，多個(gè)彈窗同時(shí)出現(xiàn)的時(shí)候，頁面的彈窗疊加在一起，無論是視覺還是感受都會(huì)非常差，建議慎重使用。

三、一個(gè)提升1000%效果的實(shí)操案例

若干年前，小胖做過一個(gè)H5銷售轉(zhuǎn)化的業(yè)務(wù)，用戶點(diǎn)擊短信中的推送鏈接，可以進(jìn)入一個(gè)銷售轉(zhuǎn)化頁面，因?yàn)橘u的是付費(fèi)音頻課程，所以有過一次大的關(guān)鍵路徑修改，并且?guī)砹?0倍轉(zhuǎn)化的提升。

在初稿設(shè)計(jì)中，我們只是簡單的提示了用戶課程課程可以免費(fèi)聽，經(jīng)過對(duì)數(shù)據(jù)的分析后，我們將頁面直接做成送紅包的形式，并且將試聽按鈕提前，整個(gè)數(shù)據(jù)便得到了極大的提升。

參考資料：

1. hhttps://www.uisdc.com/popup-window-design
2. https://www.jianshu.com/p/bca5b25c2dde
3. https://www.iamue.com/28481

#專欄作家#

小胖子奮斗，微信公眾號(hào)：夜來妖，人人都是產(chǎn)品經(jīng)理專欄作家。做了幾年產(chǎn)品。

本文原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載

題圖來自Unsplash，基于CC0協(xié)議