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

編輯導(dǎo)語：B端產(chǎn)品列表的設(shè)計和排列有很多種方法，本文作者基于自己的工作經(jīng)歷，對B端產(chǎn)品列表進(jìn)行了初步的分析與總結(jié)，為我們分享了一些她的看法。

B端產(chǎn)品列表的內(nèi)容量較大，所承載操作也就會多一些。

在設(shè)計列表時，需要考慮用戶操作的便捷和高效，由于是B端工具類產(chǎn)品，有些功能對于用戶來說，是為了完成工作必須去做的操作。

可能是每天1次或多次所以也要考慮操作的簡單，能夠在用戶復(fù)雜和大量的工作中，為他們降低一點點的理解成本和學(xué)習(xí)成本，我想也是很好的吧！

以下的內(nèi)容是從近期的一次列表設(shè)計，總結(jié)的一些思路，不確定設(shè)計稿是不是可以發(fā)出來（雖然已經(jīng)上線了，但是由于是B端的項目）所有有些地方做了一些脫敏處理。

一、列表1.0

列表基礎(chǔ)操作像修改和刪除，像是很多場景下都需要的，但這兩個操作是不能滿足業(yè)務(wù)需求的，根據(jù)業(yè)務(wù)的需要和實際場景來定義外漏與收起的數(shù)量，根據(jù)操作的優(yōu)先級，來定義哪些操作是外漏的。

以下是幾個自己認(rèn)為是注意事項的注意事項：

1. 在做工具類產(chǎn)品時，盡量使用文字來表示操作

icon固然好看，但文字在易讀和理解上更簡單一些（當(dāng)然這里多指的是和業(yè)務(wù)相關(guān)的操作）。

2. 外漏與收起的數(shù)量，需要有一個通用的規(guī)范

這也是我在這次設(shè)計沒有注意到的一個問題，有的頁面的操作是7個，有的頁面是4個，我在第一次做設(shè)計是，將操作做成了3+更多，就是外漏3個，其余都收起。

但是遇到只有4個操作的時候，這種3+更多就很尷尬，那我就直接處理成了2+2。

和技術(shù)同學(xué)溝通之后，在技術(shù)角度上擴(kuò)展性和通用性就低了，那之后就統(tǒng)一處理成了2+更多，當(dāng)操作小于等于3個時，全都外漏，大于3時，則留兩個操作在外面，其余都收起。

如圖：

二、列表2.0

列表的基礎(chǔ)結(jié)構(gòu)搭建好之后，再來看提升操作效率的功能，像是篩選、批量操作，都是幫助用戶提升效率的方式，如圖：

1. 篩選

在最初的列表篩選方案是，篩選后篩選的標(biāo)題即變成選擇的內(nèi)容，如圖：

這種情況多數(shù)適合單選的情況，但如果是多選，在展示時可能就有點糾結(jié)，給出了如下方案，好像也不是很便捷了；如果需要取消已選內(nèi)容，還是需要點擊開再刪除，如圖：

綜上，給出了新的方案，似乎是可以滿足這些需求了，如圖：

當(dāng)選擇的篩選內(nèi)容時，給出小標(biāo)簽，可以直接看到自己選擇的內(nèi)容，也可以直接刪除某某某。

2. 批量

點擊右上角的按鈕（操作）將列表激活為批量勾選的狀態(tài)，在未對內(nèi)容進(jìn)行選擇前，底部的按鈕為置灰狀態(tài)。

當(dāng)對內(nèi)容勾選后，則激活按鈕，可進(jìn)行操作；批量操作時，右上角“XX”操作這里思考了很久，到底是“完成”合適，還是“取消”合適——這應(yīng)該是取決于對列表的操作與使用場景。

1）場景1

批量操作時只有一個操作，當(dāng)勾選勾選勾選之后，去點擊操作按鈕，完成需要操作的動作，則完成了一次動作，列表恢復(fù)在默認(rèn)狀態(tài)。

那這種時候，右上角的操作可為“取消”，那取消的含義就是在勾勾的時候，反悔了，不想繼續(xù)去操作了，將編輯態(tài)變默認(rèn)態(tài)。

2）場景2

當(dāng)有多個批量操作時，那操作一個動作之后，則依舊停留在編輯態(tài)，可繼續(xù)勾勾勾勾，那就需要手動去結(jié)束這個編輯態(tài)，則“完成”可能更加合適。

注意的事兒：

1. 當(dāng)?shù)撞堪粹o大于1時，可區(qū)分主次操作；
2. 若底部有很多很多很多操作，需要進(jìn)行部分折疊。

如圖：

三、列表3.0

前面有提到，B端操作類的一個列表，想要給用戶傳達(dá)的就是簡單、便捷、高效。雖然很多用戶在使用微信時已經(jīng)習(xí)慣的左滑刪除這個操作，但從研發(fā)同學(xué)那里了解到，這僅僅是ios才有的操作。

所以，這樣的操作也是存在一些成本的，不論誰研發(fā)成本，還是用戶的理解成本。

如果場景需要可以注意，設(shè)計這樣的方式，首次使用時，增加一個可愛的新手引導(dǎo)；當(dāng)然這樣的操作方式能夠包含的操作也是很有限的，這種情況下，就不建議對操作再次隱藏了。

所以倆個就好了，且對操作進(jìn)行區(qū)分，如圖：

（參考微信和ios的短信）

最后：

以上是在最近工作中提煉的一些內(nèi)容，好一段時間自己都對列表這些基礎(chǔ)頁面（交互）有些誤解，后來發(fā)現(xiàn)自己連列表都考慮不清楚。

實際應(yīng)用中可根據(jù)具體的使用場景、業(yè)務(wù)需求等適當(dāng)調(diào)整，也不是全部覆蓋，像排序、圖文（資訊類）并不合適。如果以上內(nèi)容有不合適的地方，也希望可以一起討論，謝謝！

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

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