UI設計用什么軟件做，全球4大主流UI工具淺析

在數字產品設計產業鏈條中，UI設計師往往發揮著承上啟下的作用。產品經理從一個“需求”開始，擬定一個抽象化的產品概念雛形，UI設計師通過視覺呈現的方式將這個抽象概念具象化，完成線框圖+交互邏輯+視覺+用戶體驗，最終輸出輸出高保真原型交付至開發工程師、決策者、客戶等角色。

　　據波士頓權威數據顯示，全球設計師從業群體將近1億，主要聚集在美、中、德、日、意等科技發展前沿國家，互聯網設計師人才需求正在呈現激增趨勢。由此，專為互聯網數字產品量身打造的UI設計工具得以迅速成長，以Sketch為先，攏獲了第一批全球粉絲，并在很長一段時間內，Sketch是許多UI設計師和UX設計師首選的設計工具。但在最近的幾年，UI設計領域陸續出現了不少后起之秀，其中3個比較有代表性的軟件：Adobe XD、Figma和Pixso。

　　在這篇文章中，將分別對這4款軟件進行介紹，方便你在挑選UI設計工具時，可以選擇到適合自己的那一款。

　　Sketch、Adobe XD、Figma和Pixso，這四款都是非常優秀的軟件，但每一款都各有優勢。

　　如果協作對你的設計過程至關重要，那么Figma和Pixso應該是你的首選；如果你喜歡折騰各種插件，那Sketch可能更適合你；如果你已經熟悉Adobe全家桶的界面，那么Adobe XD學習起來可能更輕松。

　　過去十年，Sketch一直是主流UI設計工具之一，雖然它到現在都不支持 Windows 系統，但仍有一大批忠實追隨者。

　　回顧它的背景，它是由荷蘭公司Sketch BV于2010年推出的macOS桌面矢量圖形處理軟件。Sketch在設計之初，就被設計成盡可能輕量和快速響應，去除了Adobe Photoshop和IIustrator內置的許多附加功能。

　　與IIustrator CS4相比，早期的Sketch界面極其簡單，不像Adobe擁有復雜的嵌套工具欄，Sketch頂部的圖標就是它的核心功能。

　　Sketch Mirror App是Sketch最有用也最受歡迎的功能之一，設計師將iPhone連接到Mac電腦，可以在移動設備上實時測試他們的設計。

　　這在現在看來可能不夠驚艷，但在2010年，這可以稱得上一個改變游戲規則的功能，即便是行業標桿Adobe也沒有類似的功能。

　　Sketch最初不支持多人實時在線協作，團隊成員編輯稿件時，需要頻繁來回傳輸文件，效率非常低下。

　　直到2020年底，Sketch才發布了實時協作功能，試圖在這一領域趕上Figma。不過這個功能并沒有集成到Sketch客戶端，開始協作之前，本地的Sketch文件需要先上傳到Sketch Cloud中，在瀏覽器打開分享鏈接，才能參與協作。

　　在價格方面，Sketch采用免費試用+訂閱制的方案，提供30天免費試用，到期后每位編輯者每月9美元，按年付費99美元，整體費用對設計師來說沒有吸引力。

　　Sketch的優點很明顯，但一直沒有推出Windows版本，有人為了能用上Sketch進行UI設計，不得不先去購買一臺蘋果電腦…天下苦Sketch久矣。

　　2016年，Adobe公司推出了基于矢量的UI設計工具Adobe XD，支持macOS和Windows系統，作為Sketch在Windows上的替代品，讓跨平臺協作的團隊能夠順暢溝通。

　　在使用Adobe XD之前，如果你用過Adobe的軟件，并且熟悉軟件的界面，那么當你接觸XD，就會感到很親切，可以很快上手，唯一的區別在于更復雜的設計系統和元件復用上。

　　背靠Adobe打造的多款軟件，可以說是XD最大的賣點之一，從位圖到矢量到動效，Adobe都有對應的工具來滿足設計師的需求，可以與XD很絲滑地聯動工作。

　　為了追趕Sketch形成的插件生態，Adobe公司設立了1000萬美元的基金，鼓勵眾多開發者開發面向XD的插件，目前XD已集成了RenameIt、 Pixel Perfect、Data Generator等插件。

　　在多人協作方面，XD支持將本地的文件保存為云文檔，之后向協作者發送郵件邀請，收到邀請的人打開文檔就可以參與設計協作。

　　不過，XD的協作功能存在著一定的限制，對于付費用戶創建的文檔，免費用戶試用30天協同編輯后就只能查看，無法再進行編輯。

　　XD的出現，可以說是眾多Windows用戶的福音，但在實際使用時，還是會遇到不少問題，譬如軟件容易崩潰、中文用戶無法使用內置的插件庫等，這在某種程度上降低了UI設計的效率。Adobe XD在產品設計方面還在繼續探索更多的功能，以滿足用戶需求。

　　與XD前后時間出現的，還有另外一款軟件，它就是這兩年海內外炙手可熱的Figma。

　　Figma，是一款基于云端的UI設計工具，可以直接在瀏覽器中運行，你可以在任何設備或平臺訪問你的項目，也無需安裝軟件或購買多個軟件許可證。

　　來自UX TOOLS發布的《2021設計工具調查報告》顯示，在Windows和macOS系統上，Figma的使用人數都超過了先前推出的Sketch和Adobe XD。

　　在Figma之前，從最初的草圖到原型設計，往往需要用到多款軟件，文件流轉次數多，迭代的周期比較長。

　　有了Figma之后，同樣的對接流程大幅縮短，團隊成員都能拿到最新版的文件。

　　Figma最大的特色在于協作，在右上角會顯示當前正在瀏覽和編輯文件的成員頭像，每個人的鼠標指針會帶有各自的昵稱，可以很方便地查看誰更改了什么，并將評論和反饋直接添加到需要溝通的位置。

　　當涉及矢量操作時，Figma的鋼筆工具更加靈活。Figma內置的矢量網絡，允許你把多條線連接到一個點上，在移動線段時，連接成線的點也會自動跟隨，這加快了矢量繪圖的效率。

　　對于選定的畫板或對象，Figma可以CSS、 iOS 或Android格式顯示代碼片段，供開發人員在查看設計文件時使用。此外，開發人員可以在設計文件中直接獲取標注信息，沒有必要使用第三方工具。

　　在價格方面，Figma有免費和收費兩種模式，免費用戶最多創建1個項目和3個文件，每個文件只能包含3個頁面，保存30天的版本歷史記錄，無法使用共享團隊庫；收費版分為兩檔，專業版每人每月12美元，組織版每人每月45美元，整體價格較高。

　　Figma誠然是一款非常優秀的UI設計工具，但對國內的用戶而言，它也存在一些水土不服的地方：網頁加載慢、部分內置字體不兼容中文，以及沒有推出中文版，無疑增加了軟件的使用門檻。

　　Pixso，是由國內本土團隊打造的對標Figma的一站式協同設計工具，集UI設計、原型、交互、標注和資源于一身，幾乎涵蓋了Figma的所有核心設計和協作功能，打通產品、設計和研發協作多款軟件間的壁壘，在一款軟件中就能完成產設研全流程，原生中文語言，更符合國人的使用習慣和需求。

　　基于對本土用戶需求的洞察和用戶反饋，在產品設計方面，相比國外的Figma，Pixso提供了不少差異化的功能和服務：

　?、?獨特的矢量網格，繪圖效率拉滿

　　憑借在計算機圖形領域的深厚積累，Pixso推出了獨特的矢量網格功能，支持在一個錨點上創建無數條路徑，可以連續創建多個開口或閉合路徑。借助矢量網格，可以快速完成復雜圖形的繪制，無需像傳統工具繪制多個圖層進行拼湊對齊。

　　在原有矢量網格功能的基礎上，Pixso在最近的一次更新中增加了多色矢量網格的特性，突破了矢量網格在色彩填充上的限制，支持在矢量編輯模式下，為繪制的閉合路徑填充不同的顏色。

　　使用Pixso多色矢量網格功能，可以輕松創作時下熱門的「幾何圖形」風格作品，包含 2.5D Logo、孟菲斯、低多邊形插畫等。

　　2.5D LOGO，一氣呵成。

