مُخرجات Claude Code: شارك صفحات حيّة من أي جلسة عمل

إذا استخدمت Claude Code لأكثر من بضع دقائق، فأنت تعرف النمط المعتاد: يعمل النموذج على حل مشكلة في الطرفية، وينتج شيئًا مفيدًا حقًا — مقارنة تفاضلية مُعلَّقة، أو جدول زمني لتحليل السبب الجذري، أو قائمة مُرتَّبة من الخيارات — ثم يبقى كل ذلك حبيس الطرفية. مشاركته تعني لصق جدران من النصوص في Slack أو مطالبة زميلك بالثقة في ملخصك.

تُغيّر مُخرجات Claude Code هذا الواقع. يمكن لأي جلسة الآن نشر نتائجها على شكل صفحة ويب خاصة وحيّة على claude.ai. تتحدث الصفحة في مكانها مع استمرار الجلسة، وتشاركها برابط واحد فقط. لا نشر، لا نسخ ولصق، لا سياق ضائع.

ما هي مُخرجات Claude Code؟

المُخرَج عبارة عن صفحة HTML مكتفية بذاتها تنشرها Claude Code من جلستك إلى رابط على claude.ai. افتحها في المتصفح لترى كل ما أنتجه النموذج — مقارنات تفاضلية، ولوحات بيانات، وقوائم تحقق، وعناصر تفاعلية — دون الضجيج البصري للطرفية. ومع استمرار الجلسة، يتجدد نفس الرابط في مكانه.

أُطلقت المُخرجات في نسخة تجريبية بتاريخ 18 يونيو 2026، وهي متاحة الآن لجميع خطط Pro وMax وTeam وEnterprise. تحتاج إلى Claude Code CLI الإصدار 2.1.183 أو أحدث، وجلسة مُصادَق عليها عبر /login.

كيفية إنشاء مُخرَج

لا تحتاج إلى أمر خاص أو خيار مُحدَّد. اطلب من النموذج بلغة عادية:

Make an artifact that walks through this PR with the diff annotated inline.

أو

Build a dashboard artifact of last week's deploy failures by service
and keep it updated as you investigate.

يكتب النموذج ملف HTML أو Markdown في مشروعك، ثم يطلب الإذن قبل النشر. وافق مرة واحدة وستُنشر التحديثات اللاحقة على نفس المُخرَج بصمت. يطبع النموذج الرابط، ويفتح متصفحك الصفحة تلقائيًا.

لتعطيل الفتح التلقائي، اضبط CLAUDE_CODE_ARTIFACT_AUTO_OPEN=0 في بيئتك. اضغط Ctrl+] في أي وقت لإعادة فتح آخر مُخرَج من الطرفية.

ست حالات استخدام والأوامر المناسبة

1. مراجعة طلبات السحب (Pull Requests)

أنشئ صفحة تعرض المقارنة التفاضلية مع ملاحظاتك في الهامش، بحيث يرى المراجعون السياق بجانب الكود مباشرةً:

Make an artifact that walks through this PR. Render the diff with margin annotations
and color-code findings by severity.

2. الجداول الزمنية للتحقيقات

لحوادث الإنتاج وجلسات التصحيح، احتفظ بجدول زمني حي يتكامل أثناء عمل النموذج:

Build a timeline artifact for this incident. Add each finding as you confirm it
and mark the root cause when we identify it.

يتابع أعضاء الفريق التقدم في الوقت الفعلي دون مشاهدة طرفيتك.

3. مقارنة البدائل

ضع خيارات التنفيذ جنبًا إلى جنب في صفحة واحدة للتقييم المشترك:

Make an artifact with four distinctly different layouts for the settings panel.
Vary density and grouping, and lay them out as a grid with a one-line tradeoff under each.

يعمل هذا بالتساوي للواجهات البرمجية والنصوص وخطط التنفيذ.

4. الضبط التفاعلي

أضف أدوات تحكم للقيم التي تُعدّلها واستكشفها بصريًا:

Build an artifact with sliders for easing curve, duration, and delay
so I can try values on this transition. Show the animation live as I move them.

5. تتبع التقدم في المهام الطويلة

للترحيلات وإعادة الهيكلة والعمليات الكبيرة، أبقِ المُخرَج محدَّثًا طوال العملية:

Turn this migration plan into a checklist artifact.
Check items off as you complete them and add a note for anything you skip.

6. إعادة النتائج إلى الجلسة

