Figma Make，讓每個產品經理都是程序員！

就在最近，figma上線了一個新功能，以Claude4.0為基礎的figmamake正式上線了，這個功能的特點是產品經理與設計師不僅可以進行編輯頁面，同時還能夠更新代碼，不僅是做原型設計。

并且現在支持鏈接Superbase，直接鏈接數據庫，讓前后端可以進行交互，從而真的是一個APP產品了，也不是一個高保證原型設計了。

如下是我利用1小時左右，基于產品經理的基本功來完成生成的APP，包含了如下的功能。

這幾乎是產品經理春天，并且figma make是支持協作，讓設計師也可以團隊編輯，一遍生成的同時，一邊修改自己的產品邏輯。

不過現在figma make的功能目前是收費的，20美元，我也第一時間在體驗完5次之后，就充值成為付費用戶了，幾乎沒有報錯，相比于之前分享的onlook，figmamaker的產品還不是靜態頁面，還是包含了JS組件的，也就是基于react框架或VUE框架，可以生成的前端頁面，可以反復使用。

如下是有JS的前端頁面與靜態頁面的區別

Figma make不僅降低了開發成本，并且一個產品支持反復迭代，新增功能與做功能的增刪改查。

要注意的是，Figma make還可以允許產品經理與設計師制定相關開發規范，讓代碼可以有更高的復用性

以上就是figmamake的產品使用，我們就快速完成了這個APP如下

以上就是部分的功能，通過以上的頁面可以看到figmamake的能力，通過surpbase，還能夠鏈接數據庫，從而讓產品真的變成一個應用。

figma通過supabase之后，你就可以將應用發給你的用戶來真正使用了，就是有真正數據的，從而不用擔心是一個假的前端服務了。

選擇之后用戶就可以新建數據庫，從而讓數據可以存儲在數據庫中，當然這個數據庫是免費的，你在figmamake里面就可以直接選創建數據庫的密碼，你如果沒有賬戶，figma也會提示讓你創建賬戶

以上就是figmamake的產品界面，要注意在figmamake不僅是做UI設計到原型設計，而是的確將將研發速度提升了。因為從產品研發的角度來說，需求不清楚往往是最難得，而現在這個就可以快速提升從需求翻譯到原先設計，同時有了前端代碼與數據庫supabase，就可以完成一個真正的產品實現

并且figmamake為了解決幻覺問題，支持在生成好的前端頁面像素級的二次修改，允許用戶可以通過figma圖層編輯或者AI再次生成來完成。

在AI生成完成后，就可以直接調整對應的頁面內容，選擇其對應的不同部位就可以再次修改生成，從而快速完成二次編碼。

figma maker預示著前后端代碼全程零code 在今年就將實現

通過figmamake，產品經理真的開始實現成為程序員了，從原型設計到編碼再到數據庫， 是一個徹底的改變。

這就像產品經理使用原型模板一樣，效率不僅提升，從而降低了需求不清晰程度。

今天的分享就在這里

“關注我，一個產品經理的創業故事“

產品經理和設計師的Cursor學習課程：AI編碼工具使用與學習

最后，我帶著團隊使用的產品經理的“Cursor工具：Onlook”已經上線,我在業余時間開設了這套工具的課程，你可以報名7月31日開班的B端產品經理訓練營學習與獲得這個工具。

這款工具已經是我們團隊普遍使用的了，讓產品經理在不會代碼的情況下，完成移動端、網頁端、以及B端類的產品設計與前端編碼，從而大大減少自己的開發成本，讓你成為一個產品經理的前端開發專家。

下面這個網頁是是利用這款產品經理的Cursor工具實現的，你只需要懂產品經理的技能，就可生成。

課程訓練營介紹

7月31日開班，29期B端AI產品經理訓練營

AI B端產品經理訓練營課程表

報名咨詢課程助理