国外亚洲成av人片在线观看,热99re久久精品这里都是精品,天堂网在线最新版www,国产成人av区一区二区三,51久久成人国产精品麻豆

在 AI 助力工作流革新的背景下，一款代碼工具逐漸成為非技術(shù)人員高效表達(dá)想法的新選擇。它能實(shí)現(xiàn)指令到可交互網(wǎng)頁(yè) demo 的快速轉(zhuǎn)化，還支持設(shè)計(jì)稿與代碼的雙向轉(zhuǎn)換，為產(chǎn)品、設(shè)計(jì)等崗位降低溝通成本，但也存在適用場(chǎng)景局限與協(xié)作復(fù)用等問(wèn)題，這份指南便聚焦其基礎(chǔ)使用與實(shí)操技巧。

0.寫(xiě)在前面

本簡(jiǎn)易指南面向產(chǎn)品、設(shè)計(jì)、運(yùn)營(yíng)等非技術(shù)人員，了解cursor的基礎(chǔ)使用，實(shí)現(xiàn)“輸入指令，輸出可交互的網(wǎng)頁(yè)demo”，用于快速表述、迭代想法，降低溝通成本。之所以是簡(jiǎn)易指南，是因?yàn)樾g(shù)的事情模型比我更懂，比如如何把代碼發(fā)到git、如何部署買(mǎi)域名等，所以不贅述。

能解決：

• 代替紙筆/axure，不用糾結(jié)一個(gè)事情到底用什么交互做，省腦子。
• 產(chǎn)出物可直接交互，更快迭代想法——實(shí)際頁(yè)面點(diǎn)起來(lái)才有更直接的體感這是不是我要的。
• 設(shè)計(jì)稿與代碼文件的相互轉(zhuǎn)化，設(shè)計(jì)稿可以轉(zhuǎn)代碼，代碼產(chǎn)出的頁(yè)面也能轉(zhuǎn)回figma。

不解決：

• 簡(jiǎn)單場(chǎng)景。幾句話(huà)能說(shuō)明白的事/固定組件的堆砌，無(wú)需使用。
• 設(shè)計(jì)規(guī)范。企業(yè)使用場(chǎng)景下的組件庫(kù)、設(shè)計(jì)風(fēng)格，這部分暫時(shí)還沒(méi)探索能否讓AI給出符合規(guī)范的輸出。
• 80分以上的設(shè)計(jì)。如果你讓AI和你聊你很擅長(zhǎng)的事，你會(huì)發(fā)現(xiàn)他有時(shí)也沒(méi)那么懂。設(shè)計(jì)也同理。
• 開(kāi)發(fā)協(xié)作。做demo的代碼對(duì)實(shí)際開(kāi)發(fā)的復(fù)用價(jià)值存疑，新產(chǎn)品可能大一點(diǎn)。

1.上手

上路離精通就不遠(yuǎn)了。

1.下載

cursor.com

2.搞定會(huì)員

20刀/月，有海外信用卡的可以直接充，沒(méi)有的可以用Bewildcard（已失效）的服務(wù)，或其他TB服務(wù)。還有一些奇技淫巧，通過(guò)不斷注冊(cè)新賬號(hào)達(dá)到永久白嫖的效果（設(shè)備可能會(huì)被封）。

另外cursor新用戶(hù)有一定的體驗(yàn)次數(shù)，可以先體驗(yàn)。

字節(jié)的trae可以免費(fèi)用Claude3.7，但是工程上的設(shè)計(jì)還不夠好，導(dǎo)致模型體現(xiàn)出來(lái)的智能不高，會(huì)頻繁寫(xiě)bug，浪費(fèi)很多時(shí)間。所以?xún)?yōu)先推薦cursor。

3.新建文件夾

代碼需要存在文件夾里。新建完文件夾，一個(gè)項(xiàng)目就開(kāi)始了一半。

4.打開(kāi)設(shè)置，設(shè)置下全局規(guī)則

設(shè)置下user rules，這里可以根據(jù)用的過(guò)程中的體感靈活調(diào)整。網(wǎng)上有很多模板，我自己體驗(yàn)比較重要的就是寫(xiě)好注釋。

5.打開(kāi)側(cè)邊欄，開(kāi)始指揮

使用command+I開(kāi)啟側(cè)邊控制欄，調(diào)整為agent模式，并開(kāi)始給AI下指令（注意強(qiáng)調(diào)下做純前端演示項(xiàng)目），并讓他幫助你在本地預(yù)覽項(xiàng)目。怎么把代碼用瀏覽器打開(kāi)（俗稱(chēng)本地預(yù)覽）這種事情，直接問(wèn)AI即可，這里不贅述。

2.溝通協(xié)作技巧（遺址）

0701更新 在今天，其實(shí)并沒(méi)有太多講究了，直接打開(kāi)就能自然用起來(lái)。

一點(diǎn)樸素的經(jīng)驗(yàn)，花一些時(shí)間踩坑后你也會(huì)理解。少讓他自己發(fā)揮

