完整教學：在 16 分鐘內使用 Claude 程式碼和 Pencil 建立漂亮的行動應用程式

In This Article

親愛的訂閱者，今天，我想向您展示如何建立一個漂亮的行動應用程式來追蹤您的鍛鍊情況。建立行動應用程式過去需要一個工程師團隊。但是，即使您不知道如何編碼，Claude Code 和 Pencil 等 AI 工具也可以讓您輕鬆地自行發布漂亮的應用程式。觀看我的教程，了解如何在短短 16 分鐘內完成此操作。時間戳：(0:00) 我們將建立的內容：一個漂亮的行動應用程式來追蹤您的鍛鍊(2:01) 步驟 1：與 Claude 一起定義需求(6:11) 步驟 2：使用 Pencil 創建設計(8:56)第 3 步：使用 Claude Code 建置應用程式（14:21）上觀看或閱讀下面的書面指南。我很榮幸能與...Granola 合作Granola 剛剛推出了 Spaces — 一種供您的團隊組織和相互共享會議記錄的新方式。例如，您可以在訪談中建立一個「使用者通話」空間，讓任何人詢問有關使用者需求的問題。您甚至可以使用 Granola 的新 API 和 MCP 直接在 Claude、ChatGPT 或 Gemini 中提問。免費試用格蘭諾拉麥片我們將構建什麼：一款用於跟踪您的鍛煉的移動應用程序我們生活在這樣一個時代，編寫自己的移動應用程序比找到您喜歡的現有應用程序更容易。因此，讓我們建立一個應用程序，它可以：透過選擇一項練習，然後選擇組數和次數來創建鍛鍊。透過點擊每個練習組來完成它來即時追蹤鍛鍊。透過日曆和圖表衡量每個練習的進度。我將引導您透過以下 3 個步驟建立它。 1.與 Claude 一起定義需求 在一起定義需求時，始終讓 Claude 問你問題讓我們先將此提示貼到 Claude 中：讓我們共同研究行動健身應用程式的需求。我想要三個螢幕：添加/編輯鍛煉：創建鍛煉並添加包含組數和重複次數的鍛煉鍛煉會話：實時跟踪鍛煉，點擊以完成組數日曆：查看您鍛煉的日期並查看鍛煉詳細信息這是基礎知識，但讓我們一起研究規範。我希望您對要求保持清晰，如果您有任何問題，請在編號清單中提問。此提示中最重要的部分是「如果您有任何問題，請在編號清單中提問」。在與 Claude 討論需求時，我總是包含這一行，以便它可以向我提出問題以使規範變得更好。以下是一些問題和答案範例：克勞德：您想要休息計時器嗎？我：是的，也讓我在設定中自訂它。 克勞德：你想在失敗的組別後自動解載嗎？我：不，我們就簡單點吧。當Claude把規範弄到你滿意的狀態後，要求它：「把規格分成設計和技術要求。設計要求不要太詳細，這樣才有彈性的空間。」包括最後一行是因為 Pencil（我們的 AI 設計師）比 Claude 更擅長設計。 🙂接下來讓我們討論這個問題。隨著模型變得更好，我的提示變得越來越懶（拼字也越來越差）2。使用 Pencil 設計移動螢幕Pencil 根據我們的要求從頭開始創建了 8 個漂亮的螢幕這就是奇蹟發生的地方。以下是如何使用 Pencil 創建精美的移動螢幕而不是 AI slop： 了解更多

You May Also Like

13 Trending Songs on TikTok in March 2026 (+ How to Use Them)

Our Best AI PM Workflows for Prototyping, Strategy, and Personal OS (2026)

China’s Cybersecurity Agency Issues Security Warning About OpenClaw