مسارات، لا شاشات
الأسهم هي عمل التصميم
الشاشة سهلة الرسم ورخيصة الجدال. ما يقرّر جودة التطبيق هو الطريق بين الشاشات، وما يحدث على الفرع الذي لم يرغب أحد في التفكير فيه.
انتقل إلى كيفية تحديد نطاق التطبيق
التخصّصات 02 · تطبيقات الجوّال
تطبيقات الجوّال، قرار واحد لكل شاشة
تصميم الجوّال يجعل كل قرار مرئيًا. المساحة المحدودة تُجبر التسلسل الهرمي والتنقّل والتفاعل على استحقاق مكانها. أستكشف iOS وAndroid كعملٍ واحد — مفاهيم واجهات ونماذج أوّلية عاملة تتعامل مع التصميم والبناء كتخصّص واحد.
- المنصّات
- iOS وAndroid. التصميم والبناء عملٌ واحد، يقوم به الشخص نفسه.
- المنهج
- يُحدَّد نطاقه قبل البدء، ويُطوَّر بالتكرار في أثنائه، ويُنجَز بدل أن يُهجَر.
- الحالة
- مفاهيم واجهات ونماذج أوّلية — لا تطبيق منشور في المتاجر بعد.
- إتاحة الوصول
- مبني وفق ممارسة WCAG 2.1 AA — حجم خط ديناميكي، وتباين مُتحقَّق منه، وتسمية على كل عنصر تحكّم.
- المصدر
- النماذج الأوّلية والمصدر محفوظة في مكان واحد في أثناء البناء.
01 · ما هذا
الشاشات، وكل ما يقرّرها
تطبيقٌ يفتحه الناس على الهاتف: الواجهة، والمسارات بين الشاشات، والحالات التي لا يتذكّر أحد أن يرسمها، والقرارات الميكانيكية الصغيرة التي تجعله يبدو كأنه ينتمي إلى الجهاز لا إلى موقعٍ جرى ضغطه. التصميم والبناء هنا عملٌ واحد لا عملان — وهو ما يظهر أثره غالبًا عند الوصلات، لأن الوصلات هي حيث يفقد التسليمُ الأشياء.
معظم كلفة التطبيق ليست في رسمه، بل في القرارات المتَّخذة قبل رسم أي شيء، وفي الحالات التي لا تظهر إلا حين يسوء شيء ما.
إبهام واحد
عنصر التحكّم المهم حيث تصل اليد
الهاتف يُمسَك، بيدٍ واحدة غالبًا، وبطريقة سيئة في أحيان كثيرة. الإجراء الأساسي يقع داخل القوس الذي يغطّيه الإبهام؛ والإجراء الإتلافي يقع خارجه عمدًا.
خط ديناميكي
القارئ اختار حجم نصّه مسبقًا
أحدهم ضبط ذلك في إعدادات نظامه لسبب. التخطيطات مبنية لتنمو معه لا لتقتطعه، وهذا أكثر إخفاقات إتاحة الوصول شيوعًا على الهاتف.
محلّي أولًا
الجهاز يحمل الحقيقة إلى أن يتسنّى سؤال الخادم
العمل المنجَز في القطار يبقى عملًا. ما حُفظ محليًا يظهر محفوظًا، وما لم يصل إلى الخادم يظهر معلَّقًا، ولا يتظاهر أحدهما بأنه الآخر.
منصّتان
تصميم واحد، ومجموعتان من الأعراف
الرجوع إيماءةٌ في إحداهما وشريطٌ في الأخرى؛ والإجراء الأساسي يجلس في مكان مختلف. مجاراة المنصّة ليست تنازلًا عن التصميم، بل جزء منه.
الإصدار
الخطوة الأخيرة طابورُ شخصٍ آخر
بناء، ثم إرسال، ثم انتظار. تجهيز صفحة المتجر ومرافقة الطلب خلال المراجعة تخصّصٌ صغير قائم بذاته، وعملية المراجعة لن تسمح بكل شيء — وهذا يُشار إليه مبكرًا بدل مجادلته.
02 · الحالات
للشاشة الواحدة خمس حالات، وأربع منها تُتجاهَل.
يكاد كل تطبيق يُصمَّم في الحالة التي نجح فيها كل شيء: المحتوى وصل، والشبكة موجودة، والحساب قائم. الحالات الأربع الأخرى هي حيث يقرّر الناس فعلًا هل يُبقون التطبيق. الحالات الخمس كلها تُرسَم قبل بناء أي شيء.
- 01
فارغة — قبل أن يكون فيها شيء
الشاشة الأولى التي يراها الجميع تقريبًا، والتي لا يصمّمها أحد تقريبًا. عليها أن تقول ما الغاية من هذا، وأن تعطي شيئًا واحدًا بالضبط يُفعَل تاليًا.
- 02
تحميل — بينما لا يزال يفكّر
مُشكَّلة على هيئة ما هو قادم، حتى لا يقفز التخطيط عند وصوله. مؤشّر دوّار في منتصف شاشة فارغة لا يقول للقارئ شيئًا سوى أن ينتظر.
- 03
المحتوى — الحالة التي يرسمها الجميع
تلك التي في عرض التقديم. هي الأسهل بين الخمس، وهي سبب تجاهُل الأربع الأخرى.
- 04
خطأ — حين يسوء شيء فعلًا
ما الذي فشل، بالكلمات، وما العمل حياله. لا رمز أبدًا، ولا هزّة كتف، ودائمًا طريقُ عودةٍ لا يكون إغلاق التطبيق قسرًا.
- 05
دون اتصال — حين تغيب الشبكة
جملة صادقة واحدة لكل شاشة. ما هو مخزَّن مؤقتًا يبقى مقروءًا ومُعلَّمًا بذلك؛ وما يحتاج اتصالًا يقول ذلك. المؤشّر الدوّار الذي لا يُحسَم أبدًا هو سبب حذف التطبيقات.
03 · المنهج
خمسة قرارات قبل رسم أي شاشة
كل تطبيق يستحقّ العمل عليه يبدأ بهذا التسلسل، مكتوبًا ومُجادَلًا فيه ما دام الجدال بلا كلفة. يستغرق الأمر عصر يومٍ واحد، وهو أرخص عصر يومٍ في المشروع.
- ما الشيء الواحد الذي يفعله هذا التطبيق؟ كل ما عداه إعداد. والجدال حول أيّ شيءٍ هو يجري الآن، على الورق، حيث تغيير الرأي لا يكلّف شيئًا.
- ماذا يستطيع المرء أن يفعل قبل تسجيل الدخول؟ تسجيل الدخول ثمنٌ يُطلَب من الناس قبل أن يعرفوا ما يشترون. اطلبه مبكرًا أكثر من اللازم، فيتوقّفون عند التنزيل.
- ماذا تقول كل شاشة دون اتصال؟ كل شاشة تحتاج جملة صادقة واحدة لحين غياب الشبكة.
- ما أصغر نسخة مكتملة؟ تلك التي يمكنك وضعها أمام عشرة أشخاص حقيقيين هذا الشهر — لا تلك التي رُسمت فيها كل شاشة.
- لمن هذه الحسابات؟ حسابات المطوّر وصفحات المتاجر ومفاتيح التوقيع مكانها واحد من البداية، حتى لا يلزم فكّ تشابك شيءٍ لاحقًا.
04 · ما الذي أختبره
ما يدخل في البناء، وما أتركه لمشروع آخر
الحجم نفسه والوزن نفسه للعمودين كليهما. معرفة حدود البناء قرارُ تصميمٍ بقدر أي شيء داخلها.
جزء من البناء
- القرارات الخمسة أعلاه، مكتوبةً ومحسومةً قبل رسم أي شيء.
- الواجهة والمسارات، تُستكشف وتُبنى كعمل واحد.
- كل حالة مرسومة، بما فيها الفارغة والخطأ ودون اتصال.
- إتاحة الوصول ممارسةَ بناء — حجم خط ديناميكي مُحترَم، وتباين مُتحقَّق منه، وتسمية على كل عنصر تحكّم، وحركة تتبع إعداد النظام.
- صفحة متجر مُشتغَل عليها كتمرين تصميم، من أولها إلى آخرها.
- نماذج أوّلية ومصدر مُرتَّبان منذ الأسبوع الأول.
- المصدر كاملًا، مقروءًا من أوله إلى آخره.
- تكرار حقيقي، لا مسوّدة أولى سُمّيت نهائية.
خارج هذا الاستكشاف
- خادمٌ خلفي غير موجود أصلًا — استكشافٌ قائم بذاته، لا يُفترَض داخل هذا أبدًا.
- عمل ميزات مستمر بعد النموذج الأوّلي الأول.
- رسوم المتاجر وأي خدمة من طرف ثالث — كلٌّ منها استكشاف قائم بذاته.
- المحتوى والتصوير والفيديو، والنصوص بعد مسوّدة أولى ومراجعة واحدة.
- أي شيء لن تسمح به عملية مراجعة المنصّة. يمكن الإشارة إليه مبكرًا؛ ولا يمكن تجاوزه.
- تقديم فعلي عبر طابور مراجعة متجر تطبيقات.
- أي ادّعاء بشأن التنزيلات أو التقييمات أو أداء المتجر. هذه نماذج أوّلية لمفاهيم، لا منتجات مطروحة.
05 · الأسئلة
أجوبة لا مراوغة
لماذا يستغرق التفكير في تطبيق وقتًا أطول بكثير من موقع ويب؟
لأن تطبيقين يوصفان بالجملة نفسها قد يفصل بينهما في التعقيد الفعلي عشرة أضعاف، وعدد الشاشات وحده يخفي معظم ذلك.
العوامل التي تحرّك ذلك ليست غامضة. كم شاشةً هناك فعلًا بعد عدّ الحالات الفارغة وحالات الخطأ. هل يُخزَّن شيء، وأين. هل عليه أن يخاطب نظامًا قائمًا أصلًا. هل هناك تسجيل دخول، وبالتالي حسابٌ يلزم استرداده. هل يذهب إلى متجر واحد أم إلى الاثنين. وكم يستغرق طابور المراجعة حين يصل إليه، وهو أمر لا يتحكّم فيه أحد. هذه الأسئلة الستة هي حيث يبدأ التفكير فعلًا.
لا تطبيق في المعرض بعد. فما الذي تثبته المواقع العشرة فعلًا؟
بعض ما يحتاجه التطبيق، لا كلّه — ويجدر التدقيق في أيّهما أيّ بدل طمس الفرق بينهما.
ما تثبته: عمل الواجهات، وتصميم المسارات، وانضباط لوحة المفاتيح وقارئ الشاشة، ورسم كل حالة لا الحالة السعيدة وحدها، وعادة تدوين سبب كل قرار اتُّخذ. وما لا تثبته: تقديم المتاجر، وتشظّي الأجهزة، وإصدارًا ينتهي في طابور مراجعة شخصٍ آخر. الاختبار الصادق أن تفتح أيًّا من البنى العشر وتقرأ كود تفاعلها — لماذا يذهب التركيز حيث يذهب، وماذا يحدث على اتصال بطيء، وماذا يفعل مسار الحركة المخفَّضة ولماذا. هذا هو العمل نفسه، في متصفح بدل متجر، وهو يعمل الآن.
06 · الأعمال
ما يمكنك التحقق منه اليوم
لا شيء من هذه تطبيق. إنها أعمال التفاعل التي يُصنع منها التطبيق، وكلها مبادرات ذاتية، وكلٌّ منها حيٌّ ومعه سردٌ يقول ما الذي قاوم.
Signalform
واجهة مكتملة بلوحة المفاتيح · 2026. لوحة أوامر تتصرّف كما ينبغي للوحة أوامر: تركيزٌ ممسوك ما دامت مفتوحة، ومفاتيح أسهم، وتمريرٌ مقفل، وتركيزٌ يُعاد عند الإغلاق.
Noctis Studio
اللمس والمؤشّر · 2024. التقاط مؤشّر منفَّذ كما يجب — سحبٌ لا ينكسر حين يغادر الإصبع العنصر، وهي العلّة التي يُشحَن بها كلُّ منزلقٍ مكتوبٍ يدويًا.
Brightloop
واجهة مرسومة بلا أصول · 2022. حلقات تقدّم وعدّادات مرسومة بـ SVG بدل شحنها صورًا، على مراقبٍ واحد مشترك بدل مراقبٍ لكل عنصر.
شاهد البنى العشر — كلها مبادرات ذاتية، وكلها حيّة، وكلها بمصدر مفتوح.
تطبيقات الجوّال
شاهده في البنى العشر
لا تطبيق هنا بعد، لكن كل مبدأ في هذه الصفحة — الحالات، والمسارات، وانضباط لوحة المفاتيح وقارئ الشاشة — يعمل فعلًا في العشرة. والمشاريع تُظهر الانضباط نفسه مطبَّقًا.
دائمًا أستكشف الفكرة التالية.