和前面說(shuō)的告知AI這是個(gè)純前端演示項(xiàng)目一樣，更多的上下文可以帶來(lái)更好的效果，避免AI完美主義天性犯了想給你交付大而全的作業(yè)，發(fā)揮一堆亂七八糟的東西。

保持代碼里沒(méi)有太多亂七八糟的東西比較重要，因?yàn)锳I上下文窗口有限。上下文不夠的痛

0620更新 Claude sonnet 4重新成為了最好的選擇

0411更新 gemini-2.5-pro模型有百萬(wàn)級(jí)的上下文窗口，實(shí)測(cè)下來(lái)長(zhǎng)文檔編輯時(shí)好用很多。

AI的工作記憶有限，并且對(duì)模式的理解還不夠強(qiáng)（或者說(shuō)長(zhǎng)期記憶模塊很難設(shè)計(jì)），所以并不像大家身邊研發(fā)同事一樣靠譜，你一句話(huà)就知道要改哪個(gè)模塊大概咋改。

要增強(qiáng)其表現(xiàn)，可靈活使用“@”功能，艾特某段具體的代碼，艾特你的終端的運(yùn)行日志。前期你可能搞不清楚每個(gè)代碼文件具體是干啥的，可以用command+f搜索頁(yè)面里的中文，大概就知道這段代碼對(duì)應(yīng)哪里的內(nèi)容了。平衡具體與模糊

因?yàn)闆](méi)辦法指著屏幕說(shuō)“改這里”，所以指令最好具體到某個(gè)頁(yè)面的某個(gè)模塊。同時(shí)，如果要做比較精細(xì)的調(diào)整，比如增加一兩個(gè)配置項(xiàng)，最好明確說(shuō)出要加啥配置。

另一方面，如果現(xiàn)在只有想解決的問(wèn)題，沒(méi)有想好的解決方案，指令就可以抽象一些。比如這個(gè)模塊用來(lái)告訴用戶(hù)XXX，希望表現(xiàn)XXX，需要配置XXX。監(jiān)控它做了啥

某近期的版本開(kāi)始，agent模式下可以開(kāi)啟yolo模式，即讓cursor自動(dòng)執(zhí)行控制臺(tái)的指令，無(wú)需一步步手動(dòng)確認(rèn)。這當(dāng)然很好，但因?yàn)檎Z(yǔ)言的局限性+長(zhǎng)期記憶的缺失，AI理解錯(cuò)你的需求還是很容易發(fā)生的。如果你發(fā)現(xiàn)他完全誤解了你的需求，比如刪除了一個(gè)文件里其他模塊的歷史代碼，或交付了一個(gè)莫名其妙的東西，可以果斷回退版本。多回退，大方向錯(cuò)了回退比修復(fù)好

cursor提供了比較很細(xì)致的checkpoint，他的每一步操作都可以回退，當(dāng)然，從B回退到A后，就不能再回退回B了。

如果大方向錯(cuò)了，推薦回退而不是修復(fù)。修復(fù)一個(gè)大方向的問(wèn)題往往會(huì)帶來(lái)更多的冗余代碼，這會(huì)讓項(xiàng)目后期越來(lái)越難改，所以不如重新開(kāi)始。先ask，再agent

在同個(gè)工作窗口下，模型會(huì)保持連續(xù)的上下文，所以不妨先使用ask模式把問(wèn)題和思路討論清楚，再切換到agent模式開(kāi)始執(zhí)行。避免在溝通清楚前直接開(kāi)干，然后堆積更多冗余代碼。開(kāi)啟新的會(huì)話(huà)窗口

這依然在講工作記憶與長(zhǎng)期記憶的問(wèn)題，不同領(lǐng)域的AI會(huì)有不同的解決方案，比如陪伴類(lèi)的EVE的做法是準(zhǔn)備了108個(gè)記憶槽位，把他和你關(guān)鍵的交互記錄下來(lái)，以模仿長(zhǎng)期懂你的效果。cursor和kimi一樣，也有自己的短期工作記憶窗口，如果你需要加一個(gè)和之前的模塊不相關(guān)的feature，可以適當(dāng)開(kāi)新的窗口，釋放注意力資源。常用配置模式與模型選擇

買(mǎi)新不買(mǎi)舊。Claude sonnet 4（thinking）作為主力模型，Gemini 2.5作為備用模型。Cursor rules

Cursor提供兩種粒度的rules。

全局規(guī)則對(duì)所有項(xiàng)目生效，適合放一些通用信息，如告訴他我不懂技術(shù)，如讓他永遠(yuǎn)用中文回復(fù)。

項(xiàng)目規(guī)則則僅對(duì)某個(gè)項(xiàng)目生效，可以放這個(gè)項(xiàng)目的介紹、設(shè)計(jì)風(fēng)格要求等信息。在最新版本的cursor中，已經(jīng)支持了通過(guò)/generate cursor rules指令讓AI自動(dòng)總結(jié)生成規(guī)則。這里的難點(diǎn)是，只有你足夠了解一個(gè)事情，才能寫(xiě)出足夠好的cursor rules，需要在磨合中不斷調(diào)整。與figma協(xié)作思路一 用代碼寫(xiě)頁(yè)面，并轉(zhuǎn)回figma

