Hamza-AyedandClaude Opus 5
92dc6b3641
نسخة كاملة من مستودع سيرو عند ecfe7568 لتكون أساس تطبيق «انطلق». نُسخ المتعقَّب في git فقط (12,509 ملفاً / 302 م.ب) بـ git archive، لا `cp -r` — فاستُثنيت تلقائياً مخلفات البناء (build · node_modules · .dart_tool · .gradle · Pods ≈ 10.7 غ.ب) وكل ما يستثنيه .gitignore. هذا الكوميت **بلا أي تعديل عمداً** حتى يكون كل ما يليه فرقاً مقروءاً مقابل سيرو الأصلي. سيرو نفسه لم يُمسّ. ⚠️ لا يبني بعد: `.env` و`lib/env/env.g.dart` غير متعقَّبين في سيرو (وهذا صحيح — أسرار لكل مستأجر). كل تطبيق فلاتر هنا يحتاج .env خاصاً بانطلق ثم توليد env.g.dart عبر build_runner. لا تُنسخ أسرار سيرو. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
7.9 KiB
7.9 KiB
🎓 خطة التوتوريال الكامل داخل الموقع — «كيف تستخدم Siro»
الهدف: صفحات شرح تفاعلية داخل siromove.com (وداخل التطبيق لاحقاً) تشرح للمستخدم الجديد كل عملية خطوة بخطوة، مدعومة بلقطات شاشة حقيقية من التطبيق.
قاعدة التسمية للقطات: tutorial/{القسم}/{رقم الخطوة}_{وصف}.png
مثال: tutorial/booking/03_select_car_type.png
مواصفات اللقطات: جهاز حقيقي أو محاكي بدقة 1170×2532 (iPhone) أو 1080×2400 (Android)، واجهة عربية، وضع فاتح (+ نسخة داكنة اختيارية)، بيانات وهمية (لا أرقام هواتف حقيقية).
الوحدة 1: التسجيل وإنشاء الحساب (5 لقطات)
| # | الخطوة | الشاشة في الكود | اللقطة المطلوبة |
|---|---|---|---|
| 1 | تحميل التطبيق وفتحه | splash_screen_page.dart |
شاشة البداية بشعار Siro |
| 2 | شاشات التعريف | onbording_page.dart |
شريحة الـ Onboarding الأولى |
| 3 | إدخال رقم الهاتف | login_page.dart |
حقل الهاتف مع اختيار الدولة (🇯🇴🇪🇬🇸🇾) |
| 4 | رمز التحقق OTP | otp_page.dart |
شاشة إدخال الرمز (يصل واتساب/SMS) |
| 5 | إكمال البيانات | register_page.dart |
الاسم + البريد (اختياري) ثم «ابدأ» |
نص الشرح المرافق: التسجيل يحتاج رقم هاتف فقط — لا بريد إلكتروني إجباري ولا بطاقة دفع. أقل من دقيقة من التحميل حتى أول شاشة خريطة.
الوحدة 2: طلب الرحلة (6 لقطات)
| # | الخطوة | الشاشة في الكود | اللقطة المطلوبة |
|---|---|---|---|
| 1 | الخريطة الرئيسية | map_page_passenger.dart |
الخريطة مع السيارات القريبة تتحرك |
| 2 | تحديد الوجهة | LocationSearchController |
شريط البحث + النتائج |
| 3 | تأكيد نقطة الانطلاق | — | دبوس الانطلاق قابل للسحب |
| 4 | اختيار فئة السيارة | — | قائمة الفئات التسع مع سعر كل فئة وشارة «توفّر X% عن المنافسين» |
| 5 | كود الخصم (اختياري) | promos_passenger_page.dart |
حقل البرومو مطبّق على السعر |
| 6 | تأكيد الطلب | — | زر «اطلب الآن» مع السعر النهائي |
نقطة مهمة للشرح: السعر المعروض نهائي ومحسوب من الخادم — لا مفاجآت عند الدفع (ما لم تتغير الوجهة أو يزد الانتظار).
الوحدة 3: الانتظار والمطابقة (4 لقطات)
| # | الخطوة | الشاشة في الكود | اللقطة المطلوبة |
|---|---|---|---|
| 1 | البحث عن كابتن | searching_captain_window.dart |
نافذة البحث مع المؤقّت |
| 2 | اقتراح المفاوض الذكي | _showIncreaseFeeDialog() |
حوار «ارفع السعر 5% لنتائج أسرع» (يظهر بعد 90 ثانية) |
| 3 | قبول الكابتن | driver_card_from_passenger.dart |
بطاقة الكابتن: الاسم، الصورة، التقييم، السيارة، اللوحة |
| 4 | الكابتن في الطريق | driver_time_arrive_passenger.dart |
الخريطة مع مسار الكابتن الأصفر والوقت المتوقع |
نص الشرح: متوسط زمن المطابقة أقل من 90 ثانية. إذا لم يقبل أحد، النظام يقترح تعديلاً بسيطاً على السعر بدل إلغاء طلبك.
الوحدة 4: أثناء الرحلة والسلامة (5 لقطات)
| # | الخطوة | الشاشة في الكود | اللقطة المطلوبة |
|---|---|---|---|
| 1 | وصول الكابتن | driverArrivePassengerDialoge() |
إشعار «الكابتن وصل» + مهلة انتظار 5 دقائق |
| 2 | بدء الرحلة | ride_begin_passenger.dart |
المسار الأزرق + العداد الحي |
| 3 | مشاركة الرحلة | شاشة المراقبة الحية | رابط متابعة لطرف ثالث (للأهل) |
| 4 | زر الطوارئ SOS | — | زر SOS + شرح «هزّ الهاتف 5 مرات» |
| 5 | الاتصال بالكابتن | WebRTC داخلي | شاشة المكالمة داخل التطبيق (بدون كشف رقمك) |
الوحدة 5: الإلغاء (3 لقطات)
| # | الخطوة | الشاشة في الكود | اللقطة المطلوبة |
|---|---|---|---|
| 1 | زر الإلغاء | timer_for_cancell_trip_from_passenger.dart |
مكان الزر أثناء البحث/الانتظار |
| 2 | اختيار السبب | cancelRide/add.php |
قائمة أسباب الإلغاء |
| 3 | تأكيد الإلغاء | — | رسالة التأكيد + سياسة الرسوم |
نقاط يجب شرحها بوضوح:
- الإلغاء قبل قبول الكابتن: مجاني دائماً.
- الإلغاء بعد وصول الكابتن أو تجاوز المهلة: قد تُطبَّق رسوم.
- سياسة السائق: 3 إلغاءات متتالية = إيقاف مؤقت (شفافية للطرفين).
الوحدة 6: الدفع والتقييم (6 لقطات)
| # | الخطوة | الشاشة في الكود | اللقطة المطلوبة |
|---|---|---|---|
| 1 | نهاية الرحلة | processRideFinished() |
شاشة الفاتورة النهائية |
| 2 | اختيار طريقة الدفع | payment_method.page.dart |
القائمة: كاش/محفظة/بطاقة/MTN/Syriatel/Cliq |
| 3 | الدفع كاش | cash_confirm_bottom_page.dart |
حوار تأكيد الكاش |
| 4 | الدفع بالمحفظة | passenger_wallet.dart |
الخصم من الرصيد + شاشة الشحن بمكافأة («ادفع 20 خذ 21») |
| 5 | تقييم الكابتن | rate_captain.dart |
النجوم + الإكرامية (Tip) |
| 6 | سجل الرحلات | order_history.dart |
قائمة الرحلات السابقة والفواتير |
الوحدة 7: مواصلاتي — للطلاب (5 لقطات)
| # | الخطوة | الشاشة | اللقطة المطلوبة |
|---|---|---|---|
| 1 | تبويب مواصلاتي | siro_rider تبويب Transit |
اختيار الجامعة |
| 2 | تفعيل العضوية | — | إدخال الرقم الجامعي (تفعيل فوري إذا كان بالكشف) |
| 3 | استعراض الخطوط | — | قائمة الخطوط المعتمدة وجداولها |
| 4 | التتبع الحي | خريطة الخط | الباص يتحرك على المسار + المحطات |
| 5 | «فاتك الباص؟» | زر التحويل | الزر البارز لطلب سيارة بديلة |
خطة التنفيذ على الموقع
- الصفحة:
siromove.com/tutorial— صفحة واحدة بتبويبات (وحدة لكل تبويب)، RTL، بنفس هوية تقرير الإرث الرقمي البصرية. - العرض: لكل خطوة سطر شرح + لقطة شاشة داخل إطار هاتف (CSS phone frame) — حتى تجهز اللقطات، توضع صور Placeholder رمادية بنفس اسم الملف المطلوب.
- التصوير: جلسة واحدة (~ساعتان) بحساب تجريبي على بيئة staging تنتج الـ 34 لقطة المذكورة أعلاه دفعة واحدة، بالترتيب أعلاه.
- لاحقاً: تحويل كل وحدة إلى فيديو قصير (30-60 ثانية) بنفس اللقطات، ودمج التوتوريال داخل التطبيق كـ Coach Marks عند أول استخدام.
إجمالي اللقطات المطلوبة: 34 لقطة (5+6+4+5+3+6+5)