功能結構圖、信息結構圖、結構圖區別詳解

你還在問(wèn)產(chǎn)品結構圖到底是信息結構圖還是功能結構圖嗎?這里有微信的實(shí)際例圖幫助你更好地理解這組命運三姐妹圖類(lèi)。

　　在寫(xiě)PRD、競品分析文檔中，我們常常會(huì )看到產(chǎn)品結構圖、產(chǎn)品功能結構圖或者產(chǎn)品信息結構圖的身影，但需要講清楚他們的定義和作用也真沒(méi)看上去那么簡(jiǎn)單，這里作者嘗試分享一下自己的觀(guān)點(diǎn)。

　　特別聲明：由于篇幅和其他因素限制，本系列中所有的實(shí)例圖在完整性上有省略和簡(jiǎn)化，僅作為舉例講解用，請讀者不要糾結圖表是否描述完整、是否有缺失模塊，主要是給讀者來(lái)對比3類(lèi)圖表的聯(lián)系與區別。

　　一、功能結構圖

　　1、定義

　　功能結構圖就是按照功能的從屬關(guān)系畫(huà)成的圖表，在該圖表中的每一個(gè)框都稱(chēng)為一個(gè)功能模塊。功能模塊可以根據具體情況分得大一點(diǎn)或小一點(diǎn)，分解得小功能模塊可以是一個(gè)程序中的每個(gè)處理過(guò)程，而較大的功能模塊則可能是完成某一個(gè)任務(wù)的一組程序。(百度定義)用通俗的話(huà)來(lái)說(shuō)，功能結構圖就是以功能模塊為類(lèi)別，介紹模塊下其各功能組成的圖表。

　　2、作用

　　產(chǎn)品概念設計的運用工具之一，能夠對不完全確定的設計問(wèn)題或相當模糊的設計要求，以一種較為簡(jiǎn)潔和明確的方法表示。在繪制的過(guò)程中，能夠幫助PM思考并清晰產(chǎn)品的功能模塊及其功能組成;

　　梳理需求，以鳥(niǎo)瞰的方式對整個(gè)產(chǎn)品頁(yè)面中的功能結構形成一個(gè)直觀(guān)的認識，防止在產(chǎn)品需求轉化為功能需求的過(guò)程中出現功能模塊和功能點(diǎn)缺失的現象。

　　3、注意事項

　　在區分功能結構、信息結構圖、結構圖前，有一個(gè)重要的前提需要大家達成共識：軟件產(chǎn)品本身就是傳遞信息和提供功能的載體，完全相對的信息類(lèi)或功能類(lèi)產(chǎn)品是不可能存的在，信息往往伴隨著(zhù)功能，我們很難劃一條界限將兩者徹底分開(kāi)。從某種意義上，信息傳遞甚至就是軟件產(chǎn)品主要的核心功能。鑒于此，通常我們默認地把信息展示功能獨立了出來(lái)，作為信息架構的一部分去思考，在產(chǎn)品功能結構時(shí)不考慮信息展示功能。

　　這里舉一個(gè)信息與功能糾纏的例子更好理解，如微信的個(gè)人信息模塊(如下圖)，“名字”字段在這里既是信息又提供著(zhù)修改設置的功能。

　　所以我們不難理解許多功能結構圖中出現了信息結構的要素，但由于功能結構圖的使用目的(即上文中的作用)要求我們專(zhuān)注于產(chǎn)品功能這個(gè)維度，在功能結構圖中我們好盡量減少信息結構要素出現的可能性。

　　就用上面功能與信息糾纏的例子來(lái)說(shuō)，在其功能結構圖中許多朋友會(huì )直接用“名字”來(lái)表示其功能點(diǎn)，畫(huà)圖人可能本人清楚，但看圖人就會(huì )產(chǎn)生疑惑：這個(gè)“名字”到底是指提供可查看名字的功能還是可查看并修改名字的功能。

　　在這里介紹一個(gè)小訣竅，形容一個(gè)功能點(diǎn)時(shí)建議多采用“動(dòng)詞+名詞”的語(yǔ)言描述形式，這種方式不僅信息傳達更加準確而且可以避免讀者不必要的困惑。如上面的例子中我們就可以把“名字”改為“設置名字”或“查看并設置名字”來(lái)描述功能點(diǎn)。

　　4、如何繪制功能結構圖

　　在實(shí)際應用時(shí)，產(chǎn)品功能結構圖通常在以下2種情況下繪制：

　　對未完成的產(chǎn)品在設計階段繪制，確定產(chǎn)品功能結構;

　　對已完成的某個(gè)版本的產(chǎn)品繪制，用于分析并傳遞該產(chǎn)品的功能結構;

　　1)在產(chǎn)品的設計階段，如何挖掘并確定功能結構圖中的主功能模塊呢?

　　首先主功能模塊應該是產(chǎn)品在完整業(yè)務(wù)流程中的各個(gè)核心功能模塊，我們可通過(guò)業(yè)務(wù)流程中所涉及到的功能需求去提煉出主功能模塊，提煉完成后再通過(guò)業(yè)務(wù)流程走查一次，看是否有遺漏的主功能模塊。

　　舉個(gè)例子，假設我們參與了微信的早期功能設計，其產(chǎn)品初期定位是一款移動(dòng)社交軟件，那么其對應的核心業(yè)務(wù)可以簡(jiǎn)化為

　　這樣我們就很容易得出產(chǎn)品設計階段微信的主功能模塊，如下：

　　結合下面現有版本的微信功能結構圖對比一下，經(jīng)過(guò)上百次迭代，其主功能結構幾乎沒(méi)有發(fā)生變化，我們不得不佩服其功能結構的拓展性;

　　當通過(guò)業(yè)務(wù)流程將主功能模塊確定下來(lái)后，再根據業(yè)務(wù)需求對其進(jìn)行功能的詳細設計即可，在此就不再展開(kāi)了。

　　2)對于已確定產(chǎn)品來(lái)說(shuō)如何繪制功能結構圖呢?

　　對一款已確定產(chǎn)品繪制功能結構圖，快捷的方法便是參考產(chǎn)品的Tab功能模塊找出產(chǎn)品主功能模塊，然后按照層級歸屬關(guān)系詳敘該功能模塊提供的下一級功能模塊或功能，如有必要，其顆粒度可一直細化到功能操作的描述程度。

　　那上圖“微信功能結構圖(V6.5.21)”的主功能模塊為什么不是“微信”、“通訊錄”、“發(fā)現”、“我”這四大標簽功能模塊?

　　在這里作者希望傳達一個(gè)概念，結構圖中的主功能模塊不一定就是Tab中的標簽功能模塊，許多時(shí)候產(chǎn)品受限于移動(dòng)端的空間限制，不得不把功能分為3到4個(gè)Tab中，這是一種務(wù)實(shí)的妥協(xié)。當然正常情況下以Tab標簽名作為主功能模塊的做法沒(méi)有錯，只是當產(chǎn)品功能復雜時(shí)，產(chǎn)品功能結構圖采用這種劃分有點(diǎn)粗糙。而繪制已確定產(chǎn)品的功能結構圖能夠幫助我們去挖掘這個(gè)產(chǎn)品的核心功能模塊，梳理產(chǎn)品的功能架構。我們建議作圖人可以嘗試脫離Tab標簽用自己的語(yǔ)言去挖掘并描述主功能模塊。

　　這樣說(shuō)來(lái)我們就可以隨意將標簽功能模塊中的次級功能模塊劃分出來(lái)作為主功能模塊嗎?

　　其實(shí)也不是，一款不管多復雜的應用其主功能模塊的劃分數量都不能太多(5-9個(gè)為佳)，一般情況下當對產(chǎn)品功能結構進(jìn)行分析后，我們仍然會(huì )采用Tab功能模塊作為主功能模塊然后對其下屬的功能模塊進(jìn)行整理。只有當我們認為某個(gè)次級功能模塊在業(yè)務(wù)上太過(guò)重要且產(chǎn)品價(jià)值較高時(shí)，我們才可以將其劃分出來(lái)作為一個(gè)單獨的主功能模塊。

　　這里介紹一個(gè)小秘訣，當一個(gè)次級功能模塊反復出現在不同的Tab功能模塊中的時(shí)候，我們就可以考慮將其拆分出來(lái)作為主功能模塊，因為這個(gè)時(shí)候意味著(zhù)這個(gè)次級功能模塊在產(chǎn)品的業(yè)務(wù)流程中來(lái)說(shuō)十分重要，而且這也可以讓我們的產(chǎn)品功能結構圖更加簡(jiǎn)潔清楚。如上面“微信功能結構圖(V6.5.21)”中的搜索模塊就同時(shí)出現在了Tab中的微信功能模塊和通訊錄功能模塊。

　　后如何確定功能結構圖中的顆粒度呢?

　　功能結構圖中的顆粒程度需要根據具體應用場(chǎng)景來(lái)定，由畫(huà)圖人根據需要自行把控即可。比如說(shuō)在產(chǎn)品設計的過(guò)程中，功能結構的建立是設計者的設計思維由發(fā)散趨向于收斂的過(guò)程，剛開(kāi)始的顆粒度一般比較大，可能僅涉及到某個(gè)功能模塊，隨著(zhù)設計的不斷推進(jìn)，功能結構圖的顆粒度會(huì )不斷細化，終可以拆分至某個(gè)具體的功能操作。這里作者將“微信模塊-個(gè)人對話(huà)”功能模塊作了細化，僅供參考：

　　二、信息結構圖

　　1、定義：指脫離產(chǎn)品的實(shí)際頁(yè)面，將產(chǎn)品的數據抽象出來(lái)，組合分類(lèi)的圖表。

　　2、作用：

　　幫助PM梳理復雜內容的信息組成，避免信息內容在展示過(guò)程中出現遺漏、混亂、重復;

　　作為開(kāi)發(fā)工程師建立數據庫的參考依據;

　　信息結構圖的繪制通常晚于功能結構圖，往往是在產(chǎn)品設計階段的概念化過(guò)程中，在產(chǎn)品功能框架已確定、功能結構已完善好的情況下才對產(chǎn)品信息結構進(jìn)行分析設計。

　　在這里，我們需要強調的是脫離實(shí)際頁(yè)面這個(gè)概念，在一些產(chǎn)品相關(guān)文章中，我們會(huì )看到作者將信息結構圖完全按照頁(yè)面的邏輯順序來(lái)進(jìn)行分類(lèi)組合，嚴格意義上來(lái)說(shuō)，這種圖表不是一份合格的信息結構圖。

　　我們用微信的個(gè)人信息模塊舉例，如下圖所示：

　　其結構信息圖在這部分的繪制就需要脫離產(chǎn)品的實(shí)際頁(yè)面，如下：

　　后需要強調的是：信息結構圖主要適用于產(chǎn)品信息構成比較復雜需要考慮優(yōu)化的情況，如內容型產(chǎn)品(博客、web門(mén)戶(hù)網(wǎng)站等)，產(chǎn)品的信息結構對于用戶(hù)體驗就十分重要，需要用信息結構圖作為工具進(jìn)行分析思考。

　　這里作者簡(jiǎn)單繪制了一下微信的信息結構圖作為參考

　　三、結構圖

　　相較于功能結構圖和信息結構圖，產(chǎn)品結構圖的定義就很混亂和模糊了，為什么會(huì )出現這種情況呢?

　　一方面產(chǎn)品結構圖從文字理解上來(lái)說(shuō)就容易讓人困惑：產(chǎn)品信息結構圖、產(chǎn)品功能結構圖不都可以簡(jiǎn)稱(chēng)為產(chǎn)品結構圖嘛。

　　另一方面現有網(wǎng)上流傳的競品分析文檔、產(chǎn)品體驗文檔、PRD文檔有不少是由產(chǎn)品新人模仿前輩流傳出來(lái)的文檔模板來(lái)寫(xiě)的。但讓人尷尬的是，有部分同學(xué)沒(méi)有進(jìn)行細致深入地了解。經(jīng)常在一篇文章中，前面說(shuō)是產(chǎn)品的功能結構圖，結果圖中是產(chǎn)品功能有，產(chǎn)品信息要素也有，沒(méi)有理解功能結構圖的定義。而后來(lái)的初學(xué)者又從這些文章中去了解學(xué)習產(chǎn)品功能結構圖、產(chǎn)品信息結構圖，導致惡性循環(huán);

　　重要的原因是：對于產(chǎn)品結構圖，產(chǎn)品從業(yè)人員這個(gè)群體自身都還沒(méi)有達成共識啊。作者在網(wǎng)上搜了搜相關(guān)文章，對于產(chǎn)品結構圖大家的主要理解有3種：

　　大部分產(chǎn)品人認為：產(chǎn)品結構圖即產(chǎn)品功能結構圖的簡(jiǎn)稱(chēng)，可能在產(chǎn)品沒(méi)有強調信息結構的概念時(shí)，有部分PM開(kāi)始簡(jiǎn)稱(chēng)產(chǎn)品功能結構圖為產(chǎn)品結構圖，之后便默認了這種稱(chēng)呼，當出現產(chǎn)品信息結構圖后，概念就產(chǎn)生了混淆;

　　一部分產(chǎn)品人認為：產(chǎn)品結構圖是綜合展示產(chǎn)品信息和功能邏輯的圖表;

　　少部分產(chǎn)品人認為：產(chǎn)品結構圖就是產(chǎn)品信息架構圖。

　　在這里，作者更認同第2種觀(guān)念：

　　產(chǎn)品結構圖是綜合展示產(chǎn)品信息和功能邏輯的圖表，簡(jiǎn)單說(shuō)產(chǎn)品結構圖就是產(chǎn)品原型的簡(jiǎn)化表達。它能夠在前期的需求評審中或其他類(lèi)似場(chǎng)景中作為產(chǎn)品原型的替代，因為產(chǎn)品結構圖相較于產(chǎn)品原型，其實(shí)現成本低，能夠快速對產(chǎn)品功能結構進(jìn)行增、刪、改操作，減少PM在這個(gè)過(guò)程中的實(shí)現成本。

　　產(chǎn)品結構圖就是通過(guò)信息架構設計，將功能和信息以一種合理自然的邏輯，把功能結構圖和信息結構圖中的內容放入產(chǎn)品中的每一個(gè)頁(yè)面的結果。而現在許多PRD、競品分析中提到的信息結構圖、功能結構圖其實(shí)大多數都是同時(shí)含有功能和信息元素的簡(jiǎn)化版產(chǎn)品結構圖。如下圖所示：

　　總結

　　在一款產(chǎn)品的設計過(guò)程中，功能結構圖是必須的，信息結構圖視產(chǎn)品和PM自身而定，通常我們初步確定了產(chǎn)品功能結構圖(產(chǎn)品功能框架)之后才開(kāi)始繪制產(chǎn)品信息結構圖。

　　在產(chǎn)品設計流程中，產(chǎn)品功能結構圖是產(chǎn)品概念化階段的初期輸出，產(chǎn)品結構圖是產(chǎn)品概念化的尾期階段輸出物，當產(chǎn)品結構圖完成后，我們對產(chǎn)品的基本模樣在心理就有了一個(gè)輪廓。同時(shí)以產(chǎn)品結構圖作為繪制原型的依據，可以避免我們在產(chǎn)品設計中邊畫(huà)邊改，跳進(jìn)死掐細節，不見(jiàn)森林的陷阱。

　　到這里，你是否還對功能結構圖、信息結構圖、結構圖傻傻分不清呢?