إن قيادة سفينة استكشاف المحيط أو مكوك استكشاف المريخ هو عمل جاد. من المأمول أن تكون لوحة القيادة بأعلى جودة. اثنين من المسامير عريضة ، منحدر 45 درجة ، قطعة Lego الشائعة "2x2 منحدر مزخرف" هي واجهة مجموعة اللعب هذه ، وتربطها بالخارج.
هذه الأعمال الفنية الأسطورية منخفضة الدقة هي الأداة المثالية لتعلم أساسيات تصميم الواجهة. دعونا نسلح أنفسنا بـ 52 لبنة ونرى ما يمكن أن نتعلمه عن تصميم وتخطيط وتنظيم الواجهات المعقدة.
مرحبًا بك في عالم تجربة Lego المخصصة.
فوضى منظمة
للوهلة الأولى ، قد يكون تنوع الصور محيرًا ، لكن سرعان ما يتضح أن بعض الواجهات تبدو فوضوية أكثر من غيرها. معظم الواجهات في العالم الحقيقي هي مزيج من الشاشات الرقمية وأجهزة الإدخال التناظرية مثل المفاتيح والأقراص. تتبع لوحات Lego نفس المبدأ.
إذا وضعت الألواح على محورين ، "منظم بشكل فوضوي" (من أسفل إلى أعلى) و "لوحة كاملة بدون شاشة" (من اليسار إلى اليمين) ، فستحصل على عدة مجموعات منفصلة. في الجزء العلوي الأيسر ، ستكون هناك شاشات مدمجة بصف من الأزرار. في أعلى اليمين توجد مجموعة صغيرة من لوحات التبديل عالية التنظيم. الجزء السفلي من المركز مشغول بمفاهيم غير عادية يصعب فهمها.
يعد تطوير واجهة معقدة للآلة عبارة عن تلاعب بالعديد من العوامل المختلفة ، من بيئة العمل إلى الاعتبارات الهندسية. ومع ذلك ، يمكننا تقسيم هذه المشكلة إلى سؤالين رئيسيين:
- كيف تفرق بين وظائف أجهزة الإدخال المختلفة؟
- كيف تنظم العديد من أجهزة الإدخال والإخراج بحيث تكون علاقتها واضحة؟
دعنا نلقي نظرة فاحصة على إجابات هذه الأسئلة في Lego.
تمييز أجهزة الإدخال
لماذا يبدأ 400 طيار خلال الحرب العالمية الثانية في إزالة معدات الهبوط على قاذفة B-17 قبل الهبوط مباشرة؟ هل هذا خطأ بشري كارثي أم شيء أكثر جوهرية؟
كان عالم النفس ألفونيس شابانيس أول من اقترح أن عددًا كبيرًا من عمليات الإنزال غير الناجحة قد يكون بسبب واجهة سيئة التصميم. تم وضع أدوات الهبوط ومقابض التحكم في الرفرف جنبًا إلى جنب ولها نفس الشكل. ببساطة لم يكن لدى الطيارين أي فرصة.
Belly B-17 وترميز الوظائف حسب الشكل مما يجعل من الممكن تجنب المشاكل
كان الحل المؤقت الذي اقترحه هو لصق شرائح مطاطية بأشكال مختلفة لكل قبضة ، مما يسمح لك بالتحكم في الطائرة عن طريق اللمس. نتيجة لذلك ، ولدت فكرة الترميز بالشكل ، ولا يزال نظام التمايز يتبع في تصميم كبائن الطائرات.
دعنا نقارن الواجهات الثلاثة الموضحة أدناه لنرى كيف يعمل هذا. تجاهل التخطيط العام للعناصر - في الوقت الحالي ، تعد الأزرار الفردية مهمة بالنسبة لنا. تخيل أنك تحاول مسك أحدهم دون النظر. عند العمل باللوحة اليسرى ، "المنحدر 45 2 × 2 مع 12 زرًا" ، ستحتاج إلى تنسيق دقيق بين اليد والعين. في الجزء الأيمن ، التحكم في الطيران المتعدد للطائرات ، يتم التمييز بشكل واضح بين عصا التحكم (حركة عمودية تجتاح في خط مستقيم) ، والمفاتيح (مفاتيح تبديل عمودية مستديرة) ، والأزرار (المربعات).
من اليسار إلى اليمين: التمييز القبيح والسيئ وغير السيئ بين عناصر التحكم
يظل هذا التمييز مشكلة خطيرة حتى يومنا هذا. استدعت شركة فورد 13500 سيارة كروس أوفر في عام 2015لينكولن MKC ، لأن السائقين ، عند السفر بسرعة عالية على الطريق السريع ، يغلقون المحرك باستمرار عن طريق الخطأ أثناء محاولة تنشيط الوضع الرياضي. هل يمكنك أن تفهم لماذا حدث هذا؟
لوحة تحكم Ford Lincoln MKC قبل تحريك زر تشغيل / إيقاف المحرك.
يعد ترميز دالة حسب النموذج أحد أساليب التمايز ، ولكن هناك طرق أخرى. في حياتنا اليومية ، نسمع فقط عن الترميز اللوني. لكن هناك أشياء أخرى: الترميز حسب الحجم والملمس والموقع وطريقة العمل. كل هؤلاء الستة هم حلفاء لنا في تصميم واجهات مقاومة للأخطاء.
ست طرق أساسية لتشفير وظيفة. لاحظ كيف أن بعض الأمثلة المقدمة تستخدم خيارات تشفير متعددة في نفس الوقت.
من اليسار إلى اليمين ، من أعلى إلى أسفل: الحجم والشكل واللون والملمس والموقع وطريقة العمل.
يعتمد على طرق ترميز الحجم واللون والشكل - فهي تتيح لك حل العديد من مشكلات الواجهة بسرعة. يعتبر الملمس أيضًا رائعًا للعمل الأعمى - خاصةً في الغزال الضحل للضبط الدقيق.
يبدو ترميز التخطيط شيئًا واضحًا ، لكنه غالبًا لا يستخدم على أكمل وجه. يمكن للأجهزة ذات الشكل المريح الواضح (مثل المنظار أو وحدة التحكم في اللعبة) استخدام الوضع الطبيعي لليدين للتمييز بين الإجراءات الأولية والثانوية.
أخيرًا ، يعين تشفير العمل أنواعًا مختلفة من الحركة لأجهزة الإدخال المختلفة (مثل التمحور أو الانزلاق العمودي). يمكن أن يعمل هذا النهج بشكل رائع عندما يتطابق نوع حركة جهاز الإدخال مع العملية التي يتحكم فيها - على سبيل المثال ، ترفع الرافعة حمولة عند رفع الرافعة.
ستة أنواع مختلفة من الترميز في واجهات Lego (من اليسار إلى اليمين ، من أعلى إلى أسفل): الحجم والشكل واللون والملمس والموضع وطريقة العمل.
التمايز هو خطوة أولى جيدة لتجنب الخلط بين المفاتيح المجاورة. ومع ذلك ، فإن التنظيم الجيد فقط لأجهزة الإدخال سيسمح لنا بنقل نماذج عقلية واضحة ودقيقة للواجهات للمستخدم.
تنظيم أجهزة الإدخال
قارن اللوحات الثلاثة التالية. تخطيط عناصر التحكم متطابق ، لكن الشريط الأزرق يبدو أكثر وضوحًا من الشريط الأبيض. تعمل مبادئ الجشطالت هنا ، وتجمع بين الكيانات ذات الصلة في منطقة واحدة.
التمايز الأساسي عن طريق طريقة التجميع
بسيط للغاية. ولكن كيف نقرر أجهزة الإدخال التي يجب تجميعها؟
أحب استخدام لوحات التحكم السوفيتية كنقطة انطلاق . هذه الجدران الجميلة من التقلبات والانعطافات الطائشة تنبض بالحياة ، منظمة في مخططات مصانع عملاقة سيكون من الصعب التفكير في تنظيم أكثر حرفية للمعلومات.
أود أن أسمي هذه اللوحات واجهة موحدة. يتم جمع جميع عناصر المدخلات والتعليقات في لوحة واحدة. هذا النهجاختار دايسون لسيارته . تخيل الآن المثال المعاكس - قمنا بنقل كل هذه المفاتيح والأضواء إلى مواقع الصمامات الفعلية في المصنع. تبدو سخيفة - ومع ذلك ، تُظهر شبكات التهوية في Audi TT أن النهج الموزع يمكن أن يكون رائعًا أيضًا للمستخدمين لقد كتبت بإسهاب عن الواجهات الموزعة العام الماضي.
لوحات سيارات Lego: واجهة موزعة (يسار) مقابل مدمجة (يمين)
لنعد إلى المصانع السوفيتية. كانت لوحات الواجهة الخاصة بهم ممتازة في الإجابة على السؤال ، "هل يسمح هذا الصمام للماء بدخول الخزان B؟" ومع ذلك ، لم يكونوا مناسبين تمامًا للعثور على إجابة لسؤال مثل "هل جميع صمامات المياه مغلقة؟" أو "أين توجد جميع المفاتيح التي أحتاجها للتحضير لنقل النقل؟"
يستخدم Lego النهج السوفيتي للوحات رائعة ، لأن التخطيطي ينقل بشكل مثالي النموذج العقلي لكيفية عمل نظام شخص آخر. ومع ذلك ، بالنسبة للاستخدام اليومي ، هناك العديد من الأساليب الأخرى الأكثر ملاءمة. واجهات Lego's Insectoid و UFO. أتساءل عن سبب مسؤولية هذه الأزرار بالضبط؟
فلسفة التصميم الأكثر شيوعًا ، والتي يمكن تسميتها على الأرجح بالفلسفة "الافتراضية" ، هي التنظيم القائم على الوظيفة. قم بتجميع جميع أجهزة الإدخال والإخراج لكل ميزة من ميزات المنتج. سيكون جهاز التنفس الصناعي لفيروس كورونا القادم من Cambridge Consultants مثالًا رائعًا على هذا النهج - ومع ذلك ، غالبًا ما نرى ذلك في السيارات أيضًا ، عند تجميع مجموعات من أجهزة الإدخال للتحكم في التهوية ، ووضع جميع عناصر التحكم على المصابيح الجانبية على رافعة واحدة.
جهاز التنفس الصناعي لفيروس كورونا من Cambridge Consultants مع تنظيم وظيفي واضح.
طريقة تنظيم التشغيل تضع جميع المفاتيح التي تعمل بطريقة معينة في مكان واحد. ليس لدي أي فكرة عن الغرض من كل هذه الصمامات في الصورة ، لكنني أراهن أنه ليس كلهم يفتحون الأشياء ذات الصلة. في كل مرة ترى سلسلة من المفاتيح تبدو وتعمل بالطريقة نفسها ، ولكنها تتحكم في أجزاء متباينة من النظام ، فأنت تواجه طريقة لتنظيم العمل.
معظم الواجهات اليوم هي في الأساس أنظمة تحكم تطير بالسلكومع ذلك ، من الناحية التاريخية ، فإن الرافعة التي سحبتها ، على سبيل المثال ، أثناء وجودك في كابينة الجرار ، تحركت بالفعل المكابس الهيدروليكية الموجودة أسفل المقعد. يمكن أن يؤدي حل كل هذه الأنظمة الكهربائية والميكانيكية والهيدروليكية المختلفة إلى إلحاق ضرر جسيم بتجميع الواجهة ويؤدي إلى مؤسسة تقنية.
المعادل الحديث لهذا النهج شائع بشكل مدهش. يتم استخدامه بواسطة أي شاشة تعمل باللمس مع وجود أزرار بجانبها. في المستقبل ، قد تضع SpaceX عناصر التحكم المادية هذه بجوار المعلومات التي تؤثر عليها ، لكنها تجلس في الوقت الحالي بشكل محرج بجوار الشاشة ، كما لو كان ينبغي لها ذلك.
بوب ودوغ في كبسولة سبيس إكس دراجون
في Lego ، نلتقي مع منظمة قائمة على الميزات في الشاشة مع لوحة نمط -19 درجة. مجموعتان واضحتان من عناصر التحكم - ربما للتحكم في درجة الحرارة وتتبع العلامات الحيوية. لا أعرف ما الذي تفعله كل هذه المفاتيح في اللوحة الثانية ، ولكن تم تجميعها بوضوح حسب طريقة التشغيل ، وليس حسب الوظيفة.
هناك العديد من لوحات Lego مع نفس الفصل التكنولوجي الذي شوهد في كبسولة SpaceX Dragon ، لكني أحب أن أتخيل كيف كان على وحدة الشرطة هذه من أوائل التسعينيات فصل تشغيل الصوت والفيديو ، نظرًا لأن تقنية reel-to-reel الجديدة كانت غير متوافقة مع خط الهاتف التناظري. تعمل منظمة التكنولوجيا هنا.
من اليسار إلى اليمين: التنظيم حسب الوظيفة وطريقة التشغيل والتكنولوجيا والمواقف
حتى الآن ، تم ربط جميع مناهجنا - التنظيم حسب الوظيفة أو طريقة التشغيل أو التقنية - بخصائص النظام ، وليس المستخدم. بديل لذلك هو التنظيم حسب حالات الاستخدام - التجميع حسب المهام اليومية للمستخدم.
تخيل وصول العمال إلى مصنع Lego كل صباح لمسح الناس. تجميع عناصر التحكم حسب المهمة (تحضير السيارة ، وتحميل الجسم ، وبدء الفحص) يعني فصل أزرار الإشعاع والماسح الضوئي في العديد من مناطق اللوحة. سيكون الأمر أكثر صعوبة على الكمبيوتر ، ولكنه أكثر ملاءمة للمشغل. سيقرر المطور والمستخدمون فقط ما هو الأفضل لهم.
لكن أي واجهة أفضل؟
غالبًا ما أقول إنه لا يمكن أن تكون هناك واجهة أفضل ، لكن هناك الكثير من الأمثلة لأسوأ الواجهات.
ومع ذلك ، لدي ثلاثة أمثلة مفضلة. تخطيط لطيف ومفهوم بصريًا لعناصر التحكم مع تمييز جيد لأجهزة الإدخال وتنظيم بسيط وواضح. سأجلس بفخر في أي من هذه الوحدات:
