You are now offline.

設計師們的好夥伴即將誕生!Phase 打造革命性 UX 設計工具,改善 Figma、Wix 等平台致命缺點

feature picture
Phase提供
分享
收藏
已完成
已取消

隨著智慧型手機成為人們接收資訊的主要載具,為了讓大眾輕鬆閱讀,並對訊息留下深刻印象,「資訊視覺化」逐漸獲得重視。在 UX(User Experience)設計師和工程師的協作下,將複雜的資料轉變為簡單易懂的圖像、動畫、互動式網頁等溝通媒介,可以讓理性的內容變有趣,增加讀者的停留時間。

design infographics.jpg
shutterstock

現任 Adobe 產品長 Scott Belsky 曾表示,設計工具的創新可分為「協助溝通」與「協助創作」。目前在設計工具的優化上,除了大眾熟知的兩大新創 Figma 與 Canva 外,2018 年一支名為 Phase 的跨國團隊橫空出世,預計推出革命性的專業設計工具軟體,吸引全球設計團隊的關注。

根據 Phase 創辦人兼 CEO Nick Budden 統計,全球各地約有 900 百萬位設計師與 2100 萬位協作者,如前後端工程師,整體潛在市場(TAM)規模達 100 億美元之譜。如此龐大的市場,也促使 Phase 在產品計畫階段,就獲得了幾家 VC 的投資。

phase6.png
Phase 吸引了全球近 30,000 設計師,其中美國約占 30%、歐洲 40%。 Phase

規劃互動裝置困難重重,設計師與工程師的溝通成最大難關

設計師出身的 Nick 創業靈感來自其個人經驗,「由於現有工具的限制,UX 設計師們越來越難保持專注並享受設計的過程。」使用者介面的設計,由設計團隊從概念發想、設計草稿、繪製 Prototype(原型)到完成精稿後,為了測試網頁各按鈕是否皆可運行,需經歷一大段時間的代碼編寫,過程緩慢,若測試發現問題則須修改設計,重複執行此流程。

Phase Solution
Phase 將可讓原先 2-6 個月的設計周期縮短至幾個小時 Phase

「設計師和工程師的溝通是最大問題。」Nick 認為,許多前端工程師耗費大量精力處理網頁外觀,導致較少時間測試使用者的體驗過程,例如各網頁按鈕的連動邏輯是否順暢等。因此,若能開發出不需編寫代碼,即可演示網頁設計與互動裝置的工具,將可大幅提升團隊的工作效率。

Nick 指出,現行的線上軟體介面設計平台 Figma,雖然有別於傳統 Adobe「設計工具」必須在破碎的本機端運作,以所有電腦都可使用的網頁為共同介面,讓編輯、儲存、分享全部都發生在雲端,實現設計師與工程師的即時協作;但在互動按鈕的設計上卻極為麻煩、不便。

在 Figma 上,每設置一個按鈕,便需複製一次原先設計好的頁面,修改成按鈕按下後的樣貌,進而設定連結。「一個按鈕不要緊,可是如果你有好幾個互動裝置,那就得複製貼上好幾次,」Nick 以兩個互動裝置為例,設計師便須繪製出按鈕皆未按下的初始畫面、第一個按鈕按下後的互動頁面、第二個按鈕按下後的互動頁面、以及兩者皆按下的結果等共五個頁面。

figma.png
Figma 若要設計互動式按鈕,須同時複製多個頁面。 Figma

此外,Figma 和其他市面上的設計工具,目前仍無法直接產出網頁的完整編碼,當設計團隊全數測試完畢、定稿後,工程師仍須從零開始編寫網頁代碼。當網頁需要追加新功能、修改程式碼時,也缺乏版本控制系統紀錄各版本程式碼的差異。

Phase 開發數位設計工具,草稿設計、原型測試、程式碼輸出一次搞定

