從頁面開始思考，可能是很多產品經理和設計師的思維習慣，然而這可能是一種不良習慣。如何跳出“頁面思維”，實現能力進階呢？一起來看一下吧。

從頁面開始思考確實是很多產品經理和設計師的思維習慣，但那很有可能是一種不良習慣。

現在，

資訊流、大彈窗、半浮層等等這些產品介面形式的發展，在逐漸消解使用者的頁面跳轉體驗。

所以，如果我們還在單個頁面、單個頁面地提供設計方案，那很有可能並不是最佳方案。

頁面，是UX/UI設計師理解產品，進入設計的方式，但長期用頁面來思考設計問題，成就了UX設計師的自我束縛的思維盒子。

就像Ralph Ammer創作的這個動態圖形，我們在相同的框架下思考和學習，這讓我們快速入門和成長。但成長到一定階段，就需要打破這個思維的盒子。但是你如果身處這個盒子之中，想要 Think out of box，是非常困難的。

二維生物無法像三維生物一樣思考。

很有可能，真正的好的設計方案其實是在你當前苦苦思考的這個頁面之外。

頁面，是一個有明確邊界的二維平面載體。我們現在之所以還會覺得以頁面來思考問題奏效，是因為手機和電腦螢幕是平面的。這個平面的載體，很有可能在可見的未來得到顛覆。

元宇宙可能太遠，就在VR虛擬現實介面設計中，你覺得“頁面”還會存在嗎？

01 跳出單頁思維框架，才能實現能力進階

有很長一段時間，我總是喜歡思考一些最根本的問題，並試圖對這些問題給出一個自己的答案。

比如，人怎樣活著才算有意義？設計的價值到底在哪裡？上班打工是為了做對的事情還是為了做老闆認為對的事情……類似這樣的問題中，有幾個我很早就有了答案。其中有兩個是：

歸根結底，互動設計設計的是什麼？視覺設計設計的是什麼？

這兩個問題，我五年前的答案是

互動設計設計的是使用者行為，視覺設計設計的是資訊和情感

。現在看起來，這個答案看上去也並沒有什麼問題。

我不知道各位做設計的朋友怎麼看，問上面那樣的問題會不會很無聊，可能明擺著的：UI設計和UX設計設計的就是一個個頁面，視覺設計設計的就是banner、海報、開屏、長圖。

以媒介的角度來思考設計，會有書籍裝幀設計、UI設計、3D設計、IP形象設計、VI設計等等這樣的門類。這種命名方式是以最終的交付節點而命名的，因為最終的交付媒介是UI所以我們就叫UI設計師。往往以媒介來命名的設計工作比較直接、也更方便入門，所以很多更資深的設計師在設計能力提升之後更願意換一個其他的名字。比如做logo設計的會把自己叫做“品牌設計師”，後者一聽，就感覺大了很多，也難了很多，也更接近設計的本質。

那麼UX設計/使用者體驗設計呢？我們無法在最終交付節點交付明確的使用者體驗，因為使用者體驗不是一個具體的媒介，而是使用者的感受，並且非常不可控。

UX設計/使用者體驗設計（或品牌設計）更像是一種以設計出發點命名的職業，含義應該是為了塑造好的使用者體驗（或品牌體驗）而進行設計工作的設計師。所以這個講法本身是可以跨越媒介的，也是跨學科的。

現在也有公司在使用“產品設計師”這樣的職位，這個職位名稱我覺得要比UI設計、使用者體驗設計都要好。因為它既不會讓設計師侷限在一張張UI介面上，也不會讓設計師在“使用者體驗”這個又大又虛的詞彙中迷失。

02 警惕“頁面思維”

UX設計、UI設計的前身叫做網頁設計，PC網頁設計時代也講使用者體驗，User Friendly 這樣的理念在PC時代就是有的。在UI設計起始之時，設計師們習慣以頁面為單位來理解需求、展開方案、進行交付。在PC時代，很多承接網站設計的設計公司也都是以頁面為單位來計費，那時候講的“頁面”背後的含義其實是“網頁”（Web Page），很多公司招聘設計師的title也是“網頁設計師”。

雖然現在設計的名詞變化了，但設計師仍然會以“頁面”為載體來輸出自己的設計交付物，

時間一長，工具都會影響思維

，所以設計師就自然而然的用“頁面”來思考問題。

與此同時，隨著智慧手機和移動應用（App）的發展，iOS和安卓迅速迭代自己的設計系統，在這一迭代過程中產品應用的設計與研發方式都得到了快速的發展，在Apple HIG和安卓MD的設計規範中逐漸取消了頁面（page）這一概念（或者從一開始就沒有，待考證）。

設計師和產品經理在談到頁面的時候，往往想到的是一個個單獨的頁面。但平臺級的設計系統以及開發工程師們已經不這麼思考問題了。

walling

比如我們看Walling這樣優秀的產品設計，他強調Folder、Wall、Section、Brick這樣的層級概念，而不強調Page。當然你也可以把Wall理解為Page，如果一旦這樣理解，那就陷入到了“好，我現在要創造一個頁面，然後用資料夾把頁面歸類一下”這樣的思維裡。

03 原子設計理論中被忽視的中間步驟

早在2013年，前端工程師 Brad Forst 將原子理論運用在介面設計中，形成一套設計系統，包含5個層面：原子、分子、組織、模板、頁面。原子理論時至今日在國內的UX設計領域得到廣泛應用，在講到設計規範的時候，90%以上的UI設計師的作品集裡，你幾乎都可以看到這張圖。

原子理論讓UI設計回到了介面設計的第一性來思考問題，透過顏色、間距、文字、圓角等最最基礎的設計元素來逐漸塑造設計調性、建立設計秩序。

但大多數團隊基本只做到了原子到分子，跳過了更關鍵的部分直接去組成頁面了。但其實我覺得，原子理論最中間的“組織”，是與產品/業務聯絡更緊密、更能夠發揮設計價值的部分。而在這部分，大部分設計團隊投入的普遍較少。從而還是陷入了“原子分子組成頁面，頁面組成產品”的思維之中。

如果你認為是一張張頁面組成了產品，那就說明你一直是在以“頁面思維”來思考產品。

你可以用頁面思維來理解一個網站，但不能以頁面思維來理解一個工具類App、一個平臺類產品。

Brad Forst 在2013年畫這張圖的時候還是把設計的落腳點放到了“頁面（page）”上，因為他是一個前端工程師，並不負責客戶端的開發工作。如果我們放著客戶端的規範不管，拿著前端工程師的理論去跟客戶端工程師去溝通，是不是有點不妥呢。因為時至今日，我們翻一翻Apple HIG，根本找不到Page這個東西。

所以我們要不要想一想，9年前提出的原子設計理論，現在是不是已經過時了呢？

04 “頁面思維”的弊端

如果我們以習慣以“頁面思維”來理解產品結構，以“頁面思維”來思考使用者任務，我覺得可能會存在幾個弊端：

1）對使用者任務的關注度降低

如果以單個頁面來思考問題，容易忽略頁面與頁面之間的互動關係。使用者完成任務是需要跨頁面完成的。

2）對產品架構的理解單一

樹狀架構是容易理解的，但真實的產品架構是網狀的。

3）思考問題表面化

由內而外的思考沒問題，由表及裡的思考也沒問題。但如果從表面思考，也從表面產出，只看到水面上的冰山一角，認為那就是全部，可能就會有問題。

4）設計創造性力受限

Think out of box，頁面是一個二維的有限的畫布，盯著這個畫布容易受到思維限制，妄圖在這個有限的平面裡解決所有問題是不切實際的。因為也有可能真正對的解決方案並不需要這個頁面。

以上。

作者：柴林；公眾號：柴林的設計筆記

本文由@柴林 原創釋出於人人都是產品經理。未經許可，禁止轉載。

題圖來自 Unsplash，基於 CC0 協議

該文觀點僅代表作者本人，人人都是產品經理平臺僅提供資訊儲存空間服務。