國產設計軟體實操體驗：時代拐點悄然而至，讓Design In China成為民族驕傲

編輯導語：用慣了Sketch軟體的作者，在「遺憾」錯過了Figma以後，發現原來如今國產設計軟體發展得蒸蒸日上，於是選擇了即時設計、Mastergo和Pixso這三個國產設計軟體，對它們進行了實操測評，最後輸出了一份操作體驗報告，一起來看一下吧。

作為一個從業十年，使用了5年Sketch軟體的傳統設計師，在「遺憾」錯過了Figma以後，沒想到如今國產設計軟體發展得蒸蒸日上。在今年以創作者身份入駐各個設計軟體平台之後，萌發了這一次獨特的體驗巡禮。

在過去從Photoshop轉到Sketch的時候，我經歷了一段痛苦的用戶習慣改變，我如今還記憶猶新，但當我對Sketch徹底熟悉以後，我就再也不想使用Photoshop了。而現在，時代的拐點又悄然而至。

如今以即時設計、Mastergo和Pixso為代表的國產設計軟體已經日漸成熟，他們design in china，懷著為國產設計師打造一款屬於自己人設計軟體的願景，在這條無比艱辛的設計路上，付出了無數的汗水和努力，而經過多年的打磨，他們已經具備了不輸於Sketch、Figma的軟體實力。

趁著五一假期，我對這三個設計軟體逐一進行實操測評，最後為大家輸出一份操作體驗報告。

一、產品介紹

1. 即時設計

即時設計誕生時間最早，軟體前身為即時原型，通過5年多的打磨，2020年9月正式上線發布。目前即時設計宣布用戶數已經突破100萬，從設計資源到設計創作、團隊協作，致力於成為國內設計師和設計團隊手中國產的主力設計工具，打通國內設計生態，為設計師提供一個在線設計平台。

2. Mastergo

Mastergo作為國內最早的產品設計協作平台藍湖旗下的旗艦產品，背靠藍湖多年的用戶、產品、技術資源積累，2021年2月發布測試版，10月正式上線發布，目前Mastergo聯合多家國內企業打造「國產設計軟體共創計劃」，致力於解決開發者和使用者之間的斷層溝通，真正實現產研協同All-in-one。

3. Pixso

Pixso是深圳萬興科技內部孵化的旗艦產品，而萬興科技旗下擁有過多款千萬級產品如億圖、墨刀等知名軟體，Pixoso2021年5月發布測試版，10月正式上線發布。Pixso致力於成為新一代產品設計協作工具，集合「原型 · 設計 · 協同 · 交付 · 資源管理」全流程鏈路，為UI設計師和企業提供專業先進的協同設計解決方案。

二、體驗用戶

三、體驗環境

四、體驗步驟

體驗步驟很簡單，我選了三個優秀的APP，然後根據我自己多年的設計流程使用三個軟體進行設計臨摹，這樣的目的是通過真正的實操使用來熟悉軟體，只有這樣才能全面了解它的優缺點。

1. 設計準備

1）熟悉工作台

嘗試一個新的軟體真的不容易，相比過去使用Sketch的習慣，我對工作台完全沒有概念。所以當我首次進入國產設計軟體工作台的時候，有點無從下手。不過經過了短暫的熟悉，對以在線協同為理念的設計軟體慢慢能理解了。

相比傳統的PS、Sketch本地軟體，不需要再去思考文件需要保存在哪個硬碟，其次文件隨時都在自動保存，不用擔心文件會丟失或損壞。團隊的概念也特別突出，過去設計這部分工作都是獨立的，如今在線協作的理念就是讓產品、交互、設計、研發融合在一起，實現All-In-One。

即時設計：

即時設計的工作台聚合了很多功能，右上角可以快速導入JSD（即時設計本地文件）、Figma（支持超鏈接導入）、Sketch、XD文件，左側欄為最近工作文件、工作台、正在跟進、回收站以及團隊。

文件夾是一個非常友好的功能，這樣方便設計師對設計文件進行統一的管理，其次提供社區的優質資源下載快速上手。選中文件點擊右鍵後，有一個查看歷史版本和跟進文件，這兩個功能非常棒。查看歷史版本可以返回對該文件操作的歷史版本，再也不用擔心文件的誤刪除或其他災難事件了。而跟進文件可以對該文件進行全面跟蹤，這非常便於協作。

Mastergo：

Mastergo的工作台非常簡潔，學習成本較低。優質資源為用戶提供社區的精品資源下載，幫助快速上手，右上角可以快速導入Figma、Sketch、XD的文件，左側欄可以查看草稿箱、回收站和資源社區，左下角可以快速建立團隊。

