提交需求
賽事與廣告咨詢合作,請?zhí)顚懶枨蟊韱?,我們會在第一時間與您聯(lián)系!
B端頁面類型總結(jié)
界面作為企業(yè)或組織使用的載體,也是圍繞增刪改查而設(shè)計。主要的典型頁面類型包含幾種:
1.表盤
表盤頁是核心數(shù)據(jù)統(tǒng)計、信息集合的頁面,最核心的內(nèi)容就是圖表和表格。在表盤類主頁設(shè)計前,都主要先從業(yè)務(wù)角度出發(fā),視情況而定。確定包含的主頁呈現(xiàn)的業(yè)務(wù)信息,然后再開始對內(nèi)容區(qū)域進(jìn)行劃分和布局。
1.1 數(shù)據(jù)型表盤頁
主要以展示總數(shù)據(jù)統(tǒng)計,數(shù)據(jù)圖表為主。這類頁面的布局要從業(yè)務(wù)角度出發(fā)先了解頁面需要展示哪些數(shù)據(jù),并使用什么圖表,要確保數(shù)據(jù)的展示能符合實(shí)際使用需要。并且在視覺表現(xiàn)力上是值得著手發(fā)力的頁面。
1.2 主頁型表盤頁
應(yīng)用于整個B端產(chǎn)品主頁的工作臺概覽頁面,不是單純的數(shù)據(jù)圖表聚合頁,而是會包含大量不同的核心模塊和核心信息,對于頁面內(nèi)容的權(quán)重表現(xiàn)和布局比例要求較高。
除了數(shù)據(jù)圖表外,還根據(jù)業(yè)務(wù)可以呈現(xiàn)信息列表、輪播圖、公告、日歷、留言板等信息模塊,也需要花較多的時間來處理視覺美觀度,通過主頁設(shè)計從而傳達(dá)產(chǎn)品設(shè)計調(diào)性。
2.列表
列表是對于羅列數(shù)據(jù)進(jìn)行展示的統(tǒng)稱,通常由篩選操作項(xiàng)、不同列表類型、分頁控件三部分組成。而不同列表類型也有很多種,除提到的一般列表頁、表格列表頁、卡片列表頁,表格列表同時也可以細(xì)分為帶篩選條件列表、可橫向滾動列表、帶操作列表等不同情況。
B端列表頁的設(shè)計應(yīng)根據(jù)業(yè)務(wù)需求、數(shù)據(jù)特性和用戶操作習(xí)慣來定制。不同類型的列表頁可以提供不同的用戶體驗(yàn)和操作效率。設(shè)計時,應(yīng)考慮如何最有效地展示數(shù)據(jù),并提供必要的交互功能,以支持用戶獲取信息數(shù)據(jù)。
2.1 基礎(chǔ)列表頁
最基礎(chǔ)的縱向排列一行一條的展示一系列數(shù)據(jù)項(xiàng)。最簡單直接的列表展示方式,適用于數(shù)據(jù)量不大、無需復(fù)雜操作的場景。
2.2 表格列表頁
以橫、縱軸的排列規(guī)則的表格形式展示數(shù)據(jù),支持對表格內(nèi)數(shù)據(jù)進(jìn)行操作:排序、篩選、搜索和添加新數(shù)據(jù)等。適用于需要對數(shù)據(jù)進(jìn)行詳細(xì)對比和分析的情況。與基礎(chǔ)列表不同的是,有表頭是表格列表,沒表頭的就是基礎(chǔ)列表。
2.3 卡片列表頁
將每個數(shù)據(jù)對象使用卡片的形式展示,對于不需要上下數(shù)據(jù)進(jìn)行對比,每個數(shù)據(jù)對象都是比較獨(dú)立的個體的話,那么卡片的模式會比表格更合理,包含更多視覺信息,如圖片、圖標(biāo)。提供更豐富的視覺展示,適合需要突出數(shù)據(jù)項(xiàng)特點(diǎn)的場景。
3.表單
表單頁是用戶與系統(tǒng)交互的重要部分,用于收集、輸入、編輯和提交數(shù)據(jù)。
表單頁的設(shè)計應(yīng)考慮用戶的操作習(xí)慣、數(shù)據(jù)的復(fù)雜性以及業(yè)務(wù)需求。不同類型的表單頁可以提供不同的用戶體驗(yàn)和操作效率。設(shè)計時,應(yīng)考慮如何最有效地引導(dǎo)用戶輸入數(shù)據(jù),并提供必要的反饋和幫助信息,以支持用戶完成其任務(wù)。
3.1 基礎(chǔ)列數(shù)表單
包含基本的輸入字段和行動按鈕,如文本框、選擇框等,而其表單列數(shù)可能視情況不同而不同,有可能呈現(xiàn)1-4列表單的情況。通過表單的形式向用戶提問,從而獲取需要的業(yè)務(wù)數(shù)據(jù)。
3.2 分類表單
在基礎(chǔ)分列表單的類型上,單個表單根據(jù)業(yè)務(wù)關(guān)系進(jìn)行分類或分組,從而把同類信息的歸類為一個組別。
3.3 分步表單
在基礎(chǔ)表單的形式上會將表單分解成多個步驟或頁面,用戶需要按順序逐步完成。如果完成表單之前要回答的問題分散在多個網(wǎng)頁,那么通過步驟來顯示填表進(jìn)展情況是很有用的。適用于復(fù)雜的數(shù)據(jù)輸入,可以減少用戶一次性需要填寫的信息量。
3.4 流程表單
因業(yè)務(wù)需求,團(tuán)隊(duì)組織會有多人審批的流程,通過分流程引導(dǎo)用戶完成復(fù)雜的審批任務(wù),每一步都專注于單一用戶需要關(guān)注的當(dāng)下特定任務(wù)。從而幫助用戶理解和完成復(fù)雜的流程。
4.詳情
詳情頁是用來展示某個數(shù)據(jù)對象的具體內(nèi)容、數(shù)據(jù)、信息的頁面,根據(jù)業(yè)務(wù)需求和所展示信息的不同,頁面的做法也有不同,比如商品詳情、文章詳情、工單詳情等,都會形成不同的設(shè)計。
其設(shè)計應(yīng)根據(jù)所展示數(shù)據(jù)的特性、用戶的使用場景和業(yè)務(wù)需求來定制。不同類型的詳情頁可以提供不同的用戶體驗(yàn)和信息展示方式。設(shè)計時,應(yīng)考慮如何最有效地組織和展示信息,以及如何提供必要的交互功能,以支持用戶完成其任務(wù)。
4.1 基礎(chǔ)詳情
基礎(chǔ)詳情頁和表單頁類似,需要整理要展示的信息、字段,對它們進(jìn)行歸類和擺放,主流的詳情頁設(shè)計就是把內(nèi)容根據(jù)順序依次排列出來。只讀展示信息,不允許用戶進(jìn)行編輯或修改。適用于僅大多數(shù)需要展示詳細(xì)信息的場景,不需要用戶交互的情況。
4.2 高級詳情
除了展示信息,還允許用戶在頁面上執(zhí)行操作,如編輯、刪除或啟動某個流程。提供了更多的用戶參與和交互。
4.3 彈窗&抽屜詳情
把一般詳情頁使用彈窗或抽屜的形式表現(xiàn)出來,可以進(jìn)行上下的滾動。多用于表格、列表場景中點(diǎn)擊數(shù)據(jù)對象后彈出,不用進(jìn)行頁面跳轉(zhuǎn)。
5.結(jié)果&缺省
結(jié)果頁分為不同結(jié)果情況:成功/失敗/異常頁,是完成對應(yīng)操作后用一個獨(dú)立頁面來反饋操作結(jié)果的頁面。
缺省頁分為不同情況:異常/空頁面,是對系統(tǒng)錯誤、頁面數(shù)據(jù)為空的狀態(tài)用特殊的頁面。
5.1 結(jié)果頁
成功/錯誤/異常頁:完成對應(yīng)操作后用一個獨(dú)立頁面來反饋操作結(jié)果的頁面
5.2 缺省頁
異常/空頁面:是對系統(tǒng)錯誤、頁面數(shù)據(jù)為空的狀態(tài)用特殊的頁面。
6.登錄&注冊
登錄頁面雖然包含的要素不多,但是是所有產(chǎn)品體驗(yàn)的第一步。設(shè)計登錄&注冊其主要目標(biāo)更多是通過提高登錄注冊的操作效率,從而提高登錄注冊的轉(zhuǎn)化率。
6.1 登錄&注冊
通過用戶填寫表單從而進(jìn)行登錄&注冊。而其需要填寫的表單設(shè)計形式可能是居中、居左、居右等多種布局設(shè)計模式。不管以什么模式,其主要目的還是圍繞提高登錄注冊操作效率為主。
Powered by Froala Editor
大牛,別默默的看了,快登錄幫我點(diǎn)評一下吧!:)
登錄 立即注冊