新手UI 設計師必讀！Sketch、Adobe以及Figma的差異以及哪個 ...

目前提供免費方案的有Adobe XD 跟Figma， sketch 為訂閱制（USD 99/年，續約為USD 79/年），針對新戶享有30 天免費試用，所以對於學生練習而言不是那麼 ... HomeNotificationsListsStoriesWritePublishedinAAPD — AsAProductDesigner·【2021年更新】新手UI設計師必讀！Sketch、Adobe以及Figma的差異以及哪個工具適合你？身為新手UI設計師，了解何種設計工具適合自身學習與使用至關重要，本文聚焦在Mockupdeliever階段對於剛開始要設計UI的新手設計師而言，市面上的設計介面軟體高達幾十種，如果不做一點功課的話還真不知道從何下手。

且因應到未來的趨勢，在這百家爭鳴的時代裡為了讓各家設計師心有所屬，介面設計軟體除了要有流暢的使者體驗，以及能夠真正解決設計師需求的洞見。

其中又以Sketch、AdobeXD、Figma為主流。

由於公司最近剛來了一位想要轉職UI設計師的平面新人，為了讓他快速進入狀況和節省工作流程，我製作了以下的表格，也順便提供給各位新手設計師懶人包跟一些自己使用上的心得內容目錄使用心得與差異表格統整整體表現與建議使用痛點一、使用心得與差異Sketch：恨鐵不成鋼，早期UI設計師的最愛作為我第一個使用的UImockuptool，最近有點後繼無力的感覺…記得最初使用時還是感到非常非常新奇的畢竟當時sketch顛覆了AI與PS的市場，且成功的成為UI設計師的主流工具。

但隨著之後的競爭對手的增加，sketch很多功能都是競品出現後才隨之增加的（包括prototype和real-timecollaboration）過去的老大哥現在似乎慢慢跟不上腳步但依照目前的市佔率和過去的表現，還是有不少設計師跟團隊是sketch的鐵粉。

希望sketch能守住他的地位，找出更有洞見的策略來抓住設計師的心優點：Plugin多、Maconly（好像不算優點？）、ComponentsView(Beta)簡單明瞭、訂閱期間結束後可繼續使用原版本AdobeXD：展現強烈企圖心的小鮮肉UItool為多數設計師使用的Adobe系列所推出的介面設計軟體。

特色是極簡的純白色介面與AI、PS的軟體相容性。

還有不同於Sketch僅能在Mac電腦，XD也可以在Windows平台上使用。

（當初就是為了sketch買了MacBook）就以我的個人意見來說，XD還有很多進步的空間，不過還是有一些功能我認為是比sketch與Figma優秀的，像是可以直接用MainComponent設定State，不需要再分開設定，以及流暢的Auto-animation跟簡單的RepeatGrid。

而且按照Adobe公司的規模跟人才，應該之後還會推出更讓人驚艷的功能。

優點：跨平台（Mac&Windows）、免費（提供一個co-editor跟shareddocument）、AI&PS相容性、版本可持續更新Figma：令人感到興奮又期待的後起之秀相信光最近推出的Variants就足夠讓眾人吹爆了，我不敢相信到現在還有人沒感受到他的魅力。

從Figma最一開始以「替設計師解決溝通的問題」當作價值主張來說，就已經引起廣大UI設計師的共鳴了。

且Figma非常適合拿來當作遠端協作的工具。

因為Browserbased的設計機制，只要你能開啟瀏覽器視窗，不管Mac還是Windows甚至是Linux系統都可以使用Figma來設計。

並且可以即時性的與團隊demo、collaborate和快速的給予feedback，Prototype也很出色！重點是免費！！！這麼接近神器又人性的工具，就算未來會收費我也甘之如飴…這也是為什麼近年Figma的聲勢愈來愈浩大的原因，總覺得未來Figma有可能會變成Mockupdesigntool的主流，拭目以待優點：跨平台（Mac&Windows&Linux系統可開啟）、網頁隨開隨用、免費、預覽csscode、即時溝通、版本可持續更新二、表格統整以下統整表格僅探討個人方案，企業版不在此限CollectedbyBoboZ.※上圖更正：figma可以存成本機檔案.fig2021年更新如下：【AdobeXD】個人版已經有收費方案，收費後功能更完整。

原本的個人版從2021年6月開始有以下限制：•匯出成PDF檔案次數上限2次•Prototype的匯出錄影檔次數上限2次（Maconly）•限1個公開的library和1位共同編輯者，瀏覽者則不限（2021將上路，時間未定）【Sketch】•2021年5月開始有多人即時協作(real-timecollaboration)【Figma】以下變動已在2021年4月開始生效•(Team)Project只能有3個file，每個file只能創建3個page•從原本的2位co-editor變成無人數上限的co-editor•draft只有自己能編輯，別人只能看到有什麼檔案。

如果需要多人協作需要把draft的檔案拉到team裡三、整體表現與建議(1)收費方案目前提供免費方案的有AdobeXD跟Figma，sketch為訂閱制（USD99/年，續約為USD79/年），針對新戶享有30天免費試用，所以對於學生練習而言不是那麼親切。

