pxCode加速RWD網頁開發時程 前進美國市場搶攻全球商機
- 鄭宇渟／台北
-
pxCode除了能像WordPress這樣的No Code網頁開發工具，大幅降低學習門檻，不必辛苦學習編程切版，主要還能匯出高品質響應式的程式碼，以利不同客製化需求的開發整合，具備大幅降低開發成本與時間等優點。只是隨著各種行動裝置日益普及，傳統網站架構必須透過專業工程師協助轉向響應式網頁（ Responsive Web Design；RWD），才能在各個不同尺寸裝置上完整呈現網頁內容，也造成開發工程師的極大工作負擔。
pxCode創辦人張鑑泉表示，傳統網站要轉向RWD響應式網頁，專業工程師需將原本網頁切割成多個元素、寫程式再重新編排，整個流程非常複雜且繁瑣。特別是用No Code/Low Code工具製作的網頁，背後通常存在大量無意義的程式碼，對程式開發設計師是一大負擔。目前市面上雖有不少業者推出可自動將設計稿轉程式碼（design to code）的方案，不過實用性有待提升。
自動化完成複雜切版工作 提高工作效率達20倍
擁有豐富網站開發經驗的張鑑泉決定攜手夥伴，在2023年創立pxCode ，提供一套自動化轉換工具，能協助產出高品質的響應式網頁程式碼，藉此消除繁瑣的逐行編碼和不斷對照設計進行核對的需要，使開發者更加滿意，進而提高開發應用的速度。pxCode方案可自動化約80%的編碼工作，讓開發者易讀、易改、易整合，能夠專注於核心業務邏輯、用戶互動和更吸引人的開發。整體工作效率提升至少20倍以上，目前全球註冊用戶已超過20萬。
張鑑泉指出，傳統透過網頁工程師，人工手刻出設計稿成程式碼，除耗費工程師大量時間之外，且在手動編碼過程中容易出錯，常常導致看似微小但對品牌形象有重大影響的差異。採用AI與人工編輯混合式技術的pxCode最大的特色之一，在於具備高準確性，可以在減少手動干預的情況下，幫助保持對原始網頁設計的忠實度，並產出100% 正確的HTML結構。其次，pxCode更提供一個協同合作環境，促進設計師和開發者之間更順暢的工作流程，提高專案執行項目效率。最後則是可將設計稿直接匯入，例如若工程師直接將 Figma 導入pxCode，用戶可以依據原始的視覺設計，在pxCode中重新構建出理想的HTML結構。
舉例而言，工程師在操作介面中僅需點擊一下，即可預覽不同瀏覽器、不同尺寸的結果，並且可以直接分享連結與他人即時討論及修改，提高專案工作效率。
速度、品質受肯定 進軍國際市場最大利器
以美國紐約知名網頁設計開發公司為例，過往前端工程師在每個網頁切版都得耗費1-2天，以一個30頁左右的專案為例，光是前期切版工作就得耗費1~2月時間。該公司改用pxCode之後，單一位工程師大約僅花費2周時間就完成3個專案、超過100頁的網頁切板工作，能有效降低公司整體營運成本支出，也提高前端工程師的工作效率。
儘管pxCode的工具已有不錯的成效，但現有網頁程式碼命名品質仍有優化空間。因此，藉由參與亞灣新創園高雄AWS聯合創新中心，導入Amazon Web Services（AWS）的生成式AI技術資源。目前已開始採用AWS的生成式AI基礎模型託管服務Amazon Bedrock 的 Claude 3.5 Sonnet大型語言模型，進行程式碼命名品質優化，以及將原始圖檔及中繼資料轉為程式碼的功能開發，在生成程式碼方面，目前初步最高準確率可達80％，結合css命名等功能。未來經過校準之後，將會在下一版產品中開放給用戶使用。
張鑑泉表示，目前市場上有兩家海外公司也提供類似的工具與服務，但根據客戶反饋，在開發速度、程式碼品質方面，pxCode略勝一籌。2024年我們開始耕耘美國市場、全力推展當地業務，也希望結合AWS聯合創新中心計畫資源，進一步提升產品競爭力，進而擴大在國際市場的佔有率。