يمكن للمُخرَج أن يعمل كأداة اتخاذ قرار خفيفة تُعيد نتائجها إلى النموذج:

Make a triage board artifact with each open issue as a draggable card across
Now, Next, Later, and Cut columns. Add a Copy as prompt button that gives me
the final ordering to paste back here.

البيانات الحيّة عبر موصّلات MCP

يمكن للمُخرجات استدعاء موصّلات MCP الخاصة بك في كل مرة يفتح أحدهم الصفحة، وليس فقط عند إنشاء النموذج لها. يتطلب ذلك CLI الإصدار 2.1.209 أو أحدث.

Build a dashboard artifact of our open pull requests that pulls the live list
through my GitHub connector when the page loads.

تمر استدعاءات كل مُشاهِد عبر حساب الموصّل الخاص به. شخصان يفتحان نفس لوحة البيانات قد يريان بيانات مختلفة بحسب صلاحياتهما. الصفحة لا ترى بيانات اعتماد أي شخص — claude.ai يُجري الاستدعاءات الشبكية نيابةً عن الصفحة.

مهم: لا يمكن مشاركة المُخرجات المرتبطة بالموصّلات عبر روابط عامة في أي خطة. تبقى داخل مؤسستك فقط.

المشاركة والتعاون

المُخرَج الجديد مرئي لك فقط. للمشاركة، افتح المُخرَج في المتصفح واستخدم عنصر Share في رأس الصفحة.

خطط Pro وMax: رابط عام فقط. يمكن لأي شخص لديه الرابط مشاهدة الصفحة دون تسجيل دخول.

خطط Team وEnterprise: شارك مع أعضاء محددين في المؤسسة أو مع الجميع. يسجّل المُشاهِدون دخولهم بحساباتهم المؤسسية. المشاركة العامة معطَّلة افتراضيًا حتى يُفعّلها مالك الحساب من الإعدادات.

المحررون: في خطط Team وEnterprise، يمكنك منح زميل صلاحية التحرير. يُعطي النموذجَ رابطَ المُخرَج في جلسته الخاصة، ويعيد النشر بتغييراته. يرى كل من لديه الصفحة مفتوحة كل تحديث مباشرةً.

دمج نظام التصميم

اعتبارًا من CLI الإصدار 2.1.183، يُطبّق النموذج مهارة تصميم مدمجة عند بناء المُخرجات — لوحة ألوان وطباعة ومسافات مدروسة دون الحاجة إلى توجيهات إضافية. لتوحيد المُخرجات مع علامتك التجارية، أضف رموز التصميم في CLAUDE.md:

## Design system
- Colors: primary #1a4d8f, accent #f59e0b, surface #f8fafc
- Typography: Inter for body, JetBrains Mono for code
- Spacing: 8px scale, 6px border radius

يعطي النموذج نظام تصميمك أولوية أعلى من اختياراته الافتراضية.

القيود التقنية

المُخرجات ثابتة بطبيعتها. تحجب سياسة أمان المحتوى الصارمة جميع الطلبات الخارجية — لا سكريبتات خارجية، ولا خطوط، ولا صور، ولا استدعاءات fetch، ولا WebSockets. يدمج النموذج كل شيء في الصفحة. استدعاءات موصّلات MCP هي الاستثناء الوحيد.

لخفض تكلفة الرموز المميزة: فضّل SVG أو CSS للمخططات بدلًا من الصور النقطية المدمجة، واستغنِ عن التفاعلية غير الضرورية، واجعل الصفحة تلخّص مجموعات البيانات الكبيرة بدلًا من تضمينها كاملةً.

متطلبات التوفر

خلاصة القول

تحل مُخرجات Claude Code مشكلة حقيقية: مخرجات الطرفية ممتازة لمن يُشغّلها وغير مفيدة تقريبًا لأي شخص آخر. أمر واحد يحوّل عمل الجلسة إلى صفحة قابلة للمشاركة وحيّة تتجدد في مكانها ولا تتطلب أي نشر من طرفك.

للفرق التي تستخدم Claude Code بالفعل، هذا هو أسرع طريق من "اكتشف النموذج الحل" إلى "يمكن لفريقي رؤية ما اكتشفه النموذج" — دون نسخ ولصق، ودون لقطات شاشة، ودون سياق ضائع.

جرّبها مع مراجعة PR التالية: Make an artifact that walks through this PR with the diff annotated inline والرابط جاهز قبل أن يفتح مراجعك GitHub.