今天我們來說說最近看到的特殊組件，2個(gè)都非常實(shí)用！

一、底部抽屜

業(yè)務(wù)背景：

抽屜或許大家都比較熟悉，但底部抽屜聽上去就有些陌生。

它其實(shí)是從底部向上彈起的一個(gè)抽屜形態(tài)，在各大設(shè)計(jì)系統(tǒng)當(dāng)中都會(huì)支持的一個(gè)容器。

對于用戶而言最早熟悉的是源自移動(dòng)端的整體交互，但隨著 B 端行業(yè)的不斷發(fā)展，行業(yè)中對于容器的需求越來越大，因此需要更多不同的形式窗口展示頁面。

底部抽屜就這樣誕生！

對于底部抽屜而言，雖然只是顯示容器上的變化，但是你會(huì)發(fā)現(xiàn)在交互上有著翻天覆地的改變，我們結(jié)合實(shí)際案例來一起分析。

組件解法：

在實(shí)際項(xiàng)目中，我們可以使用飛書多維表格，點(diǎn)擊插件中心，就會(huì)發(fā)現(xiàn)底部抽屜進(jìn)行展示。

只是出現(xiàn)的位置不同，真的會(huì)帶來如此大的差異？

其實(shí)底部最大的好處便是聚焦，右側(cè)抽屜視覺重心都在右側(cè)，因此在呈現(xiàn)上會(huì)更適合短暫停留。右側(cè)抽屜的寬度因業(yè)務(wù)場景差異難以統(tǒng)一界定，部分設(shè)計(jì)雖支持自定義寬度，但實(shí)際使用率較低，功能略顯雞肋。

底部抽屜更類似‘放大版彈窗’，既能作為信息補(bǔ)充容器，又因底部上滑的交互模式，相比傳統(tǒng)彈窗或新建頁，對主流程的中斷感更弱。因此這就是 底部抽屜 的價(jià)值～

二、縮小展開窗口

業(yè)務(wù)背景：

在窗口的容器當(dāng)中，也會(huì)出現(xiàn)類似的情況。給我印象較為深刻的便是 Gmail 寫郵件的具體容器～

首先在 Gmail 當(dāng)中會(huì)將寫郵件的狀態(tài)進(jìn)行定義：認(rèn)真寫、看會(huì)寫會(huì)、等會(huì)兒寫

認(rèn)真寫：窗口放大，窗口全屏直接去寫

看會(huì)寫會(huì)：在右下角，小窗口直接輸入

等會(huì)兒寫：就縮小，能夠去查看不同的郵件

而這個(gè)設(shè)計(jì)其實(shí)與我們使用的原生系統(tǒng)類似，像 Win、Mac 系統(tǒng)一樣的窗口呼出方式～

組件解法：

在組件當(dāng)中，其實(shí)不同的容器并不是絕對的，多形態(tài)的變化也是當(dāng)前整體行業(yè)的趨勢。

比如在 Notion 當(dāng)中，數(shù)據(jù)結(jié)構(gòu)相同，但是可以呈現(xiàn)不同的容器。比如 彈窗、抽屜、新建頁，在這里它都可以解決。

相同的做法也會(huì)出現(xiàn)在 紛享銷客 的軟件當(dāng)中，因此不同交互方式之間，或許現(xiàn)在的界限也沒有那么明確，只要做到根據(jù)用戶的場景分析合理即可～

當(dāng)然除了這部分之外，在 YouTube 當(dāng)中也有一個(gè)類似的交互。

當(dāng)你想要全屏查看視頻時(shí)，它并不是不可滾動(dòng)，而是可以向下滾動(dòng)去閱讀評論區(qū)，因此，現(xiàn)如今的設(shè)計(jì)中，全屏的定義不再是不可交互的獨(dú)立界面，而是可滾動(dòng)、可操作的放大版窗口。

我們最近在輔導(dǎo)一個(gè) WMS 系統(tǒng)的作品集，其中有一個(gè)固定的角色是，每天只會(huì)在一個(gè)固定頁面進(jìn)行稱重和錄入操作，這時(shí)候就可以考慮在頁面右上角放置 全屏操作入口，方便用戶可以隱藏不必要的導(dǎo)航菜單信息，做到更為沉浸的使用。（由于內(nèi)容比較敏感，因此就找一張類似配圖）

作者：CE青年