高效提示技巧

本指南介紹如何撰寫有效的提示詞，用 Stitch 設計和打磨你的應用程式。

開始你的專案

你可以從廣泛的概念開始，也可以從具體的細節開始。對於複雜的應用程式，先從高層概念入手，然後逐個畫面深入細節。

高層提示詞 vs 詳細提示詞

先從一個大致想法開始。

描述核心功能，獲得更好的起點。

用形容詞定調

用形容詞定義應用程式的感覺（影響顏色、字型、圖像）。

逐個畫面疊代打磨你的應用程式

用具體、漸進式的改動來打磨

Stitch 在清晰、具體的指令下表現最好。一次聚焦一個畫面／元件，每條提示詞只做一到兩處調整。

• 要具體： 告訴 Stitch 改什麼、怎麼改。

針對具體元素

針對具體畫面

具體的視覺改動

參考品牌主題

把登入畫面的主行動按鈕改大，並使用品牌的主藍色。

• 聚焦具體畫面／功能：
  • 電商詳情頁： “Product detail page for a Japandi-styled tea store. Sells herbal teas, ceramics. Neutral, minimal colors, black buttons. Soft, elegant font.”
  • 電商詳情頁： “Product detail page for Japanese workwear-inspired men’s athletic apparel. Dark, minimal design, dark blue primary color. Minimal clothing pictures, natural fabrics, not gaudy.”

描述期望的圖像

引導圖像的風格或內容。

• 具體的圖像風格： “Music player page for ‘Suburban Legends.’ Album art is a macro, zoomed-in photo of ocean water. Page background/imagery should reflect this.”

控制應用程式主題

顏色

可以指定具體顏色，也可以描述配色方案的氛圍。

• 指定顏色的提示詞： "Change primary color to forest green."
• 描述氛圍的提示詞： "Update theme to a warm, inviting color palette."

字型與邊框

修改排版和元素樣式（按鈕、容器）。

• 字型樣式提示詞： "Use a playful sans-serif font." 或 "Change headings to a serif font."
• 邊框／按鈕樣式提示詞： "Make all buttons have fully rounded corners." 或 "Give input fields a 2px solid black border."

如何修改設計中的圖像

修改圖像時要具體

明確要修改的圖像。使用應用程式內容中的描述性詞彙。

• 針對一般圖像： "Change background of [all] [product] images on [landing page] to light taupe."
• 針對特定圖像：

定義位置

描述要針對的內容

指令

在 “Team” 頁面，針對 “Dr. Carter (Lead Dentist)” 的圖像：把她的白袍改成黑色。

圖像與主題改動保持協調

如果更新主題顏色，要說明圖像是否也應隨之變化。

• 提示詞： "Update theme to light orange. Ensure all images and illustrative icons match this new color scheme."

更改應用程式文字的語言

使用以下提示詞：

• 提示詞： "Switch all product copy and button text to Spanish."

Stitch 專業技巧

• 清晰簡潔： 避免歧義。
• 疊代與實驗： 用更多提示詞打磨設計。
• 一次一處大改動： 更容易看清影響並調整。
• 使用 UI/UX 關鍵字：（例如 “navigation bar”（導覽列）、“call-to-action button”（行動按鈕）、“card layout”（卡片版面））。
• 精確引用元素：（例如 “primary button on sign-up form”（註冊表單的主按鈕）、“image in hero section”（hero 區域的圖像））。
• 審視與修正： 如果改動不對，換個說法或更有針對性。