هيثم العسولي

← كل المشاريع

مركز التبيان التعليمي

حلقات تحفيظ القرآن، تُدار كما ينبغي من الهاتف.

0الحقائق

الدور
منفردًا: الموبايل والخادم
السنة
2025
الحالة
صدر
التصنيف
الجوّال
بُني بـ
React Native · TypeScript · Firebase · Zustand · React Query · Reanimated · Skia · Restyle · Zod · Push Notifications
أين تجده
مركز التبيان التعليمي

1 · نظرة عامة

ما هو، ولماذا وُجد.

تطبيق مرافق لمركز تعليم القرآن وتحفيظه، يربط المركز بالطالب وأسرته. يجلس الطلاب في حلقات تحاكي الواقع، ويتابع المعلّم تلاوة الطالب على مصحف متزامن، وتحوّل الألعاب والاختبارات المراجعة إلى شيء يعود إليه الطلاب.

يقوم مركز التحفيظ على علاقات تُسطّحها البرمجيات عادةً: المعلّم يعرف أين وقف كل طالب، وما يتعثّر فيه، وهل تتابع الأسرة أم لا. ومعظم التطبيقات تستبدل بذلك شريط تقدّم.

يُنمذج هذا التطبيق البنية الفعلية. الحلقات تحاكي الحلقات الحقيقية. وأثناء التلاوة يرى المعلّم الصفحة نفسها التي يقرؤها الطالب، فيتابع ويصحّح دون أن يسأله أين وصل. ويطّلع الأهل على تقدّم أبنائهم دون الاتصال بالمركز.

أما الطبقة التنافسية، الاختبارات والألعاب ولوحة المتصدرين، فموجودة لأن المراجعة هي ما يتجاوزه الطلاب، وهي ما يحدّد ثبات الحفظ.

1a · التحديات

كل مشكلة أخذت بطاقة، وكل حلّ صُنّف خلفها.

1a1المصحف ليس عرض نصّ

يجب أن يُخرَج النص القرآني بدقة. فواصل الصفحات والأسطر ومواضع الكلمات ثابتة، ويلحظ القارئ الاختلاف فورًا. أما عرض النص المعتاد فيعيد التدفق، فتصير الصفحة خاطئة.

1a1aما فعلته

تُرسم الصفحات على لوحة Skia بهندسة ثابتة بدل إخراجها كنص متدفق، فتبدو الصفحة واحدة على كل مقاسات الأجهزة وتبقى مواضع الكلمات قابلة للعنونة لأجل التظليل.

1a2جهازان على الصفحة نفسها

يجب أن تتابع شاشة المعلّم موضع الطالب بدقة تكفي للتصحيح. والاستطلاع الدوري أبطأ من أن يبدو متصلًا، وبثّ كل حدث تمرير يُغرق الاتصال في حلقة فيها عشرات الطلاب.

1a2aما فعلته

تُقنَّن تحديثات الموضع وتُرسل كمؤشر مضغوط بدل تدفق أحداث تمرير، وضمن جلسة نشطة فقط. فيرى المعلّم السطر الحالي بسرعة دون أن يُبقي التطبيق قناة حيّة لكل طالب طوال اليوم.

1a3ثلاثة أدوار وقاعدة شيفرة واحدة

يحتاج المعلّم والطالب وولي الأمر شاشات مختلفة فعلًا وصلاحيات مختلفة، لكن إصدار ثلاثة تطبيقات لمركز واحد غير معقول في البناء وأسوأ في الصيانة.

1a3aما فعلته

تطبيق واحد بتنقّل مشتق من الدور، مع فرض الصلاحيات على الخادم في قواعد الأمان لا بإخفاء الأزرار. فالطالب الذي يفحص الاتصال لا يستطيع قراءة بيانات حلقة أخرى.

2 · النتائج

3 · لقطات

مركز التبيان التعليمي — 1
مركز التبيان التعليمي — 2
مركز التبيان التعليمي — 3
مركز التبيان التعليمي — 4
مركز التبيان التعليمي — 5

المشروع التالي

→بطاقات المقابلات

بطاقات مراجعة متباعدة للتحضير لمقابلات الهندسة.

التصميم التالي — الطابعةشاهد التصاميم الـ14