亚洲av无码成人专区片在线观看,亚洲av岛国动作片在线观看,少妇,喷水,亚洲av成人无遮挡网站在线观看,天堂网www资源在线

將頁面依據(jù)交互行為區(qū)分層級，每層都具備特有特性和意義，讓所有層上的功能和內(nèi)容搭建出來的視圖結(jié)構(gòu)能符合用戶認知。分層可以用來指導(dǎo)搭建一套合理的頁面信息層級，每一個層級作為一個容器，每個容器內(nèi)需要區(qū)分視覺層級，還可搭建出滿足用戶清晰認知的UI頁面。

B端頁面分層

從全局性來看，按照交互形式將B端界面分為背景層、內(nèi)容層、遮罩層、臨時層。

背景層：固定樣式，永遠置于頁面最底部。

內(nèi)容層：視圖結(jié)構(gòu)中最核心和復(fù)雜的一層，主要承載當(dāng)前場景的用戶需要獲取的核心頁面信息以及輔助核心任務(wù)的操作流程。直接平鋪顯示產(chǎn)品業(yè)務(wù)信息呈現(xiàn)，包括全局控制導(dǎo)航和直接頁面兩種類型。

遮罩層：通過黑色或白色降低不透明度的設(shè)計，控制阻斷遮罩下面內(nèi)容層不可操作，而讓用戶更加聚焦處理遮罩層上方的信息內(nèi)容。

臨時層：當(dāng)前任務(wù)或者內(nèi)容相關(guān)的臨時出現(xiàn)層，優(yōu)先級高于內(nèi)容層，一般承載當(dāng)前需要臨時顯示的信息、處理的任務(wù)或者需要接受的反饋等。以側(cè)邊滑出或者彈出的形式在當(dāng)前頁面場景化呈現(xiàn)，包括內(nèi)容層不可操控和內(nèi)容層可操作兩種類型模態(tài)。

層級的前后順序為，臨時層>遮罩層>內(nèi)容層>背景層，順序不可更改。

1.背景層

背景層固定樣式，永遠置于頁面底部，方便凸顯和聚焦內(nèi)容層。

層的顏色為中性背景色居多；也有使用純白色背景色，進而信息模塊劃分則通過加大間距或線條；甚至可以在背景層融入輔助肌理圖形，保證頁面信息識別性的前提，也提高了B端產(chǎn)品的視覺表現(xiàn)力。

2.內(nèi)容層

視視圖結(jié)構(gòu)中最核心和復(fù)雜的一層，主要承載當(dāng)前場景的用戶需要獲取的核心頁面信息以及輔助核心任務(wù)的操作流程。

直接平鋪顯示產(chǎn)品業(yè)務(wù)信息呈現(xiàn)，包括全局控制導(dǎo)航和直接頁面兩種類型。全局控制導(dǎo)航用于對整個網(wǎng)站的控制以及導(dǎo)航功能，展示環(huán)境和上下文位置。比如頂部導(dǎo)航、左側(cè)導(dǎo)航。直接頁面則是可置入承載頁面信息等所有組件。比如列表、表單等各類型組件的合集呈現(xiàn)頁面信息。

2.1 全局控制導(dǎo)航

例1: 頂部導(dǎo)航

用于對整個網(wǎng)站的控制以及導(dǎo)航功能，展示環(huán)境和上下文位置。比如頂部導(dǎo)航、左側(cè)導(dǎo)航。

2.2 直接頁面

例1:數(shù)據(jù)圖表頁

用于對整個核心內(nèi)容信息的呈現(xiàn)，具體可看典型頁面類型。可包括列表、表單、數(shù)據(jù)圖表等各類型組件形成的直接頁面內(nèi)容。

3.遮罩層

通過黑色或白色降低不透明度的設(shè)計，控制阻斷遮罩下面內(nèi)容層不可操作，而讓用戶更加聚焦處理遮罩層上方的信息內(nèi)容。
遮罩本身是一個基礎(chǔ)通用的樣式，具體什么情況使用遮罩，還是得視情況而定，根據(jù)產(chǎn)品自身特性，定義遮罩的具體規(guī)則，使用說明。

4.臨時彈出層

當(dāng)前任務(wù)或者內(nèi)容相關(guān)的臨時出現(xiàn)層，優(yōu)先級高于內(nèi)容層，一般承載當(dāng)前需要臨時顯示的信息、處理的任務(wù)或者需要接受的反饋等。

以側(cè)邊滑出或者彈出的形式在當(dāng)前頁面場景化呈現(xiàn)，包括內(nèi)容層不可操控和內(nèi)容層可操作兩種類型模態(tài)，一種是內(nèi)容層不可操控，被蒙版遮罩禁用，比如需要較為聚焦的分支流程對話框彈窗、抽屜式等。另一種內(nèi)容層可以操作，無蒙版遮罩界面中出現(xiàn)的疊層，比如輕量級的新手引導(dǎo)、氣泡確認框、下拉菜單（當(dāng)下拉菜單為縮起狀態(tài)時，屬于全局控制導(dǎo)航；點擊展開時，屬于臨時層）、全局提示反饋等（反饋提醒的優(yōu)先級在此層中最高）。

4.1 內(nèi)容層不可控

例1: 對話框彈窗

對話框是一種臨時窗口，通常在不想中斷整體任務(wù)流程，但又需要為用戶展示信息或獲得用戶響應(yīng)時，在頁面中打開一個對話框承載相應(yīng)的信息及操作。

例2: 抽屜式

抽屜常通過單擊臨近的按鈕控件，從屏幕邊緣（上、下、左、右）滑入的浮層面板，又稱半屏彈窗。

4.2 內(nèi)容層可操作

例1: 新手引導(dǎo)

逐步驟進行指引或解釋說明的組件，常用于用戶不熟悉的或需進行特別強調(diào)的頁面。

例2: 氣泡確認框

氣泡確認框通常用于不會造成嚴重后果的二次確認場景，其會在點擊元素上彈出浮層進行提示確認。氣泡確認框沒有蒙層，點擊確認框以外的區(qū)域即可關(guān)閉。

Powered by Froala Editor