myaidev-method 0.2.12 → 0.2.15

package/src/templates/gemini/commands/myai-generate-visual.md

@@ -0,0 +1,200 @@
+---
+name: myai-generate-visual
+description: Generate images or videos for content using AI
+platforms: gemini-cli
+---
+
+# Generate Visual Content (Gemini CLI)
+
+Generate images or videos using AI generation APIs via Node.js script execution.
+
+## Usage
+
+```bash
+myai-generate-visual "prompt" [--type=TYPE] [--service=SERVICE] [--size=SIZE] [--quality=QUALITY]
+```
+
+## Execute via Node.js
+
+Since Gemini CLI works with Node.js scripts, run the generation script directly:
+
+```bash
+node node_modules/myaidev-method/src/scripts/generate-visual-cli.js "Modern developer workspace" --type=hero --service=gemini
+```
+
+Or add to your `package.json` scripts:
+
+```json
+{
+  "scripts": {
+    "generate-visual": "node node_modules/myaidev-method/src/scripts/generate-visual-cli.js"
+  }
+}
+```
+
+Then use:
+
+```bash
+npm run generate-visual "Your prompt here" -- --type=hero --service=gemini
+```
+
+## Options
+
+- `--type=<type>` - Content type: hero, illustration, diagram, screenshot, video (default: hero)
+- `--service=<service>` - Service: gemini, imagen, dalle, veo (default: auto-select)
+- `--size=<size>` - Image size: 1024x1024, 1792x1024, 1024x1792 (default: 1024x1024)
+- `--quality=<quality>` - Quality: standard, hd (default: standard)
+- `--description=<desc>` - Filename description (default: derived from prompt)
+
+## Prerequisites
+
+1. **Install MyAIDev Method**:
+   ```bash
+   npm install myaidev-method
+   ```
+
+2. **Configure API Keys**:
+
+   Option A: Use configuration script
+   ```bash
+   node node_modules/myaidev-method/src/scripts/configure-visual-apis.js
+   ```
+
+   Option B: Manual `.env` setup
+   ```bash
+   # Create/edit .env file
+   GOOGLE_API_KEY=your_google_api_key_here
+   OPENAI_API_KEY=your_openai_api_key_here
+   ```
+
+3. **Get API Keys**:
+   - **Google AI**: https://ai.google.dev/
+   - **OpenAI**: https://platform.openai.com/api-keys
+
+## Examples
+
+### Generate Hero Image
+```bash
+npm run generate-visual "Modern AI development workspace" -- --type=hero
+```
+
+### Generate Diagram with Gemini
+```bash
+npm run generate-visual "Microservices architecture diagram" -- --type=diagram --service=gemini
+```
+
+### Generate High-Quality Illustration
+```bash
+npm run generate-visual "AI brain network visualization" -- --type=illustration --service=dalle --quality=hd
+```
+
+### Generate Video
+```bash
+npm run generate-visual "Product demo: user authentication flow" -- --type=video --service=veo
+```
+
+## Available Services
+
+| Service | Speed | Cost | Quality | Best For |
+|---------|-------|------|---------|----------|
+| Gemini Flash | ⚡⚡⚡ | $0.02 | Good | Quick images, high volume |
+| Imagen 3 | ⚡⚡ | $0.03 | Excellent | Premium quality, photorealistic |
+| DALL-E 3 | ⚡⚡ | $0.04-0.12 | Excellent | Creative illustrations |
+| Veo 2 | ⚡ | $0.10 (est.) | Good | Video generation |
+
+## Output
+
+The script outputs generated files to:
+
+```
+content-assets/
+├── images/
+│   └── 2025-11-19/
+│       └── hero-developer-workspace-123456.png
+└── videos/
+    └── 2025-11-19/
+        └── video-product-demo-456789.mp4
+```
+
+And provides markdown reference:
+
+```markdown
+![Modern developer workspace](./content-assets/images/2025-11-19/hero-developer-workspace-123456.png)
+```
+
+## Budget Management
+
+Configure budget limits in `.env`:
+
+```bash
+VISUAL_DAILY_BUDGET=5.00
+VISUAL_MONTHLY_BUDGET=50.00
+VISUAL_WARN_THRESHOLD=0.80
+```
+
+The script will:
+- Show cost estimate before generating
+- Warn when approaching budget limits
+- Prevent exceeding configured budgets
+
+## Error Handling
+
+### No API Keys
+```
+⚠️ Visual content generation not configured
+
+Add to .env file:
+GOOGLE_API_KEY=your_key_here
+OPENAI_API_KEY=your_key_here
+```
+
+### Budget Exceeded
+```
+⚠️ Daily budget limit reached ($5.00)
+Options:
+1. Increase VISUAL_DAILY_BUDGET in .env
+2. Wait until tomorrow
+```
+
+## Integration with Gemini CLI
+
+The visual generation works seamlessly with Gemini CLI by:
+
+1. Using Node.js scripts for generation
+2. Storing outputs in standard locations
+3. Providing markdown references for easy embedding
+4. Managing budgets and costs automatically
+
+## Programmatic Usage
+
+You can also use the utilities directly in your own scripts:
+
+```javascript
+import { generateImage } from 'myaidev-method/src/lib/visual-generation-utils.js';
+import { saveImage, generateMarkdownReference } from 'myaidev-method/src/lib/asset-management.js';
+
+// Generate image
+const result = await generateImage("Modern workspace", {
+  preferredService: 'gemini',
+  type: 'hero'
+});
+
+// Save to assets
+const saved = await saveImage(result.buffer, {
+  type: 'hero',
+  description: 'workspace',
+  service: result.service,
+  cost: result.cost,
+  prompt: result.prompt
+});
+
+// Get markdown
+const markdown = generateMarkdownReference(saved.relativePath, 'Modern workspace');
+console.log(markdown);
+```
+
+## See Also
+
+- [VISUAL_CONTENT_GENERATION_GUIDE.md](../../../VISUAL_CONTENT_GENERATION_GUIDE.md) - Complete guide
+- [CONTENT_CREATION_GUIDE.md](../../../CONTENT_CREATION_GUIDE.md) - Content workflow
+- [package.json scripts](../../../package.json) - npm script examples