提示庫提供了一系列可重複使用的提示模式和範例，適用於使用 Lumi AI 的常見開發情境。您可以將這些視為適用於您專案的範本。
啟動專案
使用時機： 在專案最開始時，幫助 AI 理解高層次需求並建立基礎。它扮演著您最初的專案簡報角色。
如何使用： 概述應用程式類型、關鍵技術（前端、後端、服務）和主要功能。指示 AI 從何處開始，通常是主頁或一個關鍵功能。
"I need a task management application with: - Tech Stack: Next.js frontend, Tailwind CSS for styling, Supabase for auth and database. - Core Features: Project and task creation, assigning tasks to users, due date reminders, and a dashboard overview. Start by building the main dashboard page, containing: - A header with navigation, - A list of projects with their status, - and a button to create a new project. Provide dummy data for now, and ensure the design is clean and responsive".
如何使用： 明確定義設計變更的範圍，並強調功能必須保持不變。引導 AI 達到期望的美學效果（例如，現代、簡約）。一次處理一個變更，並提及任何不應更改其邏輯的 UI 部分。
The app UI should be improved, without changing any functionality. - Keep all existing logic and state management as is. - Visual Enhancements: Update the styling of the dashboard page: use a modern card design for each project listing, improve the color scheme for better contrast, and increase padding for a cleaner layout. - Ensure these changes do not break any functionality or data flow. Goal: purely cosmetic improvements for a more polished look, with the app behaving exactly as before.
Our app needs to be fully responsive across mobile, tablet, and desktop. - Follow a mobile-first strategy: prioritize the layout for small screens, then adjust for larger screens. - Use modern UI/UX best practices for responsive design. (For Tailwind CSS, use the standard breakpoints sm, md, lg, xl – no custom breakpoints unless necessary.) - Ensure every page (especially the dashboard and project detail pages) reflows properly on a small screen: elements should stack or resize as needed, text should remain readable, and no content should overflow off-screen. - Do not change the core design or functionality, just make sure it flexibly adapts to different screen sizes. After making changes, please double-check the layout at iPhone 12 dimensions and a typical desktop width.
如何使用： 確定範圍（檔案、功能或整個程式碼庫）。對於特定檔案，提示：「重構此檔案以提高清晰度和效率，但不要改變其功能或輸出」。指定重點領域，如減少重複或簡化邏輯。對於較大的重構，請要求 AI 分步驟規劃或先審核程式碼。
Refactor the ProjectList component file, but keep its behaviour and UI exactly the same. Goals: - Improve the code structure and readability (simplify complex functions, break into smaller ones if needed). - Remove any unused variables or imports. - Ensure the file follows best practices and is well-documented. Do not introduce any new features or change how the component works for the user – this is purely a code cleanup for maintainability. If any part of the code is unclear, add a brief comment for clarification.
應用程式類型與功能
Lumi 可以協助處理各種應用程式類型和功能。範例包括：
E-commerce Store: Product listing, search, filtering, cart, checkout, user accounts.
CMS: Admin dashboard, content creation/editing/publishing, rich text, image uploads, SEO.
Project Management: Task boards, lists, cards, assignment, due dates, drag-and-drop.
Social Media Feed: Posts, comments, likes, sharing, user profiles, notifications, infinite scrolling.
Analytics Dashboard: Various chart types, data filtering, date range selection, exportable reports.
如何使用： 向 AI 索取計畫或檢查清單。例如，「為 X 概述一個逐步計畫」或「在編寫程式碼之前，列出您將為實作 Y 所採取的步驟」。這最好在「討論模式」中進行，以避免程式碼執行。
Before writing any code, plan out the implementation of the new Notifications feature. - List each step required to add email notifications when a task is overdue. - Consider both frontend (UI changes, if any) and backend (creating scheduled checks or triggers) aspects. - Ensure the plan keeps the current functionality stable – we can’t break anything existing. - Provide the plan as an ordered list (1, 2, 3, ...), with a brief explanation of each step. Once you outline the plan, pause for review. Do not make any code changes yet.". The AI might respond with a plan such as: 1. Add a timestamp field to tasks. 2. Create a server-side function to check for overdue tasks. 3. Integrate email sending. 4. Update the UI for notification toggles. 5. Test the flow.