Pixso：

Pixso的工作台做了很出色的新手引導，用戶打開後，可以在右邊查看軟體操作的視頻課程，這節省了用戶快速上手的時間成本。其次用戶可以快速導入Figma、Sketch、XD等文件，可以訪問資源社區。左側欄分為草稿箱、回收站、資源社區和團隊管理。

2）新建文件和畫板

工作台熟悉以後，我將開始建立文件進行實操。這一步非常簡單，點擊新建，就能立馬生成文件。即時設計、Mastergo和Pixso均支持多種畫板的尺寸，如手機、桌面、平板、平面等。

即時設計：

新建文件後，出現了一個引導提示，這對從未使用過設計軟體的新手來說非常友好，這會讓他們知道怎麼開始第一步。

Mastergo：

Mastergo的界面和Sketch一樣簡潔，這讓我有種熟悉的感覺，更容易上手。

Pixso：

和Mastergo的界面相似，Pixso的設計和Sketch一樣簡潔，讓我的上手成本更低。

3）熟悉工作區

UI設計軟體的功能其實幾乎大同小異，雖然使用了Photoshop十年、Sketch五年，但其實真正使用的功能沒有超過20%，所以雖然是新軟體的學習，但其實更多是探索一下工作區，簡單熟悉一下軟體的功能分類和操作習慣。

即時設計：

和Sketch相比，操作區的展現形式略顯不同。不過經過我的仔細探索，我發現了一個Sketch適配模式，這簡直就像和老朋友相遇一樣，非常棒，我快速切換以後，降低了學習成本。

Mastergo：

Mastergo的操作面板和sktech很相似，操作習慣相近，我在文件里發現了歷史版本的功能，這個功能我覺得非常方便。其次點擊右鍵後，提供了一個沉浸模式，有點像xmind裡面的zen模式，在設計演示場景中非常方便。

Pixso：

Pixso的操作區也和sketch很相似，非常簡潔，用戶習慣也差不多，上手起來很方便，其次我在文件里也發現了歷史版本的功能，非常方便。

4）小結

通過對工作台、操作區的熟悉，基本上對設計軟體有了初步的了解，這一步其實就是用戶習慣破冰。當用戶需要脫離以前的習慣耗費時間去學習新軟體的時候，如何開始第一步就顯得特別重要。雖然這是第一次使用，但即時設計、Mastergo和Pixso的學習成本都比較低，只要靜下心花上5分鐘，都能快速上手。

2. 原型設計

1）導入組件庫

每個設計師應該都有一套自己的組件庫，這就像一個工程師的工具箱，過往多年的設計工具都裝在裡面了。所以在開始作業前，我需要導入自己工作多年的Sketch組件庫。組件庫的導入讓我花了很多時間，和我理解的方式徹底不同，原來在線協同軟體的組件庫需要從團隊資源導入更新，這害苦了我，最後從官方用戶群找到技術才解決。

即時設計：

組件庫的入口在左下角，再加上沒有中文的提示，我花了好久的時間才找到。進入組件庫以後，需要點擊共享設計庫，進入詳情後點擊發布才能生效。這樣的路勁實在太長了，第一次使用的成本太高了。

Mastergo：

組件的位置很明顯，就在圖層的左邊，不過操作很繁瑣，我需要先回到工作台的團隊面板，導入組件庫，進入組件庫文件，然後添加到團隊組件庫，發布更新才能正式生效，這讓我折騰了好久。

Pixso：

Pixso組件的導入邏輯和mastergo很相似，都需要在團隊導入組件發布以後才能生效。

2）建立文本樣式

組件庫雖然導入了，但是我發現均不支持導入文本樣式，而文本樣式是確保整個界面的字體大小、顏色保持統一的基礎，所以我只能單獨重新製作一套文本樣式組件庫。

即時設計、Mastergo和Pixso均嵌入了多款免費商業字體，無需下載安裝，極大節省了設計師的成本，其次有效避免設計師使用商業字體帶來侵權的困擾。另外，它們都提供了本地字體下載助手，這幫助我可以快速載入本地的字體，非常方便。

最讓我驚喜的地方則是字體均支持使用漸變色、支持圖層混合模式，這省去了我過往使用Sketch時候要去photoshop進行視覺加工的成本，我的天，這真的棒極了。

3）建立顏色樣式

和文本樣式一樣，顏色樣式是確保整個界面配色統一的基礎，在我開始使用形狀工具之後，就需要開始建立顏色樣式，確保整個設計的顏色統一。即時設計、Mastergo和Pixso的顏色樣式功能和Sketch都差不多，沒有太多學習成本，輕鬆上手。

