42 lines
1.7 KiB
Markdown
42 lines
1.7 KiB
Markdown
# Example: Prompt Enhancement
|
|
|
|
## User Input (Vague)
|
|
> "Make a landing page for my fitness app called 'Pulse'. It should have a
|
|
> place for features and a hero section."
|
|
|
|
---
|
|
|
|
## Enhanced Prompt (Stitch-Optimized)
|
|
|
|
> [!NOTE]
|
|
> This prompt contains NO colors, fonts, or theme instructions — those are
|
|
> handled by the project's design system. The prompt focuses exclusively on
|
|
> layout, structure, and content.
|
|
|
|
**Overall Purpose**: A high-energy, modern landing page for 'Pulse', a fitness
|
|
tracking application. The page should feel powerful, motivating, and
|
|
high-performance.
|
|
|
|
**PLATFORM:** Web, Desktop-first
|
|
|
|
**PAGE STRUCTURE:**
|
|
1. **Header**: Minimalist navigation with Pulse logo (left) and "Start Training"
|
|
primary call-to-action button (right).
|
|
2. **Hero Section**: Large, emotive fitness photography background. Headline:
|
|
"Elevate Every Beat." Sub-headline: "Track, analyze, and crush your fitness
|
|
goals with Pulse." Primary CTA button: "Get Started".
|
|
3. **Feature Grid**: Three-column responsive card grid highlighting:
|
|
- **Real-time Tracking**: Live stats from your wearable.
|
|
- **AI Coaching**: Personalized workouts based on your performance.
|
|
- **Community Challenges**: Compete with friends and stay motivated.
|
|
4. **Social Proof Section**: Horizontal slider showing "Trusted by 500,000+
|
|
athletes" with partner logos.
|
|
5. **Footer**: Quick links (Training, Pricing, Support), social icons, and
|
|
legal text.
|
|
|
|
---
|
|
💡 **Tip**: Notice how the enhanced prompt describes **structure and content**
|
|
without specifying hex codes, font families, or color roles. The design system
|
|
(created via the manage-design-system skill) handles all visual theming at the project
|
|
level.
|