منتج تعليمي بالذكاء الاصطناعي · عمل مستقل
AI Detektor
منتج سويدي لاكتشاف النصوص المولدة بالذكاء الاصطناعي للمدارس، مبني حول مساحة تحليل مركزة ودخول موثّق وإشارات مخاطر واضحة وأدلة تساعد المعلم في المراجعة.
الدور
مطور Frontend مستقل
التقنيات
01 / نظرة عامة
يساعد AI Detektor المدارس السويدية على تقييم احتمالية توليد النص بالذكاء الاصطناعي عبر واجهة هادئة ومركزة على المهمة. يستطيع المعلم لصق النص أو تجربة أمثلة أو رفع ملف وتشغيل التحليل، ثم استخدام الإشارة الناتجة كعنصر مساعد للنقاش وليس كحكم آلي نهائي.
02 / التحدي
اكتشاف نصوص الذكاء الاصطناعي مسار حساس؛ يجب معالجة نصوص طويلة وشرح عدم اليقين بمسؤولية ودعم الحسابات الموثقة، مع إبقاء المهمة واضحة لمعلم قد لا يكون متخصصاً تقنياً.
03 / الحل
عملت على تجربة Frontend هادئة تتمحور حول مهمة تحليل رئيسية واحدة. تجمع الواجهة الأمثلة والإدخال ورفع الملفات وعدد الكلمات وزر التحليل ضمن مساحة واضحة، بينما يربط Next.js خدمات التحليل المكتوبة ببايثون ويتولى Clerk حدود الحساب والدخول.
04 / الأساليب ومكان تطبيقها
ليس فقط ماذا استُخدم، بل أين ولماذا.
الأسلوب
تسلسل تفاعلي لمهمة واحدة
أين طُبّق؟
يقود الـHero وصندوق التحليل المستخدم من فهم الفكرة إلى اختيار المثال وإدخال النص أو رفعه ثم تنفيذ إجراء التحليل الرئيسي بدون تشتيت.
الأسلوب
ربط Typed مع Python API
أين طُبّق؟
ترسل واجهة Next.js طلبات التحليل إلى خدمات بايثون وتعرض حالات التحميل والتحقق والنتيجة خلف حدود Frontend مستقرة.
الأسلوب
حدود مصادقة باستخدام Clerk
أين طُبّق؟
تم فصل الدخول والوصول المحمي للمنتج عن صفحة التعريف العامة الموجهة للمدارس، مع إبقاء نقطة الدخول واضحة في التنقل.
الأسلوب
دعم تدريجي للإدخال
أين طُبّق؟
يمكن البدء بأمثلة جاهزة أو لصق نص خاص أو رفع ملف، ما يقلل الجهد المطلوب لفهم المنتج وتجربته.
الأسلوب
Layout متجاوب للمنتج
أين طُبّق؟
يعاد توزيع المحتوى التعريفي ومساحة التحليل على الشاشات المختلفة مع الحفاظ على مسار الكشف الأساسي.
05 / الميزات الرئيسية
القدرات الأساسية التي بُني عليها AI Detektor.
مساحة كبيرة لتحليل النص مع عداد للكلمات
أمثلة لنص AI ونص بشري ونص مختلط
إدخال مباشر للنص ورفع الملفات
تسجيل دخول ووصول مرتبط بالحساب
محتوى سويدي موجه للمدارس
تجربة Landing وتحليل متجاوبة
06 / مقالات مرتبطة
شرح أعمق للقرارات الهندسية المستخدمة في هذا النوع من المنتجات.
8 دقائق قراءة
كيف أبني بنية Frontend قابلة للتوسع
منهج عملي لتنظيم مشاريع الواجهات عبر ملكية الميزات وحدود البيانات المكتوبة بالأنواع وحالات التحميل والخطأ وبنية تسهّل التطوير والإطلاق.
قراءة المقال7 دقائق قراءة
بناء API Layer احترافي باستخدام TypeScript
طريقة فصل تفاصيل الاتصال عن الشاشات وتوحيد الأخطاء والأنواع والبحث والـPagination لتسهيل صيانة تطبيقات React وReact Native.
قراءة المقال