(2)切圖表現目前三種軟體都可以進行切圖和導出，也都能連結ZeplinPlugin。

要說比較差異的話就是AdobeXD目前需要在Export時選擇切圖格式。

（網友回饋：選擇ios可生成1x/2x/3x的圖片形式，web僅導出1x/2x。

Sketch跟Figma則是可以直接在右側Panel設定並匯出。

）(3)設計交付對in-house的團隊來說，Figma的設計檔只能以Link的形式交付，要是網路不好Figma會無法順利編輯，而XD跟Sketch能夠在無網路的情況下開啟應用程式並存檔，可能對某些人而言會比較適合。

（網友回饋：Figma可存為.fig存在本機端）(4)未來趨勢依照目前的趨勢，勢必有愈來愈多設計師轉移到Figma。

由於它強大的跨平台、即時溝通性以及充滿潛力的創意性，非常適合遠端團隊及跨國工作的設計師。

不過以初學者而言，我認為不一定非得選擇Figma，其實Sketch跟AdobeXD可能會更適合新手（個人意見），因為Figma的學習曲線會再相對複雜一點，可能需要多付出一些時間來學習。

所以參考目前預算考量、未來公司型態、團隊溝通模式、設計團隊體系，來決定使用何種Mockupdesigntool。

如果你是個非常有時間的新手UI設計師，去學Figma吧，絕對會愛上的。

如果說Sketch是讓人微醺的紅酒，AdobeXD是慢慢侵蝕你的涼菸，那Figma絕對是讓你欲罷不能的一級毒！！！品！！！不管多少都給我來一點！！！四、各軟體的使用痛點Canvas大小限制：AdobeXD/Figma網友回饋：Figma的canvassizelimit:每邊各130,000px(-65,000~+65,000），檔案有2GB的限制；每張bitmapimage有4,096x4,096px的限制，若超過會自動縮小；AdobeXD的canvassizelimit:50,000x50,000px。

根據外國網友經驗在1920/web的情況下可放60+以上的Artboard，非常吃效能跟空間。

Artboard沒有Fit功能：AdobeXDCtrl+D/Cmd+D不能重複上一步動作：AdobeXD形狀圖層容易誤觸，被轉化成路徑（Path）：AdobeXD切圖後的Component需要另外放置到空白區塊並且存為Localfile才能成功導出至Zeplin：AdobeXD字體（TextStyle）被顏色限制：AdobeXD/Sketch畫布（Artboard）與圖層（Layers）無法同時拖拉：AdobeXD/Sketch複製圖層或元件候，不能多選Artboard貼上至同樣區塊：Sketch內陰影無法設定：AdobeXD軟體之間的圖層無法承襲：-Sketch貼上至AdobeXD→產生MaskGroup/Path/RepeatedGroup-Sketch貼上至Figma→合併圖層變成一張image-AdobeXD貼上至Sketch/Figma→合併圖層變成一張image-Figma貼上至Sketch/AdobeXD→無反應，需事先CopyasSVG或使用其他付費轉檔外掛（網友回饋）最後，我開始經營Instagram囉！我利用職場型漫畫的方式描述新手設計師在成為UXUI設計師的心路歷程，以設計師視角畫出轉職的故事以及工作上可能會遇到的事情，與讀者一起成長！有興趣的話請追蹤➡️uxui.bobo謝謝閱讀到這裡的你們！如果喜歡我的文章的話，可以幫我拍拍手👏👏👏📌拍手1-10下：謝謝分享～📌拍手11-25下：很不錯！📌拍手26-35下：優質好文，期待下一篇📌拍手36-50下：超級實用！快點再出其他文章呀～～另外，也可以留言或寫信跟我分享意見或是推薦我其他主題唷！也可以直接訂閱我，不定期會更新文章來回饋朋友們📬https://medium.com/as-a-product-designerMorefromAAPD — AsAProductDesignerAAPD專注於分享數位產品設計的相關資訊，並且致力在平台上創造更多的交流與互動，我們關注UI設計、UX設計、設計師的個人成長、設計趨勢與產業動態等，希望透過這些知識的傳遞，能夠降低每位設計師成長的過程中所遇到的阻礙。

歡迎來信投稿：[email protected] — AsAProductDesignerGetstartedBOBOZhan462Followers從完全不了解設計到可獨立作業的UXUI設計師，現職@Bito，有空的時候會來Medium分享知識和經驗。

聯絡我>>Email:[email protected]/Facebook:Bannerfit/Instagram：uxui.boboFollowRelatedCanARHelpYouLearnAboutPlants?Inthisproject,ourteamsetouttoparallelprototypeimmersivelearningexperiencesatthePhippsObservatoryandBotanicalGardenswith…CityMapperApp-IronHackChallengeWhatisCityMapper?Theimportanceoftesting&prototyping|TomVerbist,AchillesDesignUIkitofanaudiotourappinanartgalleryHelpStatusWritersBlogCareersPrivacyTermsAboutKnowable