4）製作基礎組件

設計組件是Sketch最吸引我的地方，我以前在學習UI設計的時候嘗試過Photoshop，那種批量修改的痛苦讓我每次想起都感到難受，所以自從嘗試Sketch以後就徹底放棄Photoshop了。

組件的建立比較簡單，但相比Sketch，即時設計、Mastergo和Pixso都加入了一個變體的功能，這真的很棒。因為在Sketch里當一個組件有不同狀態的時候，我需要建立不同的組件，略顯繁瑣，而變體的設計，可以一勞永逸，方便操作，更加靈活。

當然，對於組件的使用，如果是一個新手，需要花上不少時間成本，不過對於已經習慣組件化設計的設計師來說，即時設計、Mastergo和Pixso的設計真的非常方便。

5）完成交互臨摹

通過建立文本樣式、顏色樣式和掌握基礎組件的製作方法，接下來的工作就是根據每一個頁面的結構進行拆解、臨摹和組合。

相比Sketch、Photoshop本地部署的軟體，即時設計、Mastergo和Pixso的操作性也非常流暢，沒有卡頓，不過你盡量要保證你的網路穩定，我在製作過程中確實也遇見過網速不佳導致軟體無法操作的情況，還好數據是完整無誤的自動保存下來，並沒有造成影響。

隨著操作時間的增多，每個軟體僅用1天就可以完整上手了，這種感覺棒極了。

6）小結

當我開始實際操作以後，我發現學習成本並不高，當然這和我的工作經驗有關，其次即時設計、Mastergo和Pixso在功能體驗方面，進行了一些關鍵創新，極大的提高工作效率，這是一個以外的驚喜，而當我徹底熟悉以後，我開始對它們越來越有興趣。

3. 視覺設計

1）使用漸變

漸變工具比較簡單，只要掌握漸變原理，沒有太大的學習成本。其次相比Sketch，即時設計、Mastergo和Pixso都提供了優秀的插件，有很多現成的漸變效果，只需滑鼠輕輕點擊，設計效果就出來了，這對新手的幫助非常大，讓設計變得更簡單。

2）設計配圖

設計配圖可以稱為這次國產軟體體驗的啊哈時刻，即時設計、Mastergo和Pixso都提供了非常棒的圖片資源庫，而且這些全部都是免費可商用的圖片，這極大降低了配圖的時間成本，你只需要搜索關鍵詞，就能找到很好的配圖。這不僅對新手來說是一個非常棒的功能，對任何一個設計師來說，在向團隊或業務方展示初步方案的時候，太節省時間了。

而且圖片的填充功能也非常棒，粘貼以後，等比自適應縮放，如無特殊處理，你都不需要做任何動作，對於新手來說，這簡直就是傻瓜式操作，大大降低了設計的成本。再加上支持混合模式，視覺設計變得更加簡單。

3）繪製圖標

雖然從業多年，但我不擅長畫圖標，我一般採用iconfont插件進行二次繪製或直接交給我的同事。但這次為了全面體驗，我簡單嘗試了幾個簡單的圖標繪製，我發現以前在Sketch里畫圓弧已經算困難的事情，即時設計、Mastergo和Pixso可以輕鬆搞定，真讓我意識到必須要與時俱進，才能跟得上時代的腳步。

至於貝塞爾曲線、圖形的演算法組合，和Sketch都大同小異，沒有學習成本。

4）設計走查

把所有頁面設計完以後，我要開始進行設計走查。這一步將會整理各個頁面的圖層分類，以及頁面名稱。

即時設計&Pixso：

我在即時設計和Pixso發現一個特別好用的功能，批量收縮畫板的圖層展示內容，這對圖層的管理有極大的幫助，以前在sektch里對這個問題就非常頭疼。

5）小結

通過對原型頁面的視覺設計，我對即時設計、Mastergo和Pixso的滿意度越來越高，特別是內嵌的資源插件，非常豐富，極大節省了太多的設計成本，這對新手設計師來說，真是一個極大的福利。我甚至覺得未來產品經理、交互設計師、前端工程師都能做出60分的設計稿了。

這足以說明，隨著軟體的門檻越來越低，對設計思維的提升特別重要，你的老闆需要的，不是一個只能掌握工具的設計師。

4. 交流協作

1）邀請成員

好了，設計走查沒問題以後，我決定邀請我的同事參與到項目裡面，嘗試從未有過的協作體驗。即時設計、Mastergo和Pixso的在線協作模式沒有太大區別，可以直接分享鏈接給團隊、同事，對文件也可以進行許可權設置，徹底打消了我擔心其他人誤操作文件的顧慮。

2）在線協作

