02

تطبيقات الجوال، قرار واحد لكل شاشة

التصميم للجوال يجعل كل قرار مرئيًا. المساحة الضيّقة تُجبر التسلسل والتنقّل والتفاعل على استحقاق مواضعها. أستكشف iOS وAndroid كعمل واحد — مفاهيم واجهات ونماذج أوّلية تعمل، تعامل التصميم والبناء بوصفهما تخصّصًا واحدًا.

شاشة هاتف عليها واجهة مرصوصة، رمزًا للعمل على واجهات الجوال.
المنصّات
iOS وAndroid. التصميم والبناء العمل نفسه، ينجزه الشخص نفسه.
المنهج
محدَّد قبل أن يبدأ، مُراجَع أثناء سيره، مُنجَز لا متروك.
الحالة
مفاهيم واجهات ونماذج أوّلية — لا يوجد بعد تطبيق منشور في متجر.
سهولة الوصول
مبنيّ وفق ممارسة WCAG 2.1 AA — حجم حرف ديناميكي، وتباين مفحوص، وتسمية لكل عنصر تحكّم.
المصدر
النماذج الأوّلية والمصدر في مكان واحد أثناء البناء.

ما هذا

الشاشات، وكل ما يقرّرها

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

معظم كلفة التطبيق ليست في رسمه، بل في القرارات المتّخذة قبل رسم أي شيء، وفي الحالات التي لا تظهر إلّا حين يسوء شيء ما.

مسارات لا شاشات

الأسهم هي العمل التصميمي

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

إبهام واحد

العنصر المهم حيث تصل اليد

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

حجم حرف ديناميكي

القارئ اختار حجم نصّه من قبل

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

محليًّا أولًا

الجهاز يحمل الحقيقة حتى يمكن سؤال الخادم

العمل في القطار عمل أيضًا. ما حُفِظ محليًّا يُعرَض محفوظًا، وما لم يبلغ الخادم يُعرَض معلّقًا، ولا يتظاهر أحدهما بأنه الآخر.

منصّتان

تصميم واحد، ومجموعتا أعراف

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

الإطلاق

الخطوة الأخيرة طابور شخص آخر

ابنِ، ثم قدّم، ثم انتظر. إعداد بطاقة المتجر وتمرير الطلب تخصّص صغير قائم بذاته، وعملية المراجعة لن تسمح بكل شيء — وهذا يُعلَّم مبكرًا بدل الجدال حوله لاحقًا.

الحالات

للشاشة الواحدة خمس حالات. أربع منها تُقفَز.

يكاد كل تطبيق يُصمَّم في الحالة التي نجح فيها كل شيء: وصل المحتوى، وكانت الشبكة موجودة، والحساب قائمًا. أمّا الأربع الأخرى فهي حيث يقرّر الناس فعلًا إن كانوا سيُبقونه. الخمس جميعًا تُرسَم قبل بناء أي شيء.

  1. 01

    فارغة — قبل أن يكون فيها شيء

    أول شاشة يراها الجميع تقريبًا، وأقلّها تصميمًا. عليها أن تقول لماذا وُجد هذا، وأن تعطي شيئًا واحدًا بالضبط يُفعَل بعده.

  2. 02

    قيد التحميل — بينما لا يزال يفكّر

    مشكَّلة على هيئة ما هو قادم، حتى لا يقفز التخطيط عند وصوله. مؤشّر دوّار في وسط شاشة فارغة لا يقول للقارئ شيئًا سوى: انتظر.

  3. 03

    محتوى — الحالة التي يرسمها الجميع

    تلك التي في العرض التقديمي. هي أسهل الخمس، وهي سبب القفز عن الأربع الأخرى.

  4. 04

    خطأ — حين يسوء شيء فعلًا

    ما الذي أخفق، بالكلمات، وما العمل حياله. لا رمز أبدًا، ولا هزّ كتفين، ودائمًا طريق للعودة ليس هو الإغلاق القسري.

  5. 05

    بلا اتّصال — حين تنقطع الشبكة

    جملة صادقة واحدة لكل شاشة. المخزّن يبقى مقروءًا ومعلَّمًا بأنه مخزّن؛ وما يحتاج اتّصالًا يقول ذلك. المؤشّر الدوّار الذي لا ينتهي هو سبب حذف التطبيقات.

الطريقة

خمسة قرارات، قبل رسم أي شاشة

