تصميم واجهة مستخدم التلفزيون: العمل مع مساحة بيضاء

نشرت: 2022-03-11

يتطلب تصميم التلفزيون فهماً شاملاً ومنضبطًا لمبادئ تجربة المستخدم. أحد العناصر التي تثير قلقًا دائمًا عند تصميم التلفزيون هو استخدام المساحة البيضاء في التصميم. هناك الكثير من تطبيقات التلفزيون في السوق التي لا تعرف كيفية (أو تختار بوعي عدم القيام بذلك) لتسخير المساحة البيضاء بشكل صحيح. والنتيجة هي تشوش في العيون مما يقوض أهداف العمل.

فيما يلي شرح لماهية المساحة البيضاء وكيف أن استخدامها في تطبيق التلفزيون هو الأفضل للأعمال.

الفضاء الأبيض صديقنا

اولا في المقام الاول اولا قبل كل شي…

ما هي المساحة البيضاء؟

المساحة البيضاء عبارة عن قطعة غير مشغولة من العقارات مع عدم وجود نصوص أو رسومات في الأعلى.

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

الفضاء الأبيض ليس
الفضاء الأبيض ليس دائمًا أبيض فقط.

ما هي الصفقة الكبيرة؟

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

يصف قانون Hick ، ​​أو قانون Hick-Hyman ، الذي سمي على اسم عالم النفس البريطاني والأمريكي William Edmund Hick و Ray Hyman ، الوقت الذي يستغرقه الشخص لاتخاذ قرار نتيجة الخيارات المحتملة لديه: زيادة العدد من الاختيارات ستزيد من وقت القرار لوغاريتميًا.

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

بالنسبة للمصممين ، المساحة البيضاء هي المساحة السلبية على الصفحة التي توفر مساحة للتنفس البصري لعينيك.

يعرف المصممون أن المساحة البيضاء تساعد المستخدم على التركيز واستيعاب المحتوى الذي يريده أن يراه.

أراد مصممو واجهة المستخدم المستقلون المقيمون في الولايات المتحدة بدوام كامل

قل نعم للمساحة البيضاء

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

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

وفقًا لبحث أجرته Human Factors International ، تزيد المساحة البيضاء من فهم المستخدم بنسبة 20٪ تقريبًا.

دعونا نلقي نظرة على كيف تساعد المساحة البيضاء في إنشاء غرفة للتنفس ، وكيف يغير ذلك عملية صنع القرار.

يبدو أن واجهة التلفزيون مصممة للتسبب في القلق
يبدو أن واجهة التلفزيون مصممة للتسبب في القلق.


واجهة تلفزيون تحاول عمل الكثير في نفس الوقت
واجهة تلفزيون تحاول عمل الكثير في نفس الوقت.


حسن التنفيذ من الناحية الجمالية ولكن تفتقر إلى المسافة البيضاء بين المحتوى
حسن التنفيذ من الناحية الجمالية ولكن تفتقر إلى المسافة البيضاء بين المحتوى.


واجهة مع غرفة التنفس
واجهة مع غرفة التنفس.


واجهة تلفزيون ذات توازن جيد وتسلسل هرمي بين العناصر
واجهة تلفزيون ذات توازن جيد وتسلسل هرمي بين العناصر.


واجهة تلفزيون ذات توازن جيد وتسلسل هرمي بين العناصر
واجهة تلفزيون ذات توازن جيد وتسلسل هرمي بين العناصر.


أنظر لهذا؟

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

تقوم Hulu بعمل رائع في استخدام المساحة البيضاء في تطبيق Hulu Live الخاص بها. تحقق من صورة الخلفية الكبيرة المستخدمة بدلاً من فن الملصق التقليدي - إنها غامرة وجميلة المظهر. هذا مثال رائع على كيفية استخدام مساحة البيع بالتجزئة الضخمة المتاحة.

تجذبك Hulu بمساحة بيضاء غامرة
تجذبك Hulu بمساحة بيضاء غامرة.

تعمل المساحة البيضاء على تقليل الحمل المعرفي وتسريع عملية اتخاذ القرار. كما هو موضح بواسطة Fast Co Design ، فإن إضافة مساحة بيضاء تؤدي إلى أكثر من مجرد إزالة الفوضى - فهي تخدم هذه الوظائف الأساسية:

  • يحسن الفهم
  • يوضح العلاقات بين العناصر التفاعلية
  • يجذب انتباه المستخدمين ويركز عليه

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

استخدم قوة المساحة البيضاء للارتقاء بتصميماتك والمساعدة في اتخاذ القرار.

سيؤدي تقليل الحمل المعرفي إلى جعل واجهة المستخدم ليست أكثر قابلية للاستخدام فحسب ، بل ستجعل أيضًا أكثر إمتاعًا للاستخدام - حيث تساعد المساحة البيضاء على خلق شعور بالانسجام والسيولة في جميع أنحاء تجربة المستخدم.

الاستخدام الفعال للمساحة البيضاء

فيما يلي بعض الأمثلة على تطبيقات التلفزيون التي تستخدم قوة المساحة البيضاء الفعالة لإنشاء واجهات ممتعة في الاستخدام.

تسمح واجهات التلفزيون هذه للمستخدم بالتركيز على خيار واحد بدلاً من عشرات الخيارات
تسمح واجهات التلفزيون هذه للمستخدم بالتركيز على خيار واحد ، بدلاً من عشرات الخيارات في وقت واحد.

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

يسمح استخدام المساحة البيضاء في التصميم للمحتوى الخاص بك بالتألق على أي شاشة بأي حجم
يسمح استخدام المساحة البيضاء في التصميم للمحتوى الخاص بك بالتألق على أي شاشة بأي حجم.

• • •

مزيد من القراءة على مدونة Toptal Design:

  • تجربة مستخدم التجارة الإلكترونية - نظرة عامة على أفضل الممارسات (باستخدام مخطط المعلومات الرسومي)
  • أهمية التصميم المتمحور حول الإنسان في تصميم المنتج
  • أفضل مجموعات مصممي UX - أمثلة ودراسات حالة ملهمة
  • مبادئ ارشادية للواجهات المتنقلة
  • التصميم التوقعي: كيفية إنشاء تجارب مستخدم سحرية