當我看到同事加入文件後的游標操作時候，我真的感到不可思議，這種感覺實在是太爽了。想想過去當我要去為同事們演示一個項目時，我需要把圖片導出原型工具平台，然後寫說明、做標記，最後通過分享屏幕不斷解說才能確保設計方案以最好的形式傳播給大家。

而現在，這極大節省了溝通時間成本，而且以最佳的傳播效果向大家展示，這讓我非常興奮，像是打開了一個潘多拉寶盒。我終於能理解為什麼很多設計師那麼迷戀Figma了，而如今，我們有了即時設計、Mastergo和Pixso這樣優秀的在線協同軟體，再也不用擔心網速和其他干擾因素了。

3）交互演示

把交互演示和設計融入一體真是一個非常好的創意，這真的節省了太多的時間。這兩個流程節點本身就密不可分，甚至可以同步設計，過去我真的需要花很多時間導入到原型工具，然後製作交互演示，真的非常消耗時間，而現在不需要了。

就在同一個軟體，同一個流程節點便可製作交互演示，真的讓人感覺非常棒，感謝即時設計、Mastergo和Pixso，解決了設計師的一大痛點。

4）前端製作

為了驗證在線協同軟體提倡的All-In-One的設計理念，我特意把程序工程師也邀請進來，讓他親自嘗試一下這樣的協作模式，看看是否還需要像以前那樣我把圖片、圖標輸出，答案是不需要，他親自體驗了研發模式，他覺得很棒，可以直接開始頁面製作。

這極大省去了過去設計定稿後需要製作切圖，輸出規範的時間。感謝即時設計、Mastergo和Pixso，這一趟體驗旅程讓我真的知道如果再不改變，就不是像遺憾錯過Figma這件事那麼簡單了。

5）小結

這是我第一次體驗在線協作的模式，當我把同事都加入到文件以後，大家對這樣的協作方式都感到不可思議，覺得棒極了，這將會極大提高我們以後的作業效率，我也真正開始慢慢思考為什麼5年前要從Photoshop轉到Sketch，這就像一次心靈洗滌的旅行。

5. 體驗總結

1）學習成本

我的上手時間雖然挺短，但這取決於我過往的軟體經驗，如果對於一個新手設計師，需要一定的時間成本，不過總體而言，在已經集合了很多設計、插件資源的基礎上，相比過往的軟體學習，已經降低很多。

2）操作體驗

即時設計、Mastergo和Pixso的工作區和Sketch都很相似，所以操作體驗都不錯，只需要通過一兩個項目就能完全上手，而且在很多功能上結合國內用戶習慣在持續不斷優化創新，有過之而無不及。

3）設計資源

即時設計、Mastergo和Pixso都集合了大量的設計資源，比如無版權可商用的字體、圖片，還有各種傻瓜式的插件，這進一步降低了設計的難度，節省了時間成本。

4）軟體性能

因為是雲儲存的Saas在線模式操作，所以軟體的性能操作和本地部署的軟體相對較弱，需要保持網速穩定，其次更建議下載客戶端設計工作，特別是多人協作的模式。另外如果以後同時能支持離線軟體版本就更完美了。

通過短短的3天設計項目的上手實操，我感覺自己基本熟悉了在線協同軟體的操作習慣。總之，不管對於純新手學習還是像我這樣的從Sketch直接轉到國產設計軟體的設計師，我覺得只要稍微花一點心思就能即時上手。

五、用戶需求分析

1. 用戶為什麼需要國產設計軟體？

在過往，設計軟體幾乎都來自美國，如Adobe全家桶系列軟體、Sketch、Figma等。但隨著以開闢在線協同設計軟體的Figma封停了大疆賬號，引發了國內軟體圈「地震」以後，國內的企業和設計師才有危機意識。以主打雲儲存的Figma類型軟體不僅會導致正常工作中斷，也有可能竊取我們的設計資料和數據，所以設計軟體國產化是大勢所趨。

其次，設計師在使用Figma這樣的跨國雲儲存軟體時，經常面臨網速受限的難題，導致了協同效率極其低下。而Sketch這樣的本地部署軟體，又只支持IOS系統，這導致用戶使用成本高，極其不方便。這場設計師的軟體變革，勢在必行。

2. 用戶對設計軟體的真實需求？

1）用戶動機

設計軟體的發展起點是Adobe軟體旗下的Photoshop，在2010年移動互聯網時代開啟以後，Sketch彎道超車，以靈活、便捷的超高設計效率成為UI設計師的首選。但由於Sketch只支持IOS系統，這導致眾多設計師使用成本非常高，你得先購買一台價格不菲的蘋果電腦才可能使用Sketch。

