對(duì)于多區(qū)域、多輪播圖的產(chǎn)品，怎樣的后臺(tái)設(shè)計(jì)能夠清晰明確地區(qū)分不同場景不同位置？避免給運(yùn)營同學(xué)帶來使用阻礙呢？筆者將為大家詳細(xì)分析，請(qǐng)看正文。

一、問題

也許有的小伙伴，公司的產(chǎn)品只有一個(gè)位置需要展示輪播圖，那么后臺(tái)肯定就是一對(duì)一啦，設(shè)置之后就對(duì)應(yīng)展示，這個(gè)是毫無疑問的。

但是假設(shè)，公司發(fā)展需要，做了小程序，那么展示輪播圖的位置是不是就多加了一個(gè)呢？也可能是加入了新的模塊，也有了新運(yùn)營位的需求，去增加輪播圖的展示位置，這個(gè)時(shí)候，后臺(tái)做一個(gè)好像就不行了，因?yàn)橛泻芏鄠€(gè)位置，一個(gè)后臺(tái)對(duì)應(yīng)的數(shù)據(jù)就應(yīng)該是一個(gè)位置的。

于是，很多小伙伴，提出的輪播圖需求，除去前端的設(shè)計(jì)，后臺(tái)的設(shè)計(jì)就是一句話——我們之前不是有做了一個(gè)輪播圖的后臺(tái)嗎？照著那個(gè)再做一個(gè)就好了。或者說照著那個(gè)做再加點(diǎn)什么什么字段就好了。

然后問題就來了：

這次新增了一個(gè)，開發(fā)就去復(fù)制一個(gè)后臺(tái)。下次新增一個(gè)，開發(fā)就再復(fù)制一個(gè)后臺(tái)。先不說工作量的問題，久而久之，也累積起來很多個(gè)輪播圖的后臺(tái)了。

新人運(yùn)營同學(xué)這時(shí)候可能就會(huì)很懵逼了，我要去XX運(yùn)營位上一個(gè)新圖，可是這么多個(gè)后臺(tái)，哪個(gè)是我要上圖的運(yùn)營位的呢？

這個(gè)時(shí)候可能需要新增后臺(tái)的使用文檔去維護(hù)，這是理想狀況下。

有些小伙伴的公司后端系統(tǒng)功能龐雜，設(shè)計(jì)輪播圖后臺(tái)也很隨意，后端就隨便起個(gè)名字，隨便找個(gè)地方一放，那找起來就很胃疼了。

這還是不是最讓人頭疼的，如果運(yùn)營同學(xué)一個(gè)不小心，把圖上錯(cuò)到不該上的地方，那么，就有可能帶來公司方面的損失。追究起來也許大家都要承擔(dān)責(zé)任，就非常的不好了。

二、方案

照著再做一個(gè)——這么簡單的決定很可能為你的同事埋下了無數(shù)的隱患。

那么，小伙伴可能會(huì)問，要怎么做才能避免這樣的情況出現(xiàn)呢？

我給出的建議是，不用新增后臺(tái)，在初始的那個(gè)輪播圖后臺(tái)上面去做新增的功能就好了，這樣就是一個(gè)聚合信息的管理。

當(dāng)然了，這個(gè)方法說起來是很簡單的，真正執(zhí)行的時(shí)候也許會(huì)遇到一些問題。

1. 篩選

全部的數(shù)據(jù)堆在一起，在一個(gè)列表頁面展示，不就亂套了嗎？

這個(gè)解決的方案是在列表頁的篩選項(xiàng)添加一個(gè)位置的篩選。加入這個(gè)篩選項(xiàng)之后，篩選出想要看的位置的數(shù)據(jù)，排除了其他位置的數(shù)據(jù)之后，就會(huì)很清晰，不會(huì)出現(xiàn)混亂了。

還有一個(gè)附加的好處就是不做篩選的時(shí)候可以一目了然的看到所有的輪播圖的數(shù)據(jù)。如果想要聚焦在某個(gè)位置的數(shù)據(jù)上，作出篩選即可。數(shù)據(jù)的展示變得非常靈活。

圖片示例-列表頁：

2. 差異化

都在同一個(gè)頁面去新增和編輯，兩個(gè)位置的數(shù)據(jù)不一樣怎么辦？比如說，2個(gè)位置的輪播圖圖片的大小要求不一樣。

這個(gè)也很好辦——在輪播圖內(nèi)容的編輯加一個(gè)字段設(shè)置位置。通常會(huì)是下拉選項(xiàng)，位置的名稱也最后是容易理解的位置信息。根據(jù)位置字段的切換，就可以區(qū)別的展示需要輸入的字段，提示等。這個(gè)也是列表頁篩選的數(shù)據(jù)來源，所以必不可少。通過這樣的差異化處理，可以實(shí)現(xiàn)內(nèi)容的聚合，而不會(huì)因?yàn)橛胁町惥椭荒苤匦伦鲆环?，達(dá)到統(tǒng)一管理的目的。

圖片示例-編輯頁1：

3. 補(bǔ)充提示

也許有小伙伴會(huì)說輪播圖還會(huì)加什么功能嗎？不是都大同小異的展示圖片和跳轉(zhuǎn)頁面而已。其實(shí)還真的有，而且根據(jù)業(yè)務(wù)的需求可能有各種不同的功能。

我舉一個(gè)栗子，就是跳轉(zhuǎn)的前置操作。

所謂的跳轉(zhuǎn)的前置操作，也就是在頁面跳走之前做的一些操作。具體做法是編輯輪播圖內(nèi)容的時(shí)候加上一個(gè)前置操作的標(biāo)識(shí)單選項(xiàng)，讓開發(fā)加上對(duì)應(yīng)的處理。

可以是這樣的場景——希望輪播圖跳轉(zhuǎn)的H5根據(jù)每個(gè)用戶做一些特殊展示。

可是有一些位置是不需要登錄就能進(jìn)入的，就像首頁，這個(gè)時(shí)候就只能在輪播圖上做前置的處理。在點(diǎn)擊之后不是直接跳轉(zhuǎn)，而是先彈出登錄框讓未登錄的用戶登錄，從而獲取相關(guān)信息。

圖片示例-編輯頁2：

4. 理由

這樣的聚合管理為什么可以避免問題呢？

其實(shí)問題的核心就是“多”這一個(gè)點(diǎn)造成的：并存的多個(gè)導(dǎo)致混亂。因?yàn)槎鄠€(gè)所以不好查找，也不好維護(hù)。當(dāng)不新增之后，管理輪播圖的后臺(tái)基本就是維持在一個(gè)地方?，F(xiàn)在，對(duì)于運(yùn)營的同學(xué)來說，要找到這個(gè)位置就不再困難了，不會(huì)眼花繚亂的對(duì)著一堆后臺(tái)頁面，但是又不知道那個(gè)才是自己真正需要去修改的。剩下的只要區(qū)分清楚位置就好了，節(jié)省了很多時(shí)間，有交接的新同學(xué)也很容易去說明了。

那么對(duì)于產(chǎn)品設(shè)計(jì)本身的影響大不大呢，會(huì)不會(huì)增加很多工作量？我覺得其實(shí)是不大的。排除掉這件事，在原先照搬的策略下面，產(chǎn)品設(shè)計(jì)上也是需要設(shè)計(jì)前端展示和后端功能，變成只是去新增之后，需要做的工作并沒有實(shí)質(zhì)的改變。相反的，在編輯后臺(tái)說明的時(shí)候也會(huì)更方便，只需要在一個(gè)后臺(tái)說明去增改就行，也不用加很多個(gè)說明文檔去挨個(gè)解釋。如果說需要添不同位置的輪播圖，但是字段又差不多的話，后臺(tái)甚至也不用設(shè)計(jì)了，直接讓開發(fā)添加個(gè)位置字段的選擇就可以了。

三、多個(gè)場景

這種聚合復(fù)用的方法不僅可以用在輪播圖的后臺(tái)設(shè)計(jì)上門，還有很多可以應(yīng)用的地方，只要是有類似邏輯，但是又有細(xì)微差異的功能點(diǎn)，都可以這么聚合起來，拓展形成一個(gè)后臺(tái)的設(shè)置系統(tǒng)。

拿舉報(bào)來說，如果需要舉報(bào)的內(nèi)容不止是一個(gè)地方的數(shù)據(jù)，但是舉報(bào)的方式和內(nèi)容又有些微差異，比如一個(gè)模塊的舉報(bào)需要填寫理由，另外一個(gè)不需要填寫，那么就可以使用這個(gè)方式，也可以用在浮標(biāo)圖片內(nèi)容設(shè)置啦，廣告位設(shè)置啦，等等等等。

不過萬物都不是完美的，這個(gè)方法也有不適合使用的時(shí)候。如果核心邏輯差異太大，或者功能點(diǎn)實(shí)在太多太復(fù)雜，那么與其攢做一堆不如拆開。

因?yàn)樵谕粋€(gè)基礎(chǔ)上去升級(jí)，意味著相關(guān)的數(shù)據(jù)應(yīng)該放在一個(gè)地方了，只是有區(qū)別的字段而已。

如果有很復(fù)雜的功能，一旦去調(diào)整，很可能會(huì)影響到原來其他的功能和數(shù)據(jù)，也是有很大的風(fēng)險(xiǎn)。也一樣會(huì)帶來維護(hù)和升級(jí)的麻煩，甚至?xí)绊懤习姹?，或者要做很大的改?dòng)。所以比較適合使用的還是功能和字段都相對(duì)簡單的地方。

四、最后

那么以上，是個(gè)人關(guān)于輪播圖的后臺(tái)設(shè)計(jì)的一些總結(jié)和思考，這當(dāng)然只是其中的一種解決方式，大家也可以大開腦洞想想還有沒有別的方式去解決。

在工作中，一而再，再而三遇到相同的問題的時(shí)候，也許就需要思考是不是有更好的辦法去解決。這是我思考的初衷。希望大家多多給與意見和建議。

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

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