webdev-image-generation

Generates and edits images in Manus webdev and Expo projects via the internal ImageService helper.

Updated Sep 16, 2026
One-click install
npx skills add https://github.com/Military-Veteran-Team-LPT-Realty/mvt-manus-public-skills --skill webdev-image-generation-military-veteran-team-lpt-realty
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: webdev-image-generation
Source: https://github.com/Military-Veteran-Team-LPT-Realty/mvt-manus-public-skills/tree/main/skills/webdev-image-generation
Command: npx skills add https://github.com/Military-Veteran-Team-LPT-Realty/mvt-manus-public-skills --skill webdev-image-generation-military-veteran-team-lpt-realty

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Developers building Manus fullstack (web-db-user) or Expo mobile apps need AI-generated or AI-edited images without manually wiring up API keys or external image services. This Skill provides a preconfigured helper that connects directly to the internal ImageService. ## Core Features & Use Cases - Image Generation: Call generateImage() with a text prompt to create images server-side, defaulting to GPT Image 2 at medium quality. - Image Editing: Pass originalImages with a URL and MIME type to edit existing images with a prompt. - Model Discovery & Selection: Use listImageModels() to enumerate available models and override the default model or quality per request. - Use Case: In a tRPC procedure for a real-estate listing app, generate a hero banner image from a prompt, store the returned URL, and render it in the frontend with a loading state. ## Quick Start Ask the AI to generate an image from a prompt inside a server-side tRPC procedure using the generateImage helper and return the resulting URL.

Frequently Asked Questions about webdev-image-generation

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate an AI image in a Manus webdev project?

Import generateImage from ./server/_core/imageGeneration.ts and call it with a prompt inside server-side code such as a tRPC procedure. It returns an object containing the image URL, defaulting to GPT Image 2 at medium quality.

How do I edit an existing image with AI?

Pass an originalImages array to generateImage containing the source image URL and its mimeType, along with a prompt describing the edit. The helper returns the edited image URL.

How do I list and select available image generation models?

Call listImageModels from the same helper module to get available models with their model and id values. Feed a model value from that list into generateImage, and omit quality unless the chosen model supports it.

Can I call the image generation helper from client-side code?

No, generateImage should only be called from server-side code such as tRPC procedures. Calling it from the client would expose API keys, so keep all image generation logic on the server.

Why does image generation seem slow or fail in my app?

Image generation typically takes 5-20 seconds, so implement loading states in the UI. Generation can also fail outright, so wrap calls in proper error handling to surface failures gracefully.