مبدأ التوازن فى تصميم واجهات الإستخدام للمواقع Websites Balance

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

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

الإنسان بطبيعته مخلوق ثنائى: اعضاء الجانب الايمن لجسم الانسان = أعضاء الجانب الأيسر

آلية حساب الوزن البصرى لكل عنصر

التوازن البصرى يعدل بين العناصر، كل منها حسب مساهمته في التصميم او واجهة الموقع

كيف يحسب الدماغ الوزن البصرى للعناصر ؟ … الاجابة: اعيننا تصنع محور عمودى وهمى يفصل التصميم لنصفين متساويين عندما نشاهد اى صورة او مشهد و تبدأ فوراً في حساب الوزن البصرى لكل عنصر على جانبى المحور الوهمى، ثم تحسب النتيجة … فاذا كان مجموع الوزن البصرى لعناصر الجانب الأيمن = مجموع الوزن البصرى لعناصر الجانب الأيسر، اذا الصورة متوازنة والا فإن هذة الصورة بها مشكلة.
لو افتضرنا ان هناك مقياس للتوازن Measure of balance من ٥ درجات واعطينا لكل شكل من الاشكال التالية درجة على مقياس التوازن، كالتالى:-
كل الاشكال اخدت درجة واحدة علي مقياس التوزان عدا النجمة اخذت درجتين
الآن لنحسب الوزن البصرى للعناصر على الجانبين الايسر والأيمن للتصميم التالى:-
علي الرغم من ان الاشكال علي جانبي التصميم ليست متماثلة ، الا ان التصميم متوازن ، السبب يكمن في ان كل عنصر له وزن بصري مختلف عن الآخر

علي الرغم من ان الاشكال علي جانبي التصميم ليست متماثلة ، الا ان التصميم متوازن ، السبب يكمن في ان كل عنصر له وزن بصري مختلف عن الآخر
النتيجة ان التصميم متوازن، كيف ؟ … على الرغم من ان الاشكال ليست متماثلة على جانبى التصميم …
  • فالجانب الأيمن به ثلاث عناصر الدائرة + المربع + المثلث
  • الجانب الأيسر به عنصرين فقط و هما النجمة + المثلث
ولكن بسبب ان النجمة لها درجتين على الميزان البصرى، اصبحت العناصر على الجانبيبن للتصميم متوازنة بصرياً.
كيف يتم تحديد قيمة الوزن البصرى للعناصر ؟
معايير الوزن البصري للعناصر علي الميزان البصري Measure of balance

معايير الوزن البصري للعناصر علي الميزان البصري Measure of balance
السؤال الذى يجب ان تسألة … لماذا اخذت النجمة درجتين علي الميزان البصرى على خلاف المثلث والدائرة والمربع؟ … هذا يقودنا الي تحديد المعايير وراء رفع او خفض قيمة اى عنصر على الميزان البصرى، الوزن البصرى لكل عنصر يحدد بعدد من المعايير:-
  • الحجم Size: بديهياً العناصر الاكبر حجماً له وزن بصرى اعلى من العناصر الأقل حجماً.
  • اللون Colors، والصخب اللونى Color Noise: هذا المعيار ليس له اسباب واضحة الا انه مؤثر جدا في الوزن البصرى لأى عنصر فهو يعتمد بالأساس على الحس الفنى للمصمم، فاللون الاحمر يبدوا اثقل على الميزان البصرى من اللون الاصفر.
  • مكان العنصر Element Position: القرب والبعد عن المحور الوهمى الذي تخلقة العين، يؤثر على وزن العنصر بصرياً.
  • التعقيد الداخلي للعنصر (العناصر المتداخلة، مثال: الدوائر المتداخلة) Complexity: تجميع اكثر من عنصر داخل حيز عنصر واحد يزيد من وزنه بصرياً عن بقية العناصر الموجودة فى نفس الحيز.
انواع التوازن البصرى
التوازن البصرى كما هو معروف فى علوم الهندسة و التصميم الداخلى Interior Design له ثلاث انواع:-
أولاً: التوازن المتماثل
البطاقة التعريفية بالتوازن المتماثل

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

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

اى انسان يستطيع ان يكتشف ما اذا كان التصميم متوازن ام لا ولكن ليس كل انسان قادر على صناعة تصميم متوازن.

ثالثاً: التوازن المشع
التوازن المشع توزع فية الهناصر علي محيط دائري وكأن هناك نقطة ارتكاز للتصميم تلتف حولها العناصر

التوازن المشع توزع فية الهناصر علي محيط دائري وكأن هناك نقطة ارتكاز للتصميم تلتف حولها العناصر
هذا النوع من التوازن يأتى من مسماه، فالعناصر فى التصميم توزع على محيط دائرى حول نقطة ارتكاز وهمية، مثل الاشعة التى تخرج من الشمس، هذا النوع اقل الانواع استخداما لانه يتطلب توزيع دائرى مما يتطلب مساحة فى الواجهة الخاصة بالموقع.
الخلاصة
التوازن فى التصميم هو العنصر الأهم. التصميم المتوازن يساعد على تقديم انطباع ثابت للمستخدم ويشعرة بأن كل شئ على مايرام فى الواجهة وان لا يوجد شئ شاذاً. يجب ان تتدرب عين صانع واجهة الموقع على اكتشاف العناصر الاثقل وزنا بصرياً من غيرها اعتمادا على المعايير المحددة سلفاً، التوازن هو ما يجعل بعض التصميمات تتفوق على بعضها على الرغم من ان العناصر المستخدمة واحدة.
هل تعتقد ان تصميم واجهة مدونة الشركة متوازن بصريا؟ والى اي أنواع التوازن تنتمى؟
 
المصدر
0/5 (0 Reviews)