在使用過各種設計平台後,Nick 於 2018 年創立 Phase 台北分公司,決定打造一款數位設計工具,不需寫程式,即可創建出網站及應用程式的互動界面,讓專業 UX 設計師們可以盡情發揮創意,嘗試不同的響應式網頁佈局。「從草稿設計、高擬真互動,到測試 Prototype(原型)都可以一次在 Phase 上執行。」

如何透過 Phase 進行使用者介面設計

目前 Phase 已完成第一階段產品開發,主要針對互動式裝置進行優化,「設計師可以在不用編寫程式碼的情況下,快速設定各個按鈕的變化,」Nick 進一步說明,方法類似「動畫製作」,利用時間軸、影格,展示執行互動裝置前後的不同。此功能不僅方便設計師與工程師溝通效果,省去編碼時間,也可彈性調整設計。

Phase 成立至今,吸引了超過 28,000 名使用者註冊測試版工具,客群分布世界各地,其中約有美國約占 30%,歐洲則約 40%。 Nick 分享,接下來 Phase 將製作程式碼系統,讓用戶設計完 Prototype 後,可直接輸出程式碼;另外也會添加如 GitHub 的代碼協作功能,工程師、產品經理、行銷人員皆可共同對設計發表評論。

phase7.png
在 Phase v1.0 中,使用者可以靈活地設計互動裝置,並且直接展示;原先編碼需 30 分鐘,現在只需 15 秒。 Phase Facebook

Nick 表示,Phase 基礎設計功能將採免費制,若欲和其他用戶共同編輯則須進行付費,團隊也將藉此獲利。

環遊世界後選擇駐足台灣,成立台灣與德國分公司瞄準國際市場

Nick 幾年前曾到世界各地旅遊,台灣便是其中一站,「也是我唯一想長期居住的地方,所以就決定來台灣創辦公司。」團隊由 18 位來自台灣、美國、加拿大、烏克蘭等國家的人才組成。不過,考量到台灣設計市場不夠大,因此也同時於德國柏林成立分公司,台灣主要從事設計和研發、德國則是負責銷售與行銷工作。

phase8
Phace 創辦人兼 CEO Nick Budden 向設計師與投資商介紹產品 Phase Facebook

Phase 於舊金山發布投資消息,2019 年宣布完成 280 萬美元的種子輪融資,本階段投資方包括歐洲的 42Cap、Anchor Taiwan 和其他幾位天使投資人。加上本輪前一階段來自 Paua Ventures 和 123RF 的注資。

「第一階段優化互動式設計的產品,希望可以在 2021 年第三、第四季時發布,」Nick 說道,第二階段包含程式碼產出、協作功能等則預計於隔年春天推出。

phase
Phase Facebook

創業快問快答

Q:創業至今,做得最好的三件事為何?
A:I think we’ve been best at (a) comprehensive systems thinking, (b) analysis of long-term market behaviours, and (c) product vision.

Q:最常被客戶或投資人問起的事情?您會如何回應?
A:What they’re skeptical about is the execution. When we have the time for a good conversation, we typically answer this question by breaking down and explaining the different pieces of the problem. It’s a huge problem, but when we break it into smaller parts, and we explain in detail how we’ll solve each of these parts, it starts to look a lot less scary.

Q:要達到下一步目標,團隊目前缺乏的資源是?
A:We’ve recently raised investment from a number of globally top-tier investors from the US, from Europe, and Taiwan. We want to use this money to hire amazing people here in Taiwan. Graphics Engineers, QA Engineers, and full stack JavaScript engineers.

團隊資訊

公司名稱:德商飛思軟體有限公司 Phase Software GmbH
成立時間:2018/8/6
產品名稱:Phase
上線時間:2022/1/1
官方網站Facebook

延伸閱讀
本文作者 李宜恬 創業小聚特約編輯 李宜恬

「你必須要參與,最壞的年代才有可能變成最好的年代。」就讀政大新聞系,是個愛說話、喜歡胡思亂想的少女!

使用會員功能前,請先登入

  • 收藏文章
了解更多關於創業小聚的資訊,歡迎透過以下服務: