產(chǎn)品設(shè)計的可拓展性就是為了應(yīng)對將來未知的改變，改變來自于功能的改變，因為產(chǎn)品是由一個個功能組成的。

可拓展性原則是我自己瞎起的一個名字，高興的話你說彈性原則也行。主要意思是指——界面設(shè)計要足夠的靈活，具有彈性，以滿足將來可能出現(xiàn)的場景。

我第一次考慮這個問題是從去年7月份開始，當(dāng)時接到領(lǐng)導(dǎo)的一個臨時需求，要給直投項目增加一個到期查詢的功能。因為原來的界面設(shè)計比較死板，所以突然加一個新功能導(dǎo)致整個布局都被打亂了，結(jié)果做的很不理想。

當(dāng)時我就希望可以找到一個方法，來應(yīng)對領(lǐng)導(dǎo)這種突如其來的需求。產(chǎn)品設(shè)計的可拓展性就是為了應(yīng)對將來未知的改變，改變來自于功能的改變，因為產(chǎn)品是由一個個功能組成的。

功能的改變可以分為兩類：數(shù)量的改變和狀態(tài)的改變。當(dāng)然這里不涉及到具體的功能設(shè)計，只是探討功能入口的展示。

一、數(shù)量

數(shù)量的改變指的是功能的增加、刪減與合并。多數(shù)是指新功能的增加，這就要求我們在界面（布局）設(shè)計中要給將來可能添加的新功能預(yù)留坑位。

在哪里預(yù)留坑位？又給哪些功能預(yù)留呢？

這里我就例舉最常見的兩種界面布局(導(dǎo)航)樣式來說：宮格式布局和列表式布局。

不知道大家有沒有注意到一個現(xiàn)象：一級頁面中主要用宮格式布局，而二級、三級頁面多數(shù)用列表式布局。

這主要是因為一級頁面是產(chǎn)品的門戶和臉面，而且又多屬于功能的聚合頁，特別是首頁，這就要求一級頁面在展示足夠多入口的同時還要兼顧視覺吸引力。

而以icon、插畫、圖像為主要表現(xiàn)形式的宮格式布局，在視覺設(shè)計上更容易出彩。特別是icon，在相同的空間里，可以展示更多的入口。

但是其缺點(diǎn)就是可拓展性差，不管是2*5還是3*4，你如果想單獨(dú)新增一個功能，界面就會失衡。當(dāng)然我們可以給用戶提供分頁，這就意味著有些功能需要用戶滑動才能看到，具有一定的風(fēng)險。

還有一種方法就是提供全部按鈕，用戶點(diǎn)擊可以查看全部功能。

列表式布局就沒有這方面的顧慮，它可以在不打破界面布局的情況下增加新功能入口，但是它的缺點(diǎn)在于可展示的入口太少了。宮格式布局一屏可以展示20多個入口，而列表式布局只能達(dá)到其一半的水平。

這也是經(jīng)常困擾設(shè)計師的一個問題，因為數(shù)據(jù)反饋一個頁面超過一屏往下內(nèi)容的點(diǎn)擊量是急劇下滑的，所以一般的一級頁面都不會設(shè)計的很長。

如何在有限的空間里展示足夠多的入口呢？

沒有什么是可以難倒我們設(shè)計師的，最近我看到一些產(chǎn)品在底部欄tab里動起了心思。以蘇寧易購為例：當(dāng)你點(diǎn)擊進(jìn)入“發(fā)現(xiàn)”，tab會變成“直播大廳”；點(diǎn)擊進(jìn)入“首頁”，tab會變成“猜你喜歡”。

所以雖然只有5個坑位但是塞進(jìn)了7個tab，這是一個很好的思路。

還有在京東首頁中，用戶下拉會進(jìn)入520專屬活動頁面。同樣的還有微信，用戶下拉直接顯示你最近打開的小程序。

但是目前來說，大多數(shù)用戶還認(rèn)為下拉只能刷新界面，對于“下拉發(fā)現(xiàn)新功能”足夠的缺乏認(rèn)知。這樣的入口可以吸引多少的流量還有待檢驗。

對于一級頁面我還有一個建議：千萬不要隨意把功能入口放在頂部欄上。

因為對于一些小功能的迭代，入口放在哪里都一樣，用戶看得到很好，看不到也無所謂。但是如果要上線一些層級比較高的功能，又不想打亂界面的原有布局，最好放到頂部欄上。

特別是你的界面中如果還沒有搜索、城市定位、分享、篩選、通知等全局功能，一定要把頂部欄的位置空出來。文章開頭我說的“到期查詢”其實就屬于篩選功能。

二、狀態(tài)

上面也說了，本文所提到的可拓展性指的是入口的可拓展性。那么入口在狀態(tài)上的變化，可以分為：外部狀態(tài)變化和內(nèi)部狀態(tài)變化。

外部狀態(tài)變化主要說的產(chǎn)品層面的變化，針對的是C端產(chǎn)品。對C端產(chǎn)品來說，定期組織營銷活動來拉新肯定是必不可少的，這種情況下我們需要對界面的元素進(jìn)行處理使其來適應(yīng)不同的活動氛圍。

從這個方面來說，我們可以發(fā)現(xiàn)：為什么宮格式布局更容易受到各大電商平臺的青睞。因為它可以根據(jù)不同的活動配置一套完全不同的icon，靈活多變。這種狀態(tài)上的百變來打造營銷氛圍的能力是列表式布局所不具備的。

列表式布局可以向用戶傳遞更多的信息，更能表現(xiàn)內(nèi)部狀態(tài)的變化。以下圖為例：用戶可以知道自己還有一張優(yōu)惠券沒有使用，知道自己本月還有126元沒還。而宮格式布局礙于空間，很難向用戶展示過多的信息。

以上方的日歷為例：近期做了一個拆紅包活動，用以icon為主的宮格布局只能加一個“拆紅包”的角標(biāo)。如果采用了列表式布局，可以直接展示金額，更能起到刺激用戶的作用。

寫分析總結(jié)寫到現(xiàn)在讀者越來越多，所以愈發(fā)擔(dān)心自己寫的不好會誤導(dǎo)別人。對于設(shè)計來說，無所謂對錯，只有合適和不合適。

就像上面提到的兩種布局方式，在列表式布局中你可以隨意添加新功能，但是礙于空間，可添加的功能數(shù)目也不會太多。宮格式布局倒是不怕入口放不下，但是會引起界面的失衡。

設(shè)計師的能力就體現(xiàn)在收集用戶數(shù)據(jù)、分析具體場景、去思考得出最合理布局樣式。不要拘泥于解決方案，因為解決方案有很多，我們要學(xué)習(xí)的是解決方案中所體現(xiàn)的思維方式和過程。

以上就是我針對產(chǎn)品設(shè)計中可拓展性原則的一個簡單分析總結(jié)，歡迎大家留言討論。

#專欄作家#

王M爭（微信公眾號：王M爭），人人都是經(jīng)理專欄作家，資深互聯(lián)網(wǎng)人。

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

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