在設(shè)計(jì)時(shí)發(fā)現(xiàn)經(jīng)常會遇到一種情況若贮，到底是用彈框還是用頁面來承載內(nèi)容呢?如果了解到彈框的特性后猪贪，其實(shí)不難分辨什么時(shí)候使用那個(gè)表現(xiàn)手法更適合诸迟。
彈框特性:
- 較頁面輕塔鳍，可以更快回到之前的頁面
- 相對獨(dú)立，可以完全不影響頁面的布局
- 適合解決簡單拜隧，一次性的操作
以下列出了一些較適合使用彈框的場景及案例:
1.新手引導(dǎo)
第一感覺是非常重要的宿百。Google+及Carbonmade的新手引導(dǎo)采用了彈框，配上漂亮的插圖洪添。這種處理手法美觀垦页，不影響頁面布局，卡片式的表現(xiàn)手法還能貫穿網(wǎng)頁及移動(dòng)的一致體驗(yàn)薇组。
2.選擇器
選擇器的特點(diǎn)是用一個(gè)內(nèi)滾區(qū)域來承載一個(gè)很長的頁面宋光，而該內(nèi)滾區(qū)域的高度是可以根據(jù)瀏覽器的高度拉伸的。其好處是除了能放下很長的頁面炭菌，同時(shí)能保留一些操作一直停留在屏幕上罪佳。這裡可以選擇性的為彈框設(shè)置一個(gè)最大及最小高度，但要注意的是必須把背景鎖定黑低，否則出現(xiàn)2條滾動(dòng)條的體驗(yàn)是很糟糕的赘艳。以QQ公眾平臺的圖文選擇器為例:
3.任務(wù)
有時(shí)候某些任務(wù)只是一些簡單的操作，并不特地需要一個(gè)頁面來表現(xiàn)克握，彈框是一個(gè)很好的方法蕾管。
Duolingo用插圖和icon等視覺元素來豐富任務(wù)彈框的表現(xiàn)形式，減輕枯燥感菩暗。
Trello的任務(wù)彈框雖然信息較多掰曾，但好處是能快速切換到不同的任務(wù)，增加效率停团。
4.提示
提示是最基礎(chǔ)的彈框應(yīng)用旷坦，設(shè)計(jì)時(shí)需記往保持統(tǒng)一性。視覺上的統(tǒng)一性: 顏色佑稠，間距秒梅，文案風(fēng)格等。交互的統(tǒng)一性: 主要操作是左邊還是右邊按鈕舌胶，關(guān)閉是點(diǎn)擊蒙版還是點(diǎn)擊叉叉捆蜀。
騰訊企點(diǎn)的提示彈框整理
