المشكلة: يريد العميل أن يرى النتيجة على سيارته هو
تبيع ورشة تغليف السيارات أو تظليل الزجاج أو تركيب أفلام حماية الطلاء شيئًا لا يستطيع العميل رؤيته حتى يكتمل. يعرض معرض الأعمال سيارات أشخاص آخرين، وتعرض عينة الشركة المصنّعة المادة على بطاقة مسطّحة. أما ما يحسم البيع فهو سيارة العميل نفسه، M4 موديل 2021، باللون الرمادي الساتان الذي يتردد بشأنه تحديدًا، ولا توجد صورة لذلك، لأن العمل لم يُنجز بعد.
تظهر الفجوة نفسها في مراحل لاحقة أيضًا. ففنّي قصّ الأفلام يحتاج إلى مخطط واضح للمصد الأمامي لطراز سنة لا تغطيها مكتبة القوالب بعد. وأداة تخصيص السيارة تحتاج إلى عرض دوّار للسيارة بلون أساسي يمكن للمصمم الطلاء فوقه. وجميعهم يحتاجون إلى الشيء نفسه: صورة استوديو لعلامة وطراز وسنة محددة، بلون طلاء يختارونه، دون أي خلفية.
ثلاث طرق تستخدم بها الورش الصور
تؤدي عمليات التكامل الخاصة بالتغليف والتظليل وأفلام الحماية على الواجهة اليوم ثلاث مهام، وأحيانًا الثلاث معًا:
- قاعدة بيضاء، ثم المادة فوقها. اعرضوا سنة طراز سيارة العميل بـ
color=whiteعلى صورة PNG شفافة، وركّبوا التغليف أو التظليل أو التصميم المطبوع فوقها في المتصفح. قناة ألفا في صورة PNG هي حدود السيارة. - لون طلاء برمز hex. لتغليف بلون سادة أو لإعادة الطلاء، استغنوا عن الدمج: يُرجع
color=686c70السيارة بذلك الطلاء مباشرةً، دون المساس بالزجاج والعجلات، مقابل رصيد واحد كما في الألوان المعدّة مسبقًا. - نموذج ثلاثي الأبعاد للعرض الدوّار. ينشئ
POST /api/v1/3dملفات GLB وUSDZ وFBX مكسوّة بالخامات للمركبة باللون المختار، مرة واحدة لكل مركبة ولون. ويأتي النموذج المنشور مع شيفرة تضمين من سطرين لصفحة عرض السعر، وملف USDZ يمكن للعميل فتحه بتقنية الواقع المعزز (AR) على iPhone.
يُشغّل أحد المتاجر دفعاته عبر موصل ChatGPT بدلًا من الكود، وهو نمط رابع يستحق قسمًا خاصًا به أدناه.
صورة أساسية بيضاء والمادة فوقها
التغليف يحل محل الطلاء، لذا ابدأوا بأقل قدر ممكن من الطلاء. يمنحكم color=white أفتح هيكل محايد مع الحفاظ على تظليل الاستوديو؛ وتُظهر زاوية side الجانبية المستقيمة أكبر مساحة من جانب السيارة بأقل تشوّه منظوري، وهذا ما تحتاجه معاينة المادة. اطلبوا png (أو webp) للحفاظ على قناة الشفافية، وأكبر حجم متاح، 1024، لتتمكنوا من تكبير المعاينة.
# the customer's exact model year, in white: the base every material goes on top of
curl --fail-with-body -H "Authorization: Bearer $CAR_IMAGE_API_KEY" \
"https://carimage.dev/api/v1/images/car?vehicle=veh_0ta0ejj0qad2w&view=side&color=white&w=1024&format=png" \
-o m4-side-white.png
# a solid-color wrap or a factory paint, by hex: the API recolors the paint and leaves glass, trim and wheels alone
curl --fail-with-body -H "Authorization: Bearer $CAR_IMAGE_API_KEY" \
"https://carimage.dev/api/v1/images/car?vehicle=veh_0ta0ejj0qad2w&view=side&color=686c70&w=1024&format=png" \
-o m4-side-nardo.pngبالنسبة إلى خامة ذات نسيج، لا يتطلب الدمج سوى بضعة أسطر من canvas: تُرسم الصورة مرة واحدة كقناع، ويُطلى النسيج فقط حيث توجد السيارة، ثم تُرسم الصورة مرة أخرى بوضع multiply لتعود ظلالها وانعكاساتها للظهور عبر الخامة.
// A textured material (carbon, chrome, a printed design) goes on in the browser.
// The white render is the mask: paint the material only where the car is, then let
// the render's own shading through.
const car = await loadImage(whiteBaseUrl); // transparent PNG from the API
const ctx = canvas.getContext("2d");
canvas.width = car.width;
canvas.height = car.height;
ctx.drawImage(car, 0, 0);
ctx.globalCompositeOperation = "source-atop"; // keep the car's alpha
ctx.fillStyle = ctx.createPattern(materialSwatch, "repeat");
ctx.fillRect(0, 0, canvas.width, canvas.height);
ctx.globalCompositeOperation = "multiply"; // shading, reflections and panel lines come back
ctx.drawImage(car, 0, 0);
// The whole silhouette is covered, glass and wheels included: the API ships the car's
// alpha, not per-panel masks. Good enough for a quote; a solid color should use color=<hex> instead.مطابقة لون الطلاء أو التغليف برمز hex
منذ أن أصبحت ألوان الطلاء إعادة تلوين لصورة محايدة واحدة، يقبل color أي رمز hex من ستة أرقام إلى جانب 15 من أسماء الألوان المُعدّة مسبقًا: color=686c70 مجرّدًا في URL، و"color": "#686c70" في JSON. ابحثوا عن عيّنة اللون لدى الشركة المصنّعة، أو عن رمز الطلاء الأصلي لسيارة العميل، ومرّروه. تُطبَّق إعادة التلوين على الطلاء فقط، فيبقى الزجاج والأضواء والزخارف والعجلات كما هي، وهذا بالضبط الفرق بين معاينة التغليف وصورة مُلوّنة بفلتر. وكل رمز hex هو نسخة إضافية مخزّنة مؤقتًا ورصيد واحد، لذا فإن لوحة من عشرين لونًا مرشّحًا لسيارة واحدة تكلّف عشرين رصيدًا، مرة واحدة فقط.
نموذج ثلاثي الأبعاد للمنصة الدوّارة والواقع المعزّز
عندما تحتاج صفحة عرض السعر إلى أن تدور السيارة، اطلبوا نموذجًا. يأخذ POST /api/v1/3d معرّف المركبة ولونًا، ويخصم 100 رصيد، ويُنشئ ملف GLB مكسوًّا بالخامات، ونسخة منه للمتصفح، وملف USDZ وملف FBX، إضافةً إلى صورة مصغّرة. يستغرق النموذج الأول للمركبة 10–20 minutes؛ وكل لون إضافي لتلك المركبة يعيد إكساء الشبكة نفسها خلال 1–2 minutes. طلب مركبة ولون تملكونهما بالفعل مجاني (billing.already_owned: true)، لذا يمكن للورشة أن تبني أداة التهيئة لديها على القاعدة البيضاء نفسها لكل مهمة.
curl -X POST https://carimage.dev/api/v1/3d \
-H "Authorization: Bearer $CAR_IMAGE_API_KEY" \
-H "Content-Type: application/json" \
-H "Idempotency-Key: wrap-quote-4471" \
-d '{"vehicle": "veh_0ta0ejj0qad2w", "color": "white", "publish": true}'{
"data": {
"id": "8c1d6b8e-2b4a-4f6e-9a2e-1f3c5d7e9b01",
"object": "3d_model",
"status": "queued",
"progress": 0,
"vehicle": {
"id": "veh_0ta0ejj0qad2w",
"make": "bmw",
"model": "m4",
"year": 2021
},
"color": "white",
"files": null,
"public": {
"id": "m3d_…",
"url": "https://carimage.dev/api/v1/3d/public/m3d_…",
"files": null,
"embed": {
"script": "https://carimage.dev/embed/3d.js",
"html": "<script src=\"https://carimage.dev/embed/3d.js\" async></script>\n<car-3d model=\"m3d_…\"></car-3d>"
}
}
},
"billing": {
"charged_on": "creation",
"credits_charged": 100,
"credits_remaining": 24900,
"already_owned": false
},
"request_id": "req_01j9y…"
}يمنح publish: true النموذج عناوين URL على شبكة CDN لدينا لا تتطلب مفتاحًا، وشيفرة تضمين حتى قبل أن يصبح جاهزًا؛ ويعرض العنصر التقدّم حتى تصل الملفات. اضبطوا view على أي من زوايا الكاميرا الثماني للقطة الافتتاحية، وspin للدوران على قاعدة دوّارة، وbackdrop لأرضية الاستوديو، وar لتقديم ملف USDZ لأجهزة iPhone وملف GLB لأجهزة Android عبر عارض الواقع المعزز المدمج في المتصفح. أما ملف FBX فهو للمصمم: افتحوه في Blender أو في أداة لتصميم التغليف، وارسموا التصميم على خرائط UV، فيرى العميل تصميمه الخاص على سيارته.
<script src="https://carimage.dev/embed/3d.js" async></script>
<car-3d model="m3d_…" view="front-3-4" spin backdrop="studio" ar alt="2021 BMW M4 in white"></car-3d>تشغيل دفعة من ChatGPT أو Claude
ليس لدى كل متجر مطوّر، ومن أكثر عمليات التكامل نشاطًا على الـ API موظفٌ يطلب الصور من مساعد ذكي. أضف https://carimage.dev/api/mcp كموصّل (يسجّل ChatGPT وClaude الدخول عبر OAuth، ويوافق المستخدم على الصلاحيات على الشاشة)، فيحصل المساعد على الأدوات نفسها التي يستخدمها أي برنامج: resolve_vehicle لتحويل "2014 Audi S3 cabriolet, grey, side" إلى معاملات دقيقة، وget_car_image لصورة واحدة، وcreate_car_image_urls لما يصل إلى خمسين رابطًا موقّعًا في استدعاء واحد، وcreate_3d_model للعرض الدوّار.
أمران يضمنان نجاح تنفيذ دفعة عبر مساعد ذكي:
- مرّر
idempotency_keyلكل دفعة. المساعدات تعيد المحاولة. مع وجود مفتاح، يعيد استدعاءcreate_car_image_urlsالمكرر النتيجة الأولى (idempotent_replayed: true) دون أي رسوم. - ضعوا ميزانية التصيير في الحسبان، لا حد المعدل فقط. عمليات تصيير الفئات التي لم يطلبها أحد من قبل تستهلك من الحصة اليومية للحساب من سعة التوليد (10% في خطة Pro). قد تبلغها دفعة من بضع مئات من السيارات الجديدة بثلاث زوايا عرض؛ وعندها تردّ الأداة بوقت لإعادة المحاولة و
reset_at، دون أي خصم، وتستمر الصور المخزّنة مؤقتًا في التدفق. وزّعوا الدفعة على أمسية أو اثنتين، أو انتقلوا إلى خطة Business للحصول على حصة أكبر.
تجدون طريقة الإعداد لكل تطبيق عميل، وقائمة الأدوات الكاملة، في صفحة MCP.
CLI وSDK وMCP
# the white base and a hex paint, straight to files
npx @meterapp/car-image get --vehicle veh_0ta0ejj0qad2w --view side --color white --width 1024 --out m4-side-white.png
npx @meterapp/car-image get --vehicle veh_0ta0ejj0qad2w --view side --color 686c70 --width 1024 --out m4-side-nardo.png
# the 3D model: published at once, polled until ready, every file downloaded
npx @meterapp/car-image 3d create --vehicle veh_0ta0ejj0qad2w --color white --publish --wait --out ./modelsimport { CarImageClient } from "@meterapp/car-image-sdk";
const client = new CarImageClient({ apiKey: process.env.CAR_IMAGE_API_KEY });
// 100 credits the first time. Ordering the same vehicle in the same color again
// answers billing.already_owned: true and charges nothing.
const { data: model } = await client.create3dModel({ vehicle: "veh_0ta0ejj0qad2w" }, { color: "white", publish: true });
const ready = await client.wait3dModel(model.id, { onProgress: (m) => console.log(m.stage, m.progress) });
// FBX for the designer's tool of choice, USDZ for the customer's iPhone, glb_web for the page.
const fbx = await client.download3dModel(ready.id, "fbx");
const embedHtml = ready.public?.embed.html;- MCP:
get_car_imageوcreate_car_image_urlsضمن مجموعة الأدوات الأساسية، وcreate_3d_modelوget_3d_modelوpublish_3d_modelمع?toolset=all؛ وتقبل كل أداة صورvehicleوcolorبصيغة hex. - تغطي وثائق 3D الـ webhooks (طلب POST موقّع واحد عند اكتمال النموذج)، وأحجام الملفات، وكل سمات التضمين؛ ويغطي قسم الألوان في صفحة الصور قواعد الطلاء.
الأسئلة الشائعة
- هل يكلّف لون hex مخصص أكثر من لون جاهز؟
- لا. كل لون هو إعادة تلوين لصورة محايدة واحدة لتلك المركبة وزاوية العرض، لذا فإن اللون المُعدّ مسبقًا، ورمز المصنع الذي بحثتم عنه، وعيّنة اللون من شركة تصنيع أغلفة السيارات، تكلّف كلها رصيدًا واحدًا. ولون hex المطابق لعيّنة لون مُعدّ مسبقًا هو ذلك اللون نفسه.
- هل الصورة دقيقة بما يكفي لقصّ أفلام التغليف وفقًا لها؟
- لا. الصور المُولّدة هي مرئيات استوديو للعلامة والطراز والسنة، وليست بيانات CAD ولا صورًا من الشركة المصنّعة: فالكتالوج لا يميّز بين الفئات، وقد تختلف خطوط الألواح بين زاويتين للسيارة نفسها. استخدموها لعرض السيارة على العميل وتسعير العمل؛ أما أنماط القص فاستخرجوها من قالب أو من المركبة نفسها.
- هل يمكننا الحصول على السيارة بدون طلاء، أو النوافذ فقط؟
- أقرب ما يكون إلى القالب الفارغ هو color=white على صورة PNG شفافة، وقناة ألفا في PNG تمثّل الصورة الظلية للسيارة. لا توفّر API أقنعة لكل لوح أو للزجاج. ولتغليف بلون موحّد، دعوا color=<hex> يقوم بالمهمة: فهو يعيد تلوين الطلاء ويترك الزجاج والزخارف والعجلات كما هي.
- ما الزوايا التي ينبغي استخدامها في عرض سعر التظليل أو أفلام PPF؟
- الزوايا المستقيمة: الجانبية (side أو side-right) لزجاج الأبواب والجوانب، والأمامية لشريط الزجاج الأمامي وغطاء المحرك والمصد، والخلفية للزجاج الخلفي. أما زوايا ثلاثة الأرباع فهي التي يتفاعل معها العملاء، لذا استخدموا front-3-4 للصورة الرئيسية والزوايا المستقيمة بجانب بنود عرض السعر.
- هل نمتلك النموذج ثلاثي الأبعاد؟
- النموذج مرخَّص مثل الصور المولَّدة: يُدفع ثمنه مرة واحدة لكل مركبة ولون في كل حساب، ويمكن طلبه مجددًا مجانًا، ويحق لكم استخدامه داخل منتجكم والاحتفاظ به على خوادمكم، حتى بعد انتهاء الخطة. وكل لون إضافي لمركبة تملكونها بالفعل يعيد تلوين النموذج الشبكي نفسه، كما يمنح النشرُ النموذجَ عناوين URL لا تتطلب مفتاحًا وشيفرة تضمين دون أي تكلفة.