所以在2016年Figma以顛覆式的創新誕生以後，作為一款不限系統，甚至支持瀏覽器就可以工作的設計軟體，贏得了粉絲們的追捧，也拉開了設計在線協同時代的大幕。

直到今年3月，Figma封停大疆事件爆發，讓國內企業和設計師才意識到，別人家的終究是別人家的，如果把所有的數據資料儲存在國外軟體伺服器，這是一件非常危險的事情。所以用戶渴望改變，也需要改變，其次這不僅僅是設計軟體的層面，而是一個國家、一個企業數據安全儲存的問題，動機非常強烈。

2）用戶需求

①設備需求

Figma不限系統、web端瀏覽器支持設計的模式把設計軟體對設備的需求降低到0，也讓用戶習慢慢了只要有一台電腦，一個熱點就可以隨時隨地設計。

②金錢需求

設計師對設計軟體的認知依舊停留在免費的時代，不管是正版軟體收費的Photoshop、Sketch還是部分免費的Figma，對軟體的使用付費持保留態度，購買慾望低。

③時間需求

對一個軟體技能的學習其實就是投入成本，學習的時間越長就越離不開這個軟體。所以想要讓用戶放棄Sketch、XD軟體重新學習一門新的UI設計軟體，這是一個用戶習慣的改變，學習時間越短越好。

④體驗需求

用戶對改變天生懼怕，所以當嘗試一個新的設計軟體時候，如果產品設計不符合自己多年習慣的軟體，心情會變得焦躁、不耐煩，很難堅持學習。

⑤功能需求

設計軟體就是設計師的工具，是設計師賴以生存、吃飯養家的寶刀，所以選擇一門新的設計軟體，這把寶刀就要能為設計師披荊斬棘，而不是為情懷買單。

⑥協作需求

當越來越多的企業、團隊接受All-in-one的產研協同理念以後，設計不再是一個單點的工作，而是一個產品設計的公交樞紐，對協作的便捷性、溝通效率、演示效果也會越來越高。

3. 國產設計軟體面臨的挑戰

1）看得見的對手

從軟體競品層面分析，國產設計軟體面臨的無非就是Figma、Sketch和AdobeXD這幾個美國軟體，國產設計軟體的起步較晚，雖然已漸漸成熟，但距離頂級的設計軟體還有一段距離，這可以歸納為軟體的穩定性、易用性、創新性三個方面。我在軟體的實操的過程中就深深感受到，設計軟體的不穩定性和不合理的設計帶來的焦躁和苦惱。

2）真正的對手

我認為，用戶習慣的改變才是國產設計軟體面臨真正的對手。這個時代太浮躁了，靜下心來學習可以說非常困難的事情，更何況讓用了十年、五年的設計師改變過去的軟體操作習慣來適應一個新的軟體，這是需要極大的決心才能做出的決定。

上癮模型的作者尼爾·法埃爾就曾經描述過關於用戶習慣改變面臨的困難——用戶總會儘力和過去的行為保持一致，哪怕是認知失調，狐狸就會認為吃不到的葡萄是酸的，這和我們的江山易改本性難移一個道理。

所以如何讓用戶能夠輕鬆上手、以最低的時間成本掌握設計軟體，讓用戶保持高頻、高投入的使用，才是國產設計軟體面臨的真正對手。

4. 小結

綜上所述，由於Figma封停大疆事件的爆發，國產設計軟體真正的春天已經來臨，不管是企業還是設計師，已經有了迫切改變的動機。而身後母公司均已打磨多年的即時設計、Mastergo和Pixso，也迎來非常利好的機會，所謂七年磨一劍，這正是實現國產設計軟體爆發的好時代。

六、總結思考

時代的車輪只會滾滾向前，如果不接受改變，就只能被淘汰。20世紀初電話最初剛發明的時候不受待見，英國佬嘲笑美國人——「美國人需要電話，但我們不需要，我們有足夠的信差」。

就連互聯網的誕生，其實也是備受質疑。當時有個美國專欄作家還特意為《新聞周刊》寫了一篇題為「互聯網？我呸！」的文章。

而如今，對我們已經習慣Figma、Sketch、AdobeXD等傳統設計軟體的老用戶來說，面對時代的拐點，如果只是固守自封，停滯不前，那麼我們像極了曾經嘲笑電話發明的英國佬。

所以，開始嘗試吧，朋友們，把設計軟體留在中國，讓Design In China成為民族驕傲！

本文由 @廖慶 Joseph 原創發佈於人人都是產品經理，未經許可，禁止轉載。

題圖來自 Unsplash，基於CC0協議。