這是更低一層的解決方案，對(duì)智能的要求更低。

雖然cursor支持圖像識(shí)別，但截一張圖并告訴它“照著做”的效果并不會(huì)很好，因?yàn)槟Ｐ偷囊曈X(jué)能力還不足以支持復(fù)雜頁(yè)面截圖的復(fù)刻。而figma通過(guò)mcp開(kāi)放出來(lái)的能力會(huì)提供更多關(guān)于布局、配色等設(shè)計(jì)信息，可以有效提高模型實(shí)現(xiàn)設(shè)計(jì)稿的準(zhǔn)度?！镜行┬畔⒉粫?huì)傳遞，比如組件高度是多少px，所以最終效果還是有誤差】在cursor中添加figma MCP

1.打開(kāi)設(shè)置-MCP-添加按鈕

2.復(fù)制如下內(nèi)容進(jìn)去。

mac復(fù)制這段

{ ?“mcpServers”: {

“Framelink Figma MCP”: {

“command”: “npx”,

“args”: [“-y”, “figma-developer-mcp”,

“–figma-api-key=YOUR-KEY”, “–stdio”]

}

}}

Windows復(fù)制這段

{

“mcpServers”: {

“Framelink Figma MCP”: {

“command”: “cmd”,

“args”: [“/c”, “npx”,

“-y”,

“figma-developer-mcp”,

“–figma-api-key=YOUR-KEY”,

“–stdio”]

}

}}

3.打開(kāi)figma首頁(yè)-設(shè)置-安全，創(chuàng)建個(gè)人訪(fǎng)問(wèn)令牌。創(chuàng)建后，復(fù)制令牌并替換上面文件中的“YOUR-KEY”。

4.在figma右鍵需要AI關(guān)注的組件-復(fù)制為鏈接（不是整個(gè)設(shè)計(jì)稿鏈接），然后在對(duì)話(huà)時(shí)附加即可。如果出現(xiàn)“無(wú)法使用MCP”的反饋，可以檢查下當(dāng)前是不是打開(kāi)了agent模式+使用的Claude模型。

MCP本質(zhì)上還是給大模型提供了額外的一段信息輸入，但只要是信息傳遞，就依舊會(huì)有損耗，所以復(fù)雜任務(wù)無(wú)法100%還原。圖片+MCP一起可以改善效果。使用v0

另外一種方式是交給第三方。https://v0.dev在還原截圖/設(shè)計(jì)稿上下了功夫。下圖左為還原效果，右為上傳的原始圖片。顯然沒(méi)那么還原，但起碼布局沒(méi)缺胳膊少腿。v0也支持在授權(quán)figma賬號(hào)，并直接選擇某個(gè)具體的設(shè)計(jì)頁(yè)面。具體用哪種方案更優(yōu)可以在具體場(chǎng)景下多測(cè)試一下，變化很快，這就不寫(xiě)推薦方案了。

生成基礎(chǔ)的框架后，可以把代碼保存下來(lái)，繼續(xù)在cursor做后續(xù)迭代。把頁(yè)面轉(zhuǎn)回設(shè)計(jì)稿

如果做了幾個(gè)版本后，需要做一些比較輕的調(diào)整，比如改改文案等，可以使用工具將頁(yè)面轉(zhuǎn)成設(shè)計(jì)稿，回到figma維護(hù)。蘋(píng)果官網(wǎng)還原效果如圖。

工具用這個(gè)，可以以無(wú)損的還原率，把html轉(zhuǎn)成帶圖層的figma設(shè)計(jì)稿：https://chromewebstore.google.com/detail/htmltodesign/ldnheaepmnmbjjjahokphckbpgciiaed思路二 直接讓cursor操控figma

這是另一種選擇。但在智能溢出前，更上一層的包裝，一定不如操作最原子的事物準(zhǔn)確度與效率高。使用talktofigma插件

目前看本方案還不成熟，不做推薦。如圖，產(chǎn)出一個(gè)如下圖的不完整的figma文件，需要調(diào)用數(shù)十次工具，耗時(shí)五分鐘起，且產(chǎn)出非常不盡如人意。

https://github.com/sonnylazuardi/cursor-talk-to-figma-mcp寫(xiě)在后面（懶得分類(lèi)的內(nèi)容）別著相

產(chǎn)品最重要的職責(zé)依然是決策，做什么怎么做。所以散步發(fā)呆思考做用研的時(shí)間依然重要。

且Build門(mén)檻越來(lái)越低，也意味著Sell會(huì)越來(lái)越重要。一位因營(yíng)銷(xiāo)弱雞自己產(chǎn)品半死不活的產(chǎn)品經(jīng)理如是說(shuō)。依然是文檔民工

做設(shè)計(jì)一時(shí)爽，寫(xiě)需求火葬場(chǎng)。目前沒(méi)有找到寫(xiě)產(chǎn)品文檔的捷徑，你依然需要自己拆解理想和現(xiàn)實(shí)之間的差距、組織語(yǔ)言表達(dá)、埋頭寫(xiě)文檔、挨噴。

當(dāng)然，好的一面是這也意味著大家短期內(nèi)不會(huì)下崗。