Patent Invention Disclosure
1. Title of the Invention
A Method for Synthesizing Realistic Poster Images Based on Automated Product Database Data Injection and Structured Generation via Large Models
2. Technical Field
The present invention relates to the field of AI content generation and marketing material automation technology, specifically to a method for automatic poster image generation. It particularly concerns a method and system for automatically injecting product database data, generating structured poster copy and layouts via large models, and then deterministically synthesizing them into a real bitmap with an embedded scannable QR code on the front end.
3. Background Art
Traditional marketing poster creation relies on manual production using design software like Photoshop/Canva, or directly generating images via text-to-image diffusion models. These approaches suffer from the following drawbacks:
(1) Low manual efficiency: Product selection, layout, color matching, and copywriting all require manual effort, making batch processing and real-time generation difficult.
(2) Uncontrollable text-to-image generation: Models like Stable Diffusion/DALL·E produce random outputs, often include watermarks, frequently generate garbled text, and struggle to maintain consistent brand colors and layouts, making them unsuitable for direct production use.
(3) Lack of conversion entry points: Posters do not contain functional, scannable QR codes; they are merely "display images" and cannot form a closed marketing loop.
(4) Disconnection from products: Poster copy and product images require manual transfer, leading to errors and inconsistencies.
Therefore, there is an urgent need for an automated method that is data-driven, controllable, reproducible, embeds real conversion entry points, and can generate realistic poster images with one click.
4. Summary of the Invention
4.1 Technical Problems to be Solved
- To solve the problems of low manual production efficiency and difficulty in batch/real-time processing, by providing automated injection of product database data;
- To solve the problems of uncontrollable text-to-image generation and garbled text, by providing a decoupled paradigm of "large model generating structured intermediate representation + front-end deterministic synthesis";
- Resolve the issue of posters lacking conversion entry points by providing embedded scannable real QR codes;
- Address the problem of disconnection from products by providing a marketing closed loop where QR code content directly links to product library detail pages.
4.2 Technical Solution
The present invention provides a method for synthesizing real poster images based on automatic product library data injection and structured generation by a large model, collaboratively implemented through product library injection, structured generation by a large model, frontend deterministic synthesis, QR code embedding, and one-click image generation. Corresponding real code (located in server/routes/, bossagents-miniapp/src/pages/asset/) describes key components.
(I) Automatic Product Library Data Injection and Selling Point Extraction
Upon entering frontend poster-generate.vue, loadProductList() is called, invoking gstApi.getProduct({current:1,size:50}) to fetch the entire product library; normalizeProduct() uniformly retrieves name/price/image/description, compatible with various field naming conventions. After the user selectProduct(item), the product name is auto-filled, and extractFeatures(description) automatically segments and extracts up to 4 selling points from the product description for injection into the poster, eliminating manual entry.
(II) Large Model Structured Generation (Lightweight Intermediate Representation)
POST /api/content/generate-poster (server/routes/content-routes.js:319-397) constructs a prompt to call llm.callLLM(...) (temperature:0.8, maxTokens:1500), instructing the model to return only JSON: title/subtitle/taglines/features/callToAction/colorScheme{primary,secondary,background,text}/layoutHint. The backend cleans markdown tags and JSON.parse's the response. The large model produces only this lightweight, controllable intermediate representation of "copy + color scheme + layout," not a direct image.
(III) Frontend Canvas Deterministic Synthesis into a Real Bitmap
renderPosterToImage(data) (poster-generate.vue:283-438) uses Canvas 2D to deterministically draw layer by layer: ① Gradient background → ② Decorative strip → ③ White rounded main card → ④ Title/subtitle (auto-wrapped) → ⑤ Gradient tags → ⑥ Product library main image (downloaded, then proportionally scaled with contain + rounded clipping) → ⑦ Feature list → ⑧ Divider + QR code + CTA. After drawing, uni.canvasToTempFilePath({canvasId, width:750, height:1200}) exports a real PNG temporary file. This deterministic synthesis ensures consistent brand colors, accurate text, and reproducibility.
(4) Embedding Scannable QR Codes (Marketing Closed Loop)
makeProductQrContent() generates QR code content = pages/gst/mall/info?id={selectedProduct.id}—scanning directly jumps to the product's detail page in the mall. Backend POST /api/content/generate-poster-qrcode uses the qrcode library to generate QR code PNG dataURL:
const QRCode = require('qrcode');
const qrDataUrl = await QRCode.toDataURL(String(content), { width:400, margin:2, type:'image/png' });
前端 fetchQrDataUrl 将其落为本地临时文件后 ctx.drawImage(localQr, qrX, qrY, QR_SIZE=220, QR_SIZE) 嵌入右下角,使海报与具体商品强绑定,形成"扫码即购买"的营销闭环。
(5) One-Click Real Image Generation & Pluggable Image Models
savePoster() saves the real image to the photo album via uni.saveImageToPhotosAlbum; previewPoster() supports preview; regenerate() allows one-click redrawing. The architecture reserves integration of models like "SenseTime SenseNova U1 Text-to-Image" (outputModality:image in server/config/models.json) as a replaceable rendering channel, demonstrating foresight and evolvability.
4.3 Beneficial Effects
- Data-Driven Automation: One-click product selection from the product library with automatic selling point extraction, eliminating manual poster creation.
- Controllable & Reproducible: LLM outputs only structured intermediate representation + deterministic frontend synthesis, ensuring consistent brand colors and accurate text, avoiding garbled text/watermarks from text-to-image generation.
- Marketing Closed Loop: Embedding real, scannable QR codes linking directly to product detail pages, making the poster a conversion entry point.
- Real Implementation: Generates real PNG bitmaps saved/previewed/redrawn, usable as content assets; architecture supports pluggable image generation models.
5. Figure Descriptions
Figure 1 System Flowchart: Illustrates the full pipeline: "User selects product → Product library injection + selling point extraction → LLM outputs structured JSON → Canvas deterministic synthesis → QR code embedding → PNG output → Save to disk."
Figure 2 Decoupling Paradigm Diagram: Compares "Text-to-image direct generation (random/garbled)" vs. "LLM intermediate representation + Canvas synthesis (controllable/reproducible)."
Figure 3 QR Code Closed Loop Diagram: Illustrates makeProductQrContent → server-side qrcode generation → frontend embedding → scanning redirects to product detail page.
6. Detailed Implementation
Step 1: Product Library Injection. loadProductList() fetches the product library, selectProduct backfills the name and extractFeatures(description) segments the selling points:
function extractFeatures(text) {
const parts = text.split(/[,,.。;;、]/).map(s=>s.trim()).filter(s=>s.length>=4 && s.length<=14);
return [...new Set(parts)].slice(0, 4); // 最多 4 条卖点
}
步骤二:大模型结构化生成。 generate() POST /api/content/generate-poster,后端 callLLM 返回版式 JSON,前端解析为 title/features/colorScheme。
Step 3: Deterministic Canvas Synthesis. renderPosterToImage renders the background, card, title, product image, and selling points layer by layer, and embeds a QR code:
const qrDataUrl = await fetchQrDataUrl(makeProductQrContent()); // pages/gst/mall/info?id=<id>
const localQr = await downloadToLocal(qrDataUrl);
ctx.drawImage(localQr, cardX + cardW - 52 - QR_SIZE, bottomY + 30, QR_SIZE, QR_SIZE);
ctx.draw(false, () => uni.canvasToTempFilePath({ canvasId:'posterCanvas', width:canvasW, height:canvasH,
success:(res)=>resolve(res.tempFilePath) })); // 真实 PNG 文件
步骤四:一键出图。 savePoster() 经 uni.saveImageToPhotosAlbum 落盘,regenerate() 复用表单重绘。
7. Draft Patent Claims
Claim 1 (Independent Claim). A method for synthesizing realistic poster images based on automated product library data injection and structured generation by a large model, characterized by comprising the following steps:
- Data injection step: fetching a product list from a product library and having a user select a product, automatically extracting the product name, main image, and selling points from its description, and injecting them into the poster generation context;
- Structured generation step: invoking a large model to generate only a structured intermediate representation containing a title, subtitle, selling points, color scheme, and layout prompts, rather than directly generating an image;
- Deterministic synthesis step: based on said structured intermediate representation, deterministically synthesizing a realistic bitmap file layer by layer using a front-end drawing engine, ensuring brand color consistency and text accuracy;
- QR code embedding step: generating a scannable QR code pointing to the product detail page and embedding it into the bitmap, thereby strongly binding the poster to the product to form a marketing closed loop;
- Image output step: saving the synthesized bitmap file to the local album and supporting preview and regeneration.
Claim 2 (Dependent Claim). The method according to Claim 1, characterized in that, in the data injection step, the selling points are extracted by segmenting the product description by punctuation, filtering by length, and deduplicating, taking up to a set number; said QR code content points to the product detail route in the product library and carries product identification parameters.
Claim 3 (Dependent Claim). The method according to Claim 1, characterized in that, the deterministic synthesis step uses Canvas 2D to layer and draw a background, a rounded main card, a title with automatic line wrapping, a product main image (with proportional scaling and rounded corner cropping), a selling points list, and a QR code on a fixed canvas size; the large model invoked in the structured generation step can be replaced with a dedicated text-to-image model as a pluggable rendering channel.
BossAgents