大部分插件的作用是滿足小眾化需求，這類需求相對(duì)來說不是主流需求。在設(shè)計(jì)插件版工具的時(shí)候我們會(huì)遇到很多矛盾點(diǎn)，插件版的自由度和一致性設(shè)計(jì)本身就是一對(duì)矛盾點(diǎn)，設(shè)計(jì)時(shí)需要找到平衡點(diǎn)，做出適當(dāng)?shù)娜∩?，才能讓用戶在使用過程中擁有更好的體驗(yàn)。

插件設(shè)計(jì)理論篇

大部分插件的作用是滿足小眾化需求，這類需求相對(duì)來說不是主流需求，把他們放在二級(jí)頁面里面進(jìn)行配置，可以滿足部分特殊需求的用戶，也對(duì)主流用戶沒有任何影響。

其優(yōu)勢(shì)是：

1. 降低產(chǎn)品試錯(cuò)成本，簡(jiǎn)化產(chǎn)品的核心規(guī)則，無需在產(chǎn)品初期就實(shí)現(xiàn)非常復(fù)雜的產(chǎn)品形態(tài)。
2. 釋放冗余的產(chǎn)品內(nèi)存，節(jié)省電腦資源。
3. 便于用戶靈活使用

大致可以將市場(chǎng)上的插件分為三類：

第一類是瀏覽器插件，這類插件比較常見，大家也經(jīng)常使用，它們依存于瀏覽器，不同的瀏覽器有不同的插件市場(chǎng)，現(xiàn)在主流的瀏覽器有360、谷歌、QQ、火狐等。

每一個(gè)瀏覽器以及插件使用后，明顯感覺QQ瀏覽器的插件使用流程最為順暢：從插件中心搜索插件?查看相關(guān)詳情?下載安裝?啟用設(shè)置?使用?卸載，這一系列的操作流程引導(dǎo)做得很到位，不會(huì)中途被強(qiáng)制中斷。

第二類是軟件的第三方小插件，例如：sketch、PS等圖形類軟件的小插件，這類工具功能雖已十分強(qiáng)大，但是依然不能滿足所有用戶的需求。因此會(huì)有很多第三方為其開發(fā)一些小插件，為用戶提高工作效率。這類工具的插件入口一般都十分隱秘，安裝和啟用的流程學(xué)習(xí)成本相對(duì)較高。

第三類是原生模塊化插件產(chǎn)品，例如：酷Q和我們的產(chǎn)品wetool，這類軟件以功能模塊作為插件，由于功能模塊過多和復(fù)雜化，于是以插件模塊存在可以讓用戶自由搭配使用，某些高級(jí)的功能模塊也可以作為付費(fèi)插件提供給高級(jí)用戶使用。

插件的更新方式一般有兩種：強(qiáng)制性和非強(qiáng)制性。

• 強(qiáng)制性的更新方式較為少見，主要運(yùn)用于十分重要的升級(jí)，在某個(gè)時(shí)間點(diǎn)強(qiáng)迫用戶完成某項(xiàng)操作會(huì)讓用戶產(chǎn)生煩躁情緒，因此強(qiáng)制更新盡量不要過于頻繁，否則會(huì)失去一定的用戶量。
• 非強(qiáng)制性的升級(jí)會(huì)增大開發(fā)成本，需要維護(hù)多個(gè)版本，會(huì)導(dǎo)致部分不更新的用戶數(shù)據(jù)和功能異常。

插件的下載安裝方式也可以分為兩類：

• 一類是復(fù)制黏貼至插件文件包，這種安裝方式較為隱藏，需要學(xué)習(xí)成本；
• 第二類是在軟件頁面內(nèi)部給予安裝下載管理入口，引導(dǎo)用戶去完成一系列操作，用戶體驗(yàn)更加。

插件可以從存在的界面形式上大致分為兩類：

• 一類是獨(dú)立界面類，這類插件擁有自己獨(dú)立的頁面操作，需要用戶調(diào)用界面設(shè)置后才可以具體使用；
• 還有一類是無界面類，一般是輔助性功能，沒有任何界面形式，調(diào)用后就可以使用，例如：裁剪工具。

下面總結(jié)一下具體插件設(shè)計(jì)的注意事項(xiàng)：

（1）插件本身是靈活自由的，在設(shè)計(jì)過程中要秉承這個(gè)優(yōu)勢(shì)；

（2）要降低用戶的學(xué)習(xí)成本，其中可以從這三個(gè)部分入手：

1. 簡(jiǎn)化安裝和卸載，啟用和關(guān)閉的操作流程；
2. 直觀展示：插件雖是軟件或者瀏覽器的第三方輔助功能，但是在功能展示上也不可過于隱藏層級(jí)過深，防止用戶安裝和啟用后不知道在哪里調(diào)用插件；
3. 便捷管理：插件集成在一個(gè)固定的地方，便捷快速的管理插件能夠提高用戶效率；

插件設(shè)計(jì)需要保持一致性，包含視覺和交互操作，不通形態(tài)的插件在操作流程上統(tǒng)一會(huì)讓用戶產(chǎn)生聯(lián)想，以此降低了學(xué)習(xí)成本。

插件設(shè)計(jì)實(shí)踐篇

前言：這是一個(gè)幫助微商、教育機(jī)構(gòu)等個(gè)體或團(tuán)隊(duì)運(yùn)營(yíng)、管理微信群和好友的協(xié)助性軟件，整個(gè)軟件每個(gè)功能模塊都是相對(duì)獨(dú)立的，因此可以把整個(gè)軟件的每個(gè)功能模塊做成插件。

如此設(shè)計(jì)和改版的原因有以下兩點(diǎn)：

1. 功能逐漸開始繁復(fù)，有些用戶只需要使用其中的某些功能，插件化讓功能搭配更加自由；
2. 功能模塊多而雜導(dǎo)致用戶很難發(fā)現(xiàn)自己需要的功能，模塊化插件的展示更加清晰

下面是軟件改版前的整體架構(gòu)：

由于軟件的功能模塊相對(duì)獨(dú)立，不同的用戶偏重的需求不一樣，例如：客服人員主要偏向于解答用戶消息，一般只需要使用客服、機(jī)器人、群管等模塊，而運(yùn)營(yíng)人員需要增長(zhǎng)和裂變粉絲，一般只需要使用群發(fā)、加群好友等功能。

原先的設(shè)計(jì)功能模塊過于龐雜，很多模塊也是為了分類而分類，一些功能會(huì)被藏在很深的層級(jí)，很多用戶反饋無法快速定位到自己想要的功能模塊。

在改版的插件版本中，我們會(huì)按照一定的分類將功能打散，插件頁面以功能模塊來展示，每個(gè)功能模塊有相應(yīng)的詳情介紹和功能介紹，用戶在該頁面可以自由下載和啟用自己需要的插件模塊，自由搭配模塊使用更加相得益彰。

插件版改版

上面是插件版本的架構(gòu)圖，可以基本將插件分為四種屬性：不可卸載、可以卸載、前臺(tái)插件（必須依存頁面使用）、后臺(tái)插件（設(shè)置完成后可以后臺(tái)執(zhí)行）。每個(gè)插件會(huì)有不同的屬性，屬性也會(huì)有所交叉，需要根據(jù)插件的類型和功能需求設(shè)計(jì)。

在此基礎(chǔ)上設(shè)計(jì)功能我們需要注意以下幾點(diǎn)：

（1）插件功能的辨識(shí)度

插件管理頁面的插件模塊會(huì)不斷增加，需要分類展示，不僅通過文字區(qū)分功能還可以在圖標(biāo)設(shè)計(jì)的辨識(shí)度上下功夫。

（2）插件主要操作流程和界面保持一致

對(duì)于用戶而言，沒有屬性之分，用戶只需要了解功能方便使用，因此在一些基本操作上我們需要保持一致的用戶體驗(yàn)，防止增加用戶的學(xué)習(xí)成本。

（3）不同屬性的插件的差異性設(shè)計(jì)

例如：不可卸載的插件沒有卸載刪除入口，前臺(tái)插件必須啟用后才能打開頁面，所有的插件都可以選擇是否固定在頂部導(dǎo)航欄使用，便于用戶自由搭配和整合功能。

（4）關(guān)聯(lián)性操作要做好引導(dǎo)

安裝和管理／啟用、頁面設(shè)置和固定導(dǎo)航欄，這些操作是主流用戶啟用功能的一連串基礎(chǔ)動(dòng)作，由于特殊化需求我們需要把基礎(chǔ)操作分步進(jìn)行，因此在第一次的操作過程中我們可以引導(dǎo)用戶去學(xué)習(xí)操作流程，防止操作斷層造成用戶的不理解。

（5）相關(guān)功能模塊的聯(lián)動(dòng)設(shè)計(jì)

例如接受好友功能可以和新游應(yīng)答功能配合使用，在安裝其中之一時(shí)可以詢問用戶是否捆綁安裝另一個(gè)，可以省去用戶再去尋找和學(xué)習(xí)的成本。

（6）功能入口的主次劃分

每個(gè)插件的功能入口會(huì)比較多，在布局上不能把所有的入口都鋪出，需要分清主次，例如啟用和頁面設(shè)置是主要功能，卸載、查看詳情和固定至導(dǎo)航欄是比較次要的，可以通過層級(jí)劃分和微交互區(qū)分。

下面是插件版的原型圖和部分交互動(dòng)態(tài)頁面，里面包含整個(gè)插件的使用流程：

結(jié)語：在設(shè)計(jì)插件版工具的時(shí)候我們會(huì)遇到很多矛盾點(diǎn)，插件版的自由度和一致性設(shè)計(jì)本身就是一對(duì)矛盾點(diǎn)，設(shè)計(jì)時(shí)需要找到平衡點(diǎn)，做出適當(dāng)?shù)娜∩?，才能讓用戶在使用過程中擁有更好的體驗(yàn)。

也歡迎大家來體驗(yàn)一下我們的產(chǎn)品，指出不足，插件化版本會(huì)在下周與大家見面。

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

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