原型設計是每個產品經理的基本技能。許多人通常使用原型產品中的默認組件庫。然而，為了提高效率，有必要制作壹個完全符合他們使用習慣的高效組件庫。本文作者對此進行了分析，希望對您有所幫助。學Axure，先學基礎再學交互最後就是動手實操！在，就可以獲取到專業全面的Axure自學視頻課展開綜合學習~專業講師教學，知識點滿滿，學會可自主實操設計原型~
Axure制作屬於自己的Axure元件庫方法：
壹、妳也是原型苦手嗎？
產品經理的軟件技能裏，原型工具可以說是產品經理吃飯的家當，我個人常用的原型工具是Axure。當我是個剛入門的小菜鳥時，用Axure畫原型線稿，用的是默認的組件庫，每次都把對應的組件拖動出來進行更改。比如在制作壹個表單時，就要經歷以下步驟：拖出壹個文本標簽組件作為字段名標簽。必要時要加上*必填標記並且要改成紅色字色
拉出壹個單行文本輸入框組件，按規範改壹下組件的寬度、高度、圓角
重復1、2直到完成表單設計
當我成為了壹名熟練的畫圖仔之後，我知道了還有元件庫這種東西，於是我下載了好多個元件庫，但是用的時候，我發現別人的元件庫要不做的特別龐大（大廠的設計規範元件庫，事無巨細），檢索元件時花費的時間更多了，要不就是殘缺的半成品，總之就是效率不高，所以相當長壹段時間內，我都是用默認的元件庫。前不久，我受高人指點：做壹個自己的元件庫是產品經理必須經歷的試煉。我醍醐灌頂，現在我需要的不是機械化地快速重復，而是找到變革工具讓效率有質的飛躍，而當前我需要的就是壹個高效的、完全貼合我使用習慣的元件庫。汽車跑的比馬車快，可不是因為輪子蹬的比馬蹄快。二、STEP1：把每個元件畫壹遍萬事開頭難，起初我並沒有對“我的元件庫應該具備哪些內容“有壹個明確的答案，於是根據產品經理先做MVP再叠代優化的DNA，我準備把所有的組件壹個個實現，這是最笨的也是最實在的辦法。於是乎我把常見的網頁框架組件，如網頁頭部、主導航菜單、按鈕等，以及表單組件，如單行文本、下拉選框等組件，都逐壹實現。因為平時對組件的基本屬性調整都比較熟悉，這壹步進展的很快，馬上我就得到了第壹版的”p仔組件庫v1.0″.這個1.0版本，每個元件都是獨立的，而且有些組件，根據交互不同我還做了區分，比如帶清除的下拉選框和帶搜索的下拉選框。我花了挺多時間在完善組件的交互上。然而我很快就發現了亟須優化的點：元件庫應該按照某種分類準則進行合並，否則找元件的效率太低了。三、STEP2：元件庫的分類合並在學習了別人成熟組件庫的分類方式後，我決定采取如下分法：基礎組件（哪都可以用）
界面組件（web列表頁這類界面）
彈出組件（彈出表單、對話框）
提示組件（徽標、氣泡和提示）
常用icon
常用記錄表格
這裏只是在1.0的基礎上，創建了文件夾對元件進行歸類，在文件夾下，依舊是獨立壹個個的元件。隨後我想起了壹個問題，為什麽我見過的大廠設計規範，都是做的大元件而不是獨立元件呢？大元件的意思是，比如按鈕元件，裏面其實包含了關鍵按鈕、普通按鈕、提示按鈕等幾個基礎元件。（有贊的按鈕大元件，並不是只有1個元件）為什麽要把相同性質的元件放在同壹個“大元件”裏呢？經過DIY的元件庫1.0後發現，如果元件都是獨立的，使用時找元件是在axure界面的左下角元件區域，axure的組件區壹般會比較小，檢索效率低。（axure工作界面的元件窗口是比較小的）那麽封裝成大元件後，用的時候先拖到畫布裏，再直接選取想要的組件復制出來就行。因為畫布的空間大，而且允許縮放，再加上自己對自己組件庫的熟悉，檢索效率要比在元件工作窗中檢索定位的效率要高。操作步驟如下：把大元件拉到畫布中；
在畫布中選中想要的組件，用ctrl+鼠標左鍵拖拽復制；
用完後將大元件在畫布中移除。
（大元件拖拽到畫布，用拖拽復制，用完後再把大元件刪去）相比散裝元件，大元件的優勢在於畫圖時元件的檢索效率上，畫布中的檢索效率要大大優於元件窗口。如果沒有體驗過從1.0到2.0的叠代過程，其實很難感知到這壹層做法的優勢。四、STEP3：元件庫的加減法1.加法怎麽做？在多個項目的錘煉下，會發現網頁框架、上傳組件，甚至是B端最常用的web列表頁，彈出表單都是高頻元件。做元件庫的最大目的就是提高效率，而不是執著於元件的抽象和原子化。高頻使用的元件都適合放到元件庫裏。比如B端的列表頁，基本都需要支持批量導入數據，那直接把導入數據的彈窗、導入中、導入結果等封裝成壹個元件，那用到批量導入業務的原型，只需要把這個”批量導入數據“的元件拉出來使用即可。（批量導入數據元件，包括默認情況、上傳中以及結果頁）2.減法怎麽做？有些業務可能不適用默認尺寸或樣式，需要進行定制化改動，那我們還需要讓元件庫有良好的擴展性。我發現之前花費了大力氣的組件交互，這時候反而成了壹個麻煩，因為組件包含了動態面板以及更多元素，改壹個尺寸可能牽扯到多個面板內多個元素的改動，但是axure不允許跨面板選中同時改動，因此只能壹個個去改，並且極容易改漏了地方。比如壹個帶清除的下拉選框組件，如果僅需要改變寬度，就需要更改：選框的動態面板寬度、動態面板內矩形的寬度、調整清除icon定位、下拉列表的面板寬度、下拉列表中繼器中的選項矩形寬度，涉及多達5處調整，這和元件庫追求效率的核心訴求背道而馳。（示例：帶取消的下拉選框，擴展時涉及至少5處調整）所以我刪繁就簡，把帶交互的元件都統壹做壹個靜態版的用於原型展示。動態版本保留在元件庫，在需要展示或者定義交互的時候作為說明，但是具體原型中，只使用靜態組件，保持高效擴展。做了減法的下拉選框元件，擴展時只需要關註基本屬性，更多的屬性和交互通過備註進行說明：最後總結壹下制作元件庫的3個關鍵步驟：逐壹制作每個元件，感受壹下基礎的屬性修改，快速做出MVP；
把元件進行分類分組，並把同類項封裝成1個大元件，效率再次躍升；
根據個人使用場景進行自我叠代，給元件庫做加減法，可以封裝更大的元件，也可以簡化為完全靜態的原型制作法。
以上就是關於“Axure如何制作屬於自己的Axure元件庫？”的全部內容分享了，怎麽樣？妳學到了嗎？Axure學習講究方法與技巧，如果妳覺得妳的理解學習能力強，不妨繼續瀏覽更多Axure相關文章~當然，如果妳需要更加系統精準地學習Axure，那麽我建議妳選擇我們的Axure自學視頻課哦~最後點贊、留言+收藏，下次學習更方便哦~