الصق صورة الخطأ، وكلود يصلحه قبل ما تشرح
الصورة تحمل سياقاً أكثر بكثير مما تقدر تصفه بكلمات.
كل مطوّر عاش هذا الموقف: خطأ يظهر في الترمنال أو المتصفح، تجلس تفكّر كيف تشرحه لأحد أو لأداة ذكاء اصطناعي (AI)، وفي اللحظة اللي تبدأ تكتب تحس إنك مو عارف من وين تبدأ. اسم الخطأ الطويل، رقم السطر، الملف، والسياق اللي حوله. والحل بصراحة أسهل مما تتخيّل: بدل ما تكتب، صوّر وألصق.
🧩 إيش هو بالضبط
كلود يملك قدرة قراءة الصور وفهمها، مو بس النصوص. يعني لما تلصق لقطة شاشة (screenshot) فيها رسالة خطأ، هو يشوف اسم الخطأ، والسطور اللي قبله وبعده، والألوان والتنسيق اللي يدلّ على نوع البيئة، ويبدأ يفكّر في الحل بناءً على كل هذا مع بعض. المطوّر اللي يحاول يشرح خطأ بالكلام يفقد وايد من هذا السياق. الصورة تحفظه كله.
⚙️ كيف يشتغل
كلود مو بس يستخرج النص من الصورة، هو يفهم السياق البصري بالكامل. لما ترسل له لقطة شاشة فيها خطأ، هذا اللي يحصل:
1️⃣ يتعرّف على نوع البيئة من الشكل البصري للصورة، سواء كانت ترمنال أو متصفح أو IDE أو build log
2️⃣ يقرأ رسالة الخطأ كاملة بما فيها مسار الملف ورقم السطر ونوع الخطأ بالتفصيل
3️⃣ يربط الخطأ بالسياق المرئي حواليه، مثل الأوامر اللي سبقته أو الكود الظاهر في الشاشة
4️⃣ يولّد الإصلاح المناسب بناءً على هذه المعطيات كلها مع بعض دفعة وحدة
الفرق الجوهري عن الوصف النصي: لما تكتب "عندي خطأ في Python"، كلود يحتاج يسألك أسئلة إضافية. لما ترسل صورة، هو يرى مباشرةً إنه خطأ ModuleNotFoundError في السطر 14 من ملف app.py في بيئة conda، ويعطيك الحل بدون مقدّمات.
🌍 وين تشوفه في حياتك
🖥️ أخطاء الترمنال التي تحتوي على stack traces طويلة يصعب نسخها بدقة
🌐 أخطاء لوحة المطوّر في المتصفح (DevTools console) أثناء تطوير الواجهات
🏗️ فشل عمليات البناء في GitHub Actions أو أي منظومة CI/CD
📱 أخطاء الشاشة البيضاء أو التوقف المفاجئ على المحاكي أثناء تطوير التطبيقات
🛠️ الأدوات اللي تستخدمها فعلاً
🔧 Claude.ai (claude.ai)
الخيار الأسرع والأكثر مباشرة. افتح محادثة في المتصفح والصق اللقطة مباشرة في صندوق الرسالة بدون أي خطوات إضافية.
كيف تبدأ:
1️⃣ روح على claude.ai وسجّل دخول بحسابك
2️⃣ خذ لقطة شاشة للخطأ (على Mac: Command + Shift + 4، على Windows: Win + Shift + S)
3️⃣ في صندوق الرسالة، اضغط Ctrl + V أو Command + V لتلصق الصورة مباشرة بدون ما تكتب شيء، ثم أرسل
🔧 Claude للجوال (iOS و Android)
للمطوّرين اللي يشوفون أخطاء على الجهاز أو يريدون الوصول لكلود من أي مكان.
كيف تبدأ:
1️⃣ حمّل تطبيق Claude من App Store أو Google Play
2️⃣ خذ لقطة شاشة للخطأ على جهازك
3️⃣ في التطبيق، اضغط أيقونة الصورة في صندوق الرسالة واختر اللقطة من معرض الصور، ثم أرسل
🔧 Claude Code (claude.ai/code)
للمطوّرين اللي يشتغلون داخل الترمنال ويريدون تجربة أعمق مع الكود مباشرةً في بيئة العمل.
كيف تبدأ:
1️⃣ ثبّت Claude Code بتشغيل الأمر: npm install -g @anthropic-ai/claude-code
2️⃣ شغّله بكتابة claude في الترمنال
3️⃣ اسحب لقطة الشاشة وأفلتها في نافذة الترمنال، أو استخدم الأمر /add-image لإضافة ملف الصورة مباشرة
💡 جرّب بنفسك: خطوة بخطوة
خذ أي خطأ عندك من قبل أو اصنع واحداً بسيطاً الآن، وطبّق هذا بالترتيب:
1️⃣ افتح الترمنال وشغّل أمراً تعرف إنه سيعطيك خطأ. مثلاً: python -c "import nonexistent_module" في Python، أو node -e "require('./missing_file')" في Node.js
2️⃣ خذ لقطة شاشة للخطأ اللي ظهر كاملاً، وتأكد إن رسالة الخطأ والسياق حواليها ظاهرين في اللقطة
3️⃣ افتح claude.ai في المتصفح وأنشئ محادثة جديدة
4️⃣ الصق اللقطة في صندوق الرسالة (Ctrl + V أو Command + V) بدون ما تكتب أي كلمة، واضغط إرسال
ستحصل على تشخيص للخطأ وخطوات الإصلاح قبل ما تكتب كلمة واحدة. هذا هو الفرق بعينه.
وش تسوي بعد ذا
✅ جرّب تلصق لقطة شاشة لأقدم خطأ عندك ما قدرت تحله
✅ اهتم بأخذ لقطات تظهر السياق الكافي حول الخطأ وليس الرسالة لوحدها
✅ اسأل نفسك: في أي مواقف ثانية في شغلتك تقدر تستخدم الصور بدل الكلمات؟
الصورة أسرع من الكلمات، وكلود يفهمها.
———— English ————
**Paste a screenshot of the error. Claude fixes it before you explain.**
Because a screenshot carries more signal than anything you could type in two sentences.
Every developer knows this moment: an error appears in the terminal or the browser, you sit down to describe it, and you immediately realize you don't know where to start. The full error name, the line number, the file, the surrounding context. The actual solution is simpler than it sounds: stop describing and start showing.
**What it actually is**
Claude can read and understand images, not just text. When you paste a screenshot of an error, it sees the error name, the lines before and after it, the color scheme that signals the environment type, and the full stack trace all at once. A developer trying to describe an error in words loses most of that context in translation. A screenshot keeps it intact.
**How it works**
Claude doesn't just extract text from the image. It interprets the full visual context. When you send a terminal screenshot with an error, here's what happens:
1️⃣ It identifies the environment type from the visual structure of the image, whether that's a terminal, browser DevTools, an IDE, or a build log
2️⃣ It reads the full error message including the file path, line number, and error type
3️⃣ It connects the error to surrounding visible context, such as the commands that preceded it or the code visible on screen
4️⃣ It generates a targeted fix based on all of these inputs together
The key difference from a text description: when you type "I have a Python error," Claude needs to ask clarifying questions. When you send a screenshot, it sees directly that it's a ModuleNotFoundError on line 14 of app.py in a conda environment, and it gives you the fix without needing to ask anything.
**Where you see it**
🖥️ Terminal errors with long stack traces that are painful to copy faithfully
🌐 Browser DevTools console errors during frontend debugging
🏗️ Build failures in GitHub Actions or any CI/CD pipeline
📱 White screen crashes or unexpected stops on the simulator during mobile development
**🛠️ Tools you actually use**
🔧 Claude.ai (claude.ai)
The fastest and most direct option. Open a conversation in the browser and paste the screenshot straight into the message box.
How to get started:
1️⃣ Go to claude.ai and sign in to your account
2️⃣ Take a screenshot of the error (Mac: Command + Shift + 4, Windows: Win + Shift + S)
3️⃣ In the message box, press Ctrl + V or Command + V to paste the image directly without typing anything, then send
🔧 Claude Mobile App (iOS and Android)
For developers who encounter errors on a device or want access to Claude from anywhere.
How to get started:
1️⃣ Download the Claude app from the App Store or Google Play
2️⃣ Take a screenshot of the error on your device
3️⃣ In the app, tap the image icon in the message box, select the screenshot from your photo library, and send
🔧 Claude Code (claude.ai/code)
For developers who live in the terminal and want a deeper coding experience directly inside their working environment.
How to get started:
1️⃣ Install Claude Code by running: npm install -g @anthropic-ai/claude-code
2️⃣ Launch it by typing claude in your terminal
3️⃣ Drag and drop the screenshot into the terminal window, or use the /add-image command to attach an image file directly
**💡 Try it yourself: step by step**
Take any recent error or create a simple one right now, and follow this in order:
1️⃣ Open your terminal and run a command you know will throw an error. For example: python -c "import nonexistent_module" in Python, or node -e "require('./missing_file')" in Node.js
2️⃣ Take a screenshot of the full error output. Make sure the error message and the surrounding context are both visible in the frame
3️⃣ Open claude.ai in your browser and start a new conversation
4️⃣ Paste the screenshot into the message box (Ctrl + V or Command + V) without typing anything else, then send
You will get a diagnosis and a fix before you type a single word. That is the entire point.
**What to do next**
✅ Try pasting a screenshot of an old error you gave up on
✅ Practice taking screenshots that include enough surrounding context, not just the red line
✅ Ask yourself which other parts of your workflow involve errors that are faster to show than to describe
A screenshot says more than a paragraph ever will.