كل تطبيق يستحقّ الإقدام عليه يبدأ بهذا التسلسل، مكتوبًا ومُجادَلًا فيه ما دام الجدال بلا كلفة. يستغرق بعد ظهيرة واحدة، وهو أرخص بعد ظهيرة في المشروع.

  1. ما الشيء الواحد الذي يفعله هذا التطبيق؟ وكل ما عداه إعداد. الجدال حول ماهية هذا الشيء الواحد يحدث الآن، على الورق، حيث لا يكلّف تغيير الرأي شيئًا.
  2. ماذا يستطيع أحدهم أن يفعل قبل تسجيل الدخول؟ تسجيل الدخول ثمن يُطلب من الناس قبل أن يعرفوا ما الذي يشترونه. اطلبه مبكرًا جدًا يصبح التنزيل هو محطة التوقّف.
  3. ماذا تقول كل شاشة بلا اتّصال؟ كل شاشة تحتاج جملة صادقة واحدة لحين انقطاع الشبكة.
  4. ما أصغر نسخة كاملة؟ تلك التي يمكنك وضعها هذا الشهر أمام عشرة أشخاص حقيقيين — لا تلك التي رُسمت فيها كل شاشة.
  5. لمن هذه الحسابات؟ حسابات المطوّرين وبطاقات المتاجر ومفاتيح التوقيع تنتمي إلى مكان واحد منذ البداية، فلا يُضطرّ أحد إلى فكّ تشابكها لاحقًا.

ما أفحصه

ما هو جزء من العمل، وما أتركه لمشروع آخر

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

جزء من العمل

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

خارج هذا الاستكشاف

  • خادم خلفي غير موجود أصلًا — استكشاف قائم بذاته، لا يُفترض ضمنًا داخل هذا أبدًا.
  • العمل المستمرّ على الميزات بعد النموذج الأوّلي.
  • رسوم المتاجر وأي خدمة طرف ثالث — كلٌّ منها استكشاف قائم بذاته.
  • المحتوى والتصوير والفيديو والنصّ بما يتجاوز مسوّدة أولى ومراجعة واحدة.
  • أي شيء لا تسمح به عملية مراجعة المنصّة. يمكن تعليمه مبكرًا؛ ولا يمكن نقضه.
  • تقديم فعلي عبر طابور مراجعة متجر تطبيقات.
  • أي ادّعاء بشأن التنزيلات أو التقييمات أو أداء المتجر. هذه نماذج مفاهيمية، لا منتجات مُطلَقة.

الأسئلة

مُجابٌ عنها لا متهرَّبٌ منها

لماذا يستغرق التفكير في تطبيق وقتًا أطول بكثير من التفكير في موقع؟

لأنّ تطبيقين يُوصَفان بالجملة نفسها قد يفترقان بمرتبة كاملة في التعقيد الفعلي، وعدد الشاشات وحده يخفي معظم ذلك.

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

لا يوجد تطبيق في المجموعة بعد. فماذا تُثبت المواقع العشرة إذًا؟

بعض ما يحتاجه التطبيق، لا كلّه — ويستحقّ الأمر الدقّة في تحديد أيّهما أيّ، بدل طمس الفرق.

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

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

الأعمال

ما تستطيع فحصه اليوم

لا واحد من هذه تطبيق. إنّها عمل التفاعل الذي يتكوّن منه التطبيق، وكلّها بمبادرة ذاتية، ولكلٍّ منها نسخة حيّة وتقرير يقول ما الذي قاوم.

واجهة مرسومة، بلا أصول جاهزة، 2022

Brightloop

حلقات تقدّم وعدّادات مرسومة بـ SVG بدل إرسالها صورًا، على مراقب واحد مشترك بدل مراقب لكل عنصر.

لمس ومؤشّر، 2024

Noctis Studio

Pointer capture منجَز كما ينبغي — سحبٌ لا ينكسر حين يغادر الإصبع العنصر، وهو العطب الذي يُطلَق به كل شريط تمرير مصنوع يدويًا.

واجهة كاملة بلوحة المفاتيح، 2026

Signalform

لوحة أوامر تتصرّف كلوحة أوامر: التركيز محتجَز ما دامت مفتوحة، ومفاتيح الأسهم، والتمرير مقفل، والتركيز يُعاد عند الإغلاق.

شاهد الأعمال العشرة كلّها — كلّها بمبادرة ذاتية، وكلّها حيّة، وكلّها بمصدر مفتوح للقراءة.

تطبيقات الجوال

انظر إليه في الأعمال العشرة

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

من فضلك أدر جهازك،
هذا الموقع مبني عموديًا.