交互模式應用(1)：Inplace Replacement

　　Inplace Replacement是一種普遍的交互模式，常用來表現大量數據的有限空間中為user展現更多信息。Sunny同學以前曾經在Design Pattern的presentation中提起過，也叫”Details on demand”, 而在開發眼裡，即是“Row Expander”。這裡稱為Inplace Replacement，意指廣義范圍的具體內容呈現模式，並不拘泥於表單內容擴展的交互，甚至包括“Retractable Menu”。 不管叫什麼，我們來探討一下如何應用這種交互模式。

　　使用前提

　　針對目前所給內容，用戶需要更詳細信息，但是由於空間限制和過多元素排列的困難，我們會將一些額外詳細信息隱藏，從而既保持界面簡潔類目明晰，又能夠展示細節而不破壞主體層次。

　　軟件經常展示給用戶一些圖形化的表單或頁面，由於空間限制，並為了方便絕大多數用戶浏覽關鍵數據， 每個item所顯示的通常只包括每個條目的幾個關鍵屬性。然而，用戶可能需要更多比最初顯示對象屬性的信息，此時我們會添加額外的細節，方便他們按需查看。

　　交互方法

　　有交互動作才show detail。

　　由於是按需給予，只有在用戶對相應item作出交互動作時才顯示額外內容。我無法想象如何在包含了所有詳細屬性的數據森林中去定位某個具體條目，這樣對信息架構者的工作量或者用戶的搜索能力而言，都是極大的挑戰。Give them what they want才是解決問題的關鍵，因此我們需要根據用戶的輸入(點擊、劃動或者鼠標停留)來觸發展示額外內容。

　　表現形式

　　•Details on demand

　　當選中一個條目時，創建一定的控件用來展示額外信息。

　　•Overview by Detail

　　顯示對所有對象的預覽信息並且對於所選對象進行詳細展示。

　　•Retractable Menu

　　當導航欄或者信息組織面板太占屏幕空間時，創建一個並行的很容易反復點擊的菜單，不用時可以隱藏。

　　注意事項

　　•這種交互模式在視覺設計中要做顯著的視覺暗示，比如在結構樹之前加上展開節點，選中對象要加以提示選中狀態。

　　•確保這種附帶額外信息的視覺控件逐漸形成用戶心智模型，用戶在初次看到後就能領悟交互方法。

　　•確保視覺效果在開關兩種狀態有明顯區別，帶進一步信息的條目和正常狀態的條目應該區別開來，方便定位。

　　一個反例，Wifi-Photo裡選中的圖片沒有具體視覺區分。

　　•只顯示單層額外細節，避免細節嵌套細節。

　　Inplace replacement只適合單層額外細節，並不適合用在額外信息中包含清單或表格內容。那樣會形成過多的信息層次，不利於進一步查看。