الخطوات الإجرائية الأساسية للتصميم المرئي | الفصل السادس | الدرس الرابع
الخطوات الإجرائية الأساسية للتصميم المرئي هو عنوان الدرس الرابع من الفصل السادس التي تحمل اسم “تصميم واجهات الموقع الإلكتروني” من مقرر “التصميم الرقمي” الفصل الدراسي الثاني.
سنتعرف في هذا الموضوع على التصميم وعناصره ومبادئه، كما سنتعرف على كيفية تحويل المخطط الهيكلي من تصميم رقمي إلى تصميم مرئي.
الخطوات الإجرائية الأساسية للتصميم المرئي
لذا قم بقراءة أهداف الموضوع جيدًا، وتأكَّد من تحصيل محتواها بعد انتهائك من دراسة الموضوع.
أهداف الموضوع
- معرفة التصميم المرئي وعناصره ومبادئه.
- تحويل المخطط الهيكلي من التصميم الرقمي إلى التصميم المرئي.
هيا لنبدأ!
التصميم المرئي وعناصره ومبادئه
التصميم المرئي (Visual Design)
يُقصد به تصميم الجزء الذي يشاهده المُستخدِم ضمن أي مُنتَج فيزيائي أو رقمي، ويتم ذلك عبر استخدام مجموعة من العناصر والمبادئ التي تسمح بتكوين هذه التصاميم بطريقةٍ مناسبة وسهلة الاستخدام.
عناصر التصميم المرئي
- الخطوط (Lines)
تُعدُّ الخطوط من أبسط عناصر التصميم المرئي، فلا يُمكِن أن تجد أي تصميم لا يحتوي على خطوط بشكلٍ ما، كما تمتلك الخطوط مع بساطتها خواصًا مختلفة يُمكِن التحكُّم بها، فهناك خطوط مستقيمة ومائلة، كذلك يوجد خطوط بسماكات مختلفة، كما يُمكِن أن تكون متقطعة.
هذه الخواص توفِّر للخطوط مرونة كبيرة تُساعد المصمِّم على توظيفها في الكثير من الأماكن ضمن التصميم، مثل: فصل العناصر عن بعضها، أو الإشارة إلى جزئيات مُحدَّدة ضمن التصميم.
- الأشكال (Shapes)
تُعدُّ الأشكال النموذج الأكثر تطورًا من الخطوط، فهي مجموعة من الخطوط المُشكَّلة معًا حتى تصنع شكلًا ما، فهناك المربعات والمستطيلات والدوائر وغيرهم من الأشكال الأكثر تعقيدًا.
تُستخدَم الأشكال في تكوين عناصر أخرى، أو في جمع وفرز وإعادة ترتيب مجموعة من العناصر التي قد تكون من نوع واحد ضمن التصميم.
- المساحة البيضاء (White Space) أو المساحة السلبية
هي أي منطقة ضمن التصميم لا تحتوي على شيء، وعكسها المنطقة التي تحتوي على العناصر وتسمى المنطقة الإيجابية.
ومع البساطة الشديدة لهذا العنصر فهو لا يحتوي على شيء، إلا أن المساحة البيضاء مهمة جدًا ضمن التصميم، فهي تساعد على إبراز بعض العناصر والمفاهيم بشكل مبسط للمُستخدِم، بالإضافة إلى أنها مهمةٌ من أجل فرز باقي العناصر وجعلها غير مزدحمة ضمن التصميم.
- الكتلة (Volume)
بعض التصاميم تظهر بشكلٍ ثنائي البُعد، مثل المنشورات وواجهات الاستخدام، أي أنها لا تملك سوى بُعدين (عرض وارتفاع)، كما أن هناك تصاميم أخرى تظهر بأشكال ثلاثية الأبعاد ضمن التصميم، والعناصر التي تُعبِّر عن هذه الأشكال هي ما تسمى بالكتلة، حيث يتم التعبير عن البعد الثالث بشكل وهمي ضمن التصميم.
- القيمة (Value)
تُستخدَم القيمة للتعبير عن المناطق المعتمة والمناطق المُنارة، وينتج عنها الظلال التي تعطي التصميم نوعًا من الواقعية، وتُستخدَم القيمة من أجل إيجاد التباين بين العناصر المختلفة، وغالبًا من أجل توضيح البُعد الثالث ضمن التصميم.
- اللون (Color)
تُعدُّ الألوان من أكثر العناصر المُستخدَمة في التصميم، كما أن للألوان تفاصيل كثيرة مُعقَّدة تجعل استخدامها يُقدِّم الكثير من الميزات، حيث تُستخدَم الألوان لإيجاد التباين والتركيز على جزئيات مُحدَّدة، كما تُستخدَم لإرسال معانٍ مختلفة حسب درجة اللون ونوع الشريحة المُستهدفة من الجمهور.
مبادئ التصميم المرئي
هناك مجموعةٌ من المبادئ التي تضبط عملية استخدام عناصر التصميم، وهي:
- الوحدة (Unity)
تعني ترتيب العناصر المكوِّنة للتصميم وفق مجموعةٍ مُحددةٍ بطريقة يسهُل على المُستخدِم تمييزها، حيث إن سرد العناصر بشكلٍ عشوائي وعدم ترتيبها يُربك فهم المُستخدِم للتصميم.
الخطوات الإجرائية الأساسية للتصميم المرئي
- التسلسل الهرمي (Hierarchy)
يُعدُّ التسلسل الهرمي مهمًا جدًا ضمن أي تصميم، فهو يوضح أهمية العناصر بالنسبةِ لبعضها، فكلما كان العنصر أكبر؛ زادت أهميته.
يُستخدَم التسلسل الهرمي بشكلٍ عام ضمن النصوص، حيث تظهر العناوين الرئيسة في النصوص المكتوبة في الكتب بحجمٍ كبير، وتأتي العناوين الفرعية بأحجام أقل، ثم النصوص بالحجم الطبيعي، ويوضح هذا التسلسل الهرمي ترتيب النصوص بشكلٍ منطقي عند القراءة.
- التوازن (Balance)
تُفضِّل عين الإنسان العناصر المريحة لها، فالتصاميم أو المُنتَجات التي تكون فوضويةً لا تُريح العين عند النظر إليها؛ لذلك غالبًا ما يقوم المُستخدِم بإزاحة نظره عنها، والتوازن يتمثل في ترتيب العناصر بطريقةٍ منطقية متوازنة ضمن أي تصميم، فمثلًا ليس من المنطقي تجميع كل المكوِّنات أو العناصر ضمن جزئيةٍ مُحدَّدة من التصميم وترك باقي أجزاء التصميم فارغة، فهذا يُسبب عدم التوازن في التصميم.
- التباين (Balance)
يعتمد التباين على إعطاء قيمةٍ مخالفةٍ لبعض العناصر ضمن التصميم بشكلٍ مبالغٍ فيه، بهدف جعلها مختلفةً تمامًا عن باقي التصميم، أي جعلها متباينة بهدف إبرازها لعين المُستخدِم، وكمثال على التباين نجد أن أزرار الحذف غالبًا ما تكون بلون أحمر مختلف عن باقي التصميم؛ لكي يستطيع المُستخدِم تمييزها عن باقي العناصر بسهولة.
الخطوات الإجرائية الأساسية للتصميم المرئي
- الهيمنة (Dominance)
يُستخدَم هذا المبدأ من أجل إظهار اختلاف ملحوظ لأحد العناصر عن العناصر المشابهة له بشكل واضح، وكمثال على استخدام الهيمنة، نجد أن الشركات تستخدِم هذا المبدأ ضمن جدول عرض الأسعار الخاص بالاشتراكات، حيث تجد أن أحد هذه العروض ملون بطريقة مختلفة تمامًا بهدف دفع المُستخدِم للاشتراك ضمن هذه الحزمة تحديدًا عبر إبرازها بشكل واضح.
تحويل المخطط الهيكلي من التصميم الرقمي إلى التصميم المرئي
أ. إنشاء وإدارة الأدلة Guides
عند العمل على التصميمات، يُمكِن استخدام أدلة لمحاذاة الكائنات أو إدارة التباعد بين العناصر على لوح الرسم.
تعمل الشبكات كإطارٍ يُمكِن من خلاله تنظيم عناصر التصميم، مثل: الصور، الحروف الرسومية، والفقرات، وتضمن تناسق التخطيط.
الخطوات الإجرائية الأساسية للتصميم المرئي
- لإنشاء دليلٍ رأسي يُمرّر المؤشر فوق الحد الأيسر للوح الرسم؛ حتى تظهر الأيقونة مع الاستمرار بالنقر فوق الرمز ثم سحبه إلى الموضع المطلوب.
- لإنشاء دليل أفقي، تُمرّر الفأرة فوق الحد العلوي للوح الرسم؛ حتى تظهر الأيقونة. ثم السحب والإفلات إلى الموضع المطلوب.
ب. التوافق مع الأدلة الذكية
عند تحريك الكائنات تُظهر بعض الأدلة التي توظَِف الذكاء الاصطناعي؛ لقياس التناسب والمسافات بدقة أثناء التصميم؛ مما يُساعِد في المحاذاة للكائنات، وهناك نوعان من الأدلة:
- أدلة زرقاء: توضِّح متى محاذاة كائن مع كائنات أخرى أو عندما يتم توسيطه عموديًا أو أفقيًا في منتصف لوح الرسم أو الكائن الأصلي الذي يحتوي عليه، عندما يتم عرض هذه الأدلة، سينجذب الكائن إليها تلقائيًا وسيساعد في تحديد موضعها.
- أدلة زهرية: تعرض المسافة بالبكسل بين الكائنات المجاورة وحوافّ لوح الرسم.
يُمكِنك التعرُّف على المزيد من المعلومات عن “الخطوات الإجرائية الأساسية للتصميم المرئي” من خلال الرابط التالي:
إلى هنا يكون قد انتهى موضوع “الخطوات الإجرائية الأساسية للتصميم المرئي” لا تنسوا مراجعة أهداف الموضوع أعلى المقال، وانتظرونا في الموضوع القادم!