使用者體驗圖示：一句話生成定製 UX 與 UI 圖示
在素材庫裡搜使用者體驗圖示，得到的是上千個風格各異的近似結果，沒有一個用你的色板。換個方式：用一句話描述概念，直接生成 1024px、按你的配色出圖的 UX 圖示，可對比多個方案、可預檢小尺寸，並匯出專案需要的全部格式。
各風格圖示示例
生成器產出的成品圖示，從扁平 UX 圖示到 3D 風格，每一個都從 1024px 母版到 16px favicon 保持輪廓清晰。
什麼是使用者體驗圖示？
使用者體驗圖示是代表一個 UX 概念的小圖形：旅程圖、可用性測試、反饋環、無障礙檢查。它屬於一個圖示家族，而不是孤立符號，這正是隨手抓一個素材圖示常常與頁面格格不入的原因。說出概念，在 1024px 下生成候選，再按這些圖示真實渲染的尺寸去檢驗。
一個圖示只講一個概念
旅程圖圖示若再暗示資料分析，兩個意思都會讀不清。最強的 UX 圖示每個只表達一個概念，由整套圖示而不是單個圖形來講述頁面的故事。
文字標籤承載含義
Nielsen Norman Group 的圖示可用性研究發現，只有少數圖示（如主頁、搜尋、列印）能脫離文字被理解。把每個使用者體驗圖示都當作「圖形+標籤」的組合來規劃，在功能網格里尤其如此。
每次生成都在畫布上
每次生成都會帶著提示詞落在畫布節點上，可以分叉方向、並排對比，上週的會話原樣重開，不必重做。
三步生成一個使用者體驗圖示
從一行 UX 概念描述，到覆蓋功能網格、案例頁與 favicon 的母版檔案。
- 1
寫明概念與風格
用一句話寫清 UX 概念、風格家族與色板，例如 "rounded line user experience icon, journey map with pins, indigo on white, readable at 16 px"。輪廓描述得越具體，需要的輪次就越少。
- 2
生成後先看小尺寸
候選圖以 1024x1024 生成。選擇前先切到 48、32、16px 預覽，因為細線條和擁擠細節只有在真實渲染尺寸下才會暴露。
- 3
鎖定家族，全格式匯出
沿用勝出方案的風格描述生成整套圖示，並把它設為參考圖讓後續圖示跟隨其風格，最後從一個母版匯出 PNG、ICO、WEBP，覆蓋網頁、路演與產品 UI。
使用者體驗圖示提示詞示例
把任意一條複製進生成器，再換成你自己的概念。一條好的 UX 圖示提示詞寫清三件事：概念、風格家族、色板與背景，因為這三點決定圖形在標籤旁的呈現效果。
旅程圖圖示
rounded line user experience icon, journey map path with three pins, indigo on white, uniform 2 px stroke, readable at 16 px, no text
可用性測試圖示
flat UX icon, magnifier over a tap target, two solid colors on off-white, generous margins, crisp at 24 px, no text
反饋環圖示
minimal UI design icon, circular feedback loop with a pulse line, teal on white, open negative space, crisp at 24 px, no text
獲取使用者體驗圖示的三種方式
素材庫、開源圖示集與 AI 生成器最終都產出一資料夾圖示，差別在許可證條款、圖示是否匹配你的設計系統，以及下一個概念缺失時會發生什麼。
| 素材圖示庫 | 開源圖示集 | AI 圖示生成器 | |
|---|---|---|---|
| 圖示來源 | 上架數千個現成使用者體驗圖示的交易平臺 | Myna UI、Lucide、Tabler 等精選庫，經 npm 與 Figma 分發 | 你的提示詞：概念、風格家族與色板寫在一句話裡 |
| 許可證 | 因方案而異；免費檔通常要求署名 | MIT：個人與商用皆免費，保留許可證檔案即可 | 生成的每個圖示都享有商用權利 |
| 品牌匹配度 | 最接近的勝出；色板與筆畫粗細很難對上 | 風格統一但大眾臉：同一套圖示全網可見 | 按你的色板與筆畫生成，貼合設計系統 |
| UX 概念覆蓋 | 廣而雜：結果很多，16px 下能讀清的很少 | 介面操作圖示齊全；旅程圖等研究類圖形罕見 | 只要說得出的概念都能生成，含冷門 UX 與研究圖形 |
| 補充下一個圖示 | 再搜一次，指望同系列裡恰好有近似款 | 提需求、等待，或者自己畫 | 沿用風格描述加參考圖，直接生成 |
| 整套成本 | 訂閱或按包付費，年年續 | 免費，代價是整合除錯時間 | 按生成次數消耗積分，免費額度起步 |
對比口徑：獲取 UX 圖示的常見途徑，依據各素材庫定價頁與開源許可證資訊核對，2026 年。
生成器替你處理的事
從關於 UX 概念的第一句話，到能直接放進版面的母版檔案之間的一切。
按你的色板出圖
在提示詞裡寫明顏色，候選圖就按這套顏色生成，圖示放進功能網格無需再調色。
參考圖匹配
上傳一個已確認的圖示，新生成的圖會跟隨它的風格，讓整套 UX 圖示家族不跑出你定稿的風格。
同一概念多個方案
把一個圖形分叉成不同筆畫、色板與風格版本，並排對比，保留勝者也不丟掉備選。
小尺寸預檢
每個候選圖都能在 48、32、16px 預覽，這正是介面圖示在標籤旁垮掉的尺寸。
全場景格式匯出
從一個母版匯出 PNG、ICO、WEBP，透明背景用於版面，實底版本用於按鈕與徽章。
畫布記住一切
生成結果帶著提示詞留在畫布上，今天開始的 UX 圖示集，下週可以從斷點繼續。
Myna UI 圖示等開源集的定位
介面操作類圖示，開源庫是合理的第一站。Myna UI 圖示提供 2500 多個基於 MIT 許可的圖示，面向 Tailwind CSS、shadcn/ui 與 Figma；Lucide 和 Tabler 覆蓋同類需求，構成了每個產品都需要的介面設計圖示：設定、箭頭、檔案操作、成排的介面圖示。但開源庫天然追求通用。一旦某個版面需要按你色板定製的概念圖形（UX 功能網格、案例圖、服務頁），在庫裡翻找拼不出一套風格統一的家族。實踐準則是：操作圖示用開源集，概念圖形用生成器，兩邊保持同一筆畫粗細。
介面操作圖示用開源
安裝 @mynaui/icons 或 lucide，日常操作即刻齊備：選單、開關、箭頭、搜尋。MIT 許可讓商業產品免費可用。
概念圖形用生成器
旅程圖、可用性測試、反饋環：寫清概念與色板，圖形就按你介面圖示所在的體系生成出來。
兩個來源一種筆畫
讓生成的 UX 圖示與開源家族保持相同筆畫粗細，混排的圖示行讀起來才是一套設計系統。
部落格
延伸閱讀
關於圖示、風格與匯出流程的深度文章。
使用者體驗圖示常見問題
使用者體驗圖示覆蓋什麼、去哪裡拿 UX 與 UI 圖示，以及設計師生成前的常見疑問。
什麼是使用者體驗圖示？
它是代表一個 UX 概念的小圖形：旅程圖、可用性測試、反饋環、無障礙檢查。這類圖形出現在功能網格、案例頁、服務列表與設計系統文件裡，通常以「圖形+標籤」成對出現。使用者體驗圖示屬於共享筆畫粗細、色板與圓角語言的家族，這正是設計過的圖示集與一資料夾混雜素材的區別。
哪裡能免費下載使用者體驗圖示？
三條路。素材庫（Flaticon、The Noun Project）的免費檔提供 UX 圖示下載，但有署名規則與每日上限。Myna UI 圖示、Lucide、Tabler 等開源集採用 MIT 許可，商用免費。或者在上方生成器裡直接描述概念：免費額度起步，返回的是按你色板定製的圖形而非現成檔案。
如何免費用 AI 生成使用者體驗圖示？
上方生成器自帶免費額度：用一句話寫清概念、風格家族與色板，生成第一批候選圖，在付款前先看 16px 效果。後續生成消耗積分，所有方案都包含全部風格與匯出格式。
Myna UI 圖示可以免費使用嗎？
可以。Myna UI 圖示是基於 MIT 許可的開源圖示，超過 2500 個，面向 Tailwind CSS、shadcn/ui 與 Figma 構建，個人與商業專案都可免費使用，無需署名。與其他 MIT 包一樣，在倉庫裡保留許可證檔案即可。它覆蓋介面操作圖示；需要按自己色板定製的概念圖形時，在這裡生成。
什麼樣的使用者體驗圖示是好的？
一個圖形一個概念，因為同時表達兩個意思的圖形哪個都讀不清。輪廓簡單到 16px 仍可辨認。筆畫粗細與旁邊的文字匹配，色板取自品牌色而不是遊離在外。大多數不合格的 UX 圖示只違反這四條中的一條，而不是全部。
使用者體驗圖示需要配文字標籤嗎？
幾乎總是需要。Nielsen Norman Group 的圖示可用性研究發現，只有少數圖示（主頁、搜尋、列印等）能脫離文字被穩定理解。在功能網格與服務頁裡，讓每個圖形與標籤成對，圖示負責加速識別，而不是獨自承載含義。
使用者體驗圖示需要哪些尺寸？
產品 UI 裡的介面圖示以 16、24、32px 渲染，路演與案例頁用 64 到 128px。母版按 1024x1024 生成，先在 48、32、16px 預覽裡檢驗，再按各場景需要的尺寸從母版匯出。
怎麼讓 UX 圖示匹配品牌色板？
直接在提示詞裡寫明顏色，色值或顏色名都行，候選圖按這套顏色生成。這比事後給素材圖示調色更好，調色會破壞抗鋸齒邊緣。做整套圖示時，先生成並確認一個圖示，再把它設為參考圖，後續圖示自動跟隨同一色板。
AI 生成的 UX 圖示可以用於商業專案嗎？
可以。你保留對每個生成圖示的完整商用權利（以服務條款為準），包括用於客戶專案、上線產品與付費推廣的圖形。
UX 圖示需要什麼檔案格式？
版面與網頁用帶透明通道的 PNG，更輕的交付用 WEBP，兼作 favicon 時用 ICO。母版為 1024x1024，所有更小的尺寸都由它切出，路演與一頁紙中的印刷級使用同樣清晰。