　　孟菲斯主題海報，流暢繪制。

　　低多邊形插畫，輕松駕馭。

　　②智能化矢量設計，頁面布局更高效

　　Pixso聚焦智能化矢量設計，支持創建響應式的動態框架自動布局、智能化選擇，并提供全新的畫板工具和形狀工具，大大提升設計效率。

　　用戶調整內容時畫板將自動調整尺寸和布局，可批量調整圖層間距，靈活調換圖層位置，還可靈活調整節點、圖形填色、復雜形狀、快速轉換獲得多種圖形。

　　同樣地，在多圖排版的場景，借助Pixso的自動布局功能，可以讓元素的位置調整或堆疊排列變得更智能，簡化手動操作的繁瑣步驟。

　　③共享樣式和團隊組件庫

　　在Pixso中，顏色、文本樣式、圖層樣式不僅可以一鍵保存為資源，還可發布為團隊組件庫，在團隊內部和多個項目中多次調用。

　　一旦資源修改后，項目中引用的所有實例將會自動更新，可以大大提升設計創作及迭代的效率，并且所有資源都能共享到團隊，實現快速復用。

　　當你在團隊空間中新建了一個項目，可以看到團隊先前發布的團隊組件庫，啟用組件庫之后，在左側面板就能看到來自團隊組件庫的所有組件，這樣就實現了組件在不同設計項目中的共享和調用，減少不必要的重復勞動。

　　④自帶多款免費商用字體

　　鑒于最近這些年字體侵權的案例時有發生，為減少設計師因字體使用不當而帶來的侵權問題，Pixso自帶了多款免費可商用的中文字體：思源黑體、OPPO Sans、站酷快樂體、優設標題黑體、思源宋體等等，這些字體存儲在Pixso云端，使用前無需手動安裝，可一鍵調用。

　　⑤兼容多種設計文件，無縫銜接過往工作

　　在文件兼容方面，Pixso支持導入來自Figma、Sketch、XD、Axure的文件，成為國內首個兼容多種文件格式的設計協作平臺。

　　設計師可以放心地在一個平臺上自由地玩轉各種主流格式的文件，一站式實現從線稿到高保真產品界面設計，打通產研設計工作全鏈路，全方位提升團隊協作效率。

　　⑥海量設計資源的資源社區

　　在資源方面，Pixso上線了擁有3000+設計資源的「資源社區」，內置來自阿里、字節、騰訊、京東、谷歌、華為等設計系統，每月更新上百個精品模板，分類涵蓋移動設計、網頁設計、插畫、線框圖、矢量圖標等。用戶可一鍵快速調用，無需跳轉到其他網站尋找、下載。

　　在Pixso社區，用戶可將創作的模板一鍵分享到社區，并和其他設計師探討交流，也可以免費使用其他創作者分享的優質模板。

　　⑦支持私有化部署，滿足企業更高級別安全需求

　　Pixso 目前對所有個人用戶免費開放，個人用戶可以享受到 Pixso 會員的幾乎所有權益：無限文件數量、無協作者人數限制、無限云存儲空間等等，內置的所有功能都可以免費使用，對廣大國內UI、UX設計群里來說，誠意十足。

　　默認情況下，用戶創建的文件都存放在 Pixso 服務器上，考慮到企業想要自主掌握數據的需求，Pixso也提供了私有化部署的方案，滿足企業更高級別安全需求。據Pixso團隊介紹，目前已經有數十家各行業頭部企業的設計團隊正在使用Pixso企業服務。

　　本文提及的4款常用的UI設計軟件，可以說UI設計工具的演變和發展，實際上也是一個行業工作模式發生變化的縮影。

　　從最開始有一個好用的UI設計工具就夠了，到后來誕生了具備多人實時協作、打通產設研流程的一站式UI設計工具，工具的演變軌跡，也越來越貼合UI設計師的需求和協作流程。經過對比之后，無論是Sktech強大的原型設計功能，Figma的社區生態，還是Pixso的原型+UI設計+交付的流暢體驗，都并沒有限制你必須選擇哪一款工具，而是了解并選擇更適合團隊工作節奏和語言環境的工具。