-
المساهمات
6 -
تاريخ الانضمام
-
تاريخ آخر زيارة
إنجازات Noureldeen Akram

عضو مبتدئ (1/3)
3
السمعة بالموقع
-
Ahmed Baskota بدأ بمتابعة Noureldeen Akram
-
يهدف التصميم المرئي إلى إنشاء وتنسيق جماليات عامة متناغمة مع المنتج، ولإنشاء النمط الجمالي لموقع الويب أو التطبيق، فإننا نعمل مع العناصر الأساسية للتصميم المرئي، ونرتبها وفقًا لمبادئ التصميم، وتشكل هذه العناصر والمبادئ معًا اللبنات الأساسية للتصميم المرئي، ويُعَد الفهم الراسخ لها هو أمر بالغ الأهمية في إنشاء تصميم مرئي لأي منتج. سنقدم لك عناصر التصميم المرئي اﻷساسية، وهي الخط والشكل والفراغ (المساحة البيضاء) والحجم والقيمة واللون والملمس، وفي حين أن الفحص الدقيق لكل عنصر ليس ضروريًا في العادة في عملك اليومي بصفتك مصممًا، فإن مبادئ التصميم -كيفية وضع العناصر معًا لبناء الصفحات وشاشات التطبيق على النحو الأمثل- تؤدي دورًا مهمًا في عملك، لذلك يجب تعلم كيفية تحقيق الوحدة والصورة والتسلسل والتوازن والتباين والقياس والهيمنة والتشابه، حيث سيفيدك في كل مرة، كما سنوضح لك كيف يجب أن تفكر في وضع هذه العناصر المرئية التي لا غنى عنها لتحقيق أقصى تأثير. عناصر التصميم المرئي يمكن تقسيم أي منتج -من المنتجات البرمجية مثل مواقع الويب والتطبيقات، إلى المنتجات الصلبة مثل المحامص ومجففات الشعر- إلى عناصر أساسية للتصميم المرئي حسب وصف آلان هاشيموتو، وهو الأستاذ المشارك في التصميم الجرافيكي وفنون الحاسوب في جامعة ولاية يوتا؛ ومايك كلايتون المدير والأستاذ المساعد لفنون الجرافيك الحاسوبية في جامعة إنكارنت وورد، وذلك في كتابهما (أساسيات التصميم المرئي: نهج رقمي)، حيث تُعَد هذه العناصر هي الأدوات الأساسية التي نستخدمها نحن المصممين المرئيين في عملنا اليومي، وفهمها هو بالتأكيد شرط أساسي للوظيفة. الخط الخطوط هي حدود تربط بين نقطتين، وهي أكثر عنصر أساسي في التصميم المرئي، حيث يمكننا استخدامها لإنشاء أشكال، وعندما نكررها، يمكننا تشكيل أنماط تنتج ملمسًا Textures. يربط الخط بين نقطتين وهو أبسط عنصر في التصميم، فلا يمكنك تبسيط الشيء أكثر من جعله أحادي البعد في عالم التصميم، في العلم يمكنك ذلك، لكن هذه قصة أخرى. على الرغم من بساطتها، يمكن أن تمتلك الخطوط مجموعةً كبيرةً ومتنوعةً من الخصائص التي تسمح لنا بنقل مجموعة من التعبيرات، حيث يمكن مثلًا أن تكون الخطوط سميكةً أو رفيعةً، مستقيمةً أو منحنيةً، مستدقةً أو لها عرض موحد،كما يمكن أن تكون هندسيةً (وكأنها مرسومة بواسطة مسطرة أو بوصلة) أو عضويةً طبيعيةً (وكأنها مرسومة باليد). الخطوط بسيطة، لكنها يمكن أن تنقل مشاعر مختلفةً باستخدام خصائص مختلفة، كما يمكن أن يكون الخط ضمنيًا من خلال تكوين اتصال غير مرئي بين العناصر الأخرى، فمثلًا في شعار مؤسسة Interaction Design Foundation، تتصل الكلمات Interaction Design Foundation حول الشجرة لإنشاء خط ضمني نصف دائري. الشكل الأشكال عبارة عن مساحة مغلقة، وتتكون عادةً من خطوط (على الرغم من أنها قد تتشكل باستخدام لون أو قيمة أو ملمس مختلف)، وللشكل بعدان هما الطول والعرض. يمكننا عمل الأشكال باستخدام الخطوط (كما سبق ذكره)، أو باستخدام الاختلافات في اللون أو الملمس أو القيمة. نميل إلى تعريف الأشياء باستخدام أشكالها الأساسية، ونركز فقط على التفاصيل (مثل الخطوط والقيم والألوان والقوام) عند الفحص الدقيق، لهذا تُعَد الأشكال عناصر أساسيةً نستخدمها نحن المصممين للتواصل السريع والفعال. الفراغ أو المساحة البيضاء أو السلبية الفراغ (المعروف باسم المساحة البيضاء) هو المساحة الفارغة حول الشكل، وتسمى العلاقة بين الشكل والفراغ بـ (الشكل أو الخلفية)، حيث يكون الشكل هو الشكل والمنطقة المحيطة بالشكل هي الخلفية، ويجب أن ندرك أنه عند تصميم الأشكال الإيجابية، فنحن نصمم مساحات سلبيةً في نفس الوقت، ولا يقل الفضاء السلبي أهميةً عن الشكل الإيجابي نفسه، حيث يساعد على تحديد حدود المساحة الإيجابية وتحقيق التوازن في التكوين. المساحة السلبية وتسمى كذلك المساحة البيضاء، هي المساحة الفارغة حول الشكل الإيجابي، حيث يمكنك اختيار رؤية شكل ما على أنه كرة زرقاء موضوعة على مستطيل أزرق فاتح أو أنه مستطيل أزرق فاتح به فتحة، وتستفيد بعض التصميمات من المساحة السلبية لإنشاء تأثيرات بصرية ملفتة، إذ يستخدم شعار الصندوق العالمي للطبيعة WWF الشهير مثلًا، الخلط بين الشكل الإيجابي والمساحة السلبية لتشكيل صورة الباندا. لا يرسم شعار WWF الباندا بأكملها صراحةً، بل يستخدم بذكاء مساحةً سلبيةً (بيضاء) حول الأشكال السوداء ليكمل بقية الباندا. الكتلة تطبق الكتلة على المرئيات ثلاثية الأبعاد، والتي لها الطول والعرض والعمق، ونادرًا ما نستخدم الكتلة في التصميم المرئي، حيث تُعرَض معظم المنتجات الرقمية في نهاية المطاف على شاشة ثنائية الأبعاد، وعلى الرغم من أن بعض التطبيقات والمواقع الإلكترونية تستخدم نماذج ورسومات ثلاثية الأبعاد، لكن الصور ثلاثية الأبعاد المعروضة على شاشة ثنائية الأبعاد هي في النهاية صور ثنائية الأبعاد. للحجم/ الكتلة ثلاثة أبعاد: الطول والعرض والعمق، وهذه الصورة عبارة عن محاكاة للكتلة في رسومات ثنائية الأبعاد. القيمة تصف القيمة بكل بساطة الضوء والظلام، وقيمة الضوء مقابل القيمة المظلمة: تصف القيمة الإضاءة والتعتيم. يخلق التصميم ذو التباين العالي للقيم (أي الذي يستخدم قيم الضوء والظلام) إحساسًا بالوضوح، بينما يخلق التصميم ذو القيم المتشابهة إحساسًا بالدقة، ويمكننا استخدام القيمة لمحاكاة الكتلة برسوم ثنائية الأبعاد، وذلك مثلًا باستخدام قيم أفتح، حيث يضرب الضوء الزاوية والقيم المعتمة للظلال. تخلق الاختلافات في القيم تصميمات واضحةً، بينما تظهر التصميمات التي تستخدم قيمًا متشابهةً بدقة أكثر. اللون يُعَد اللون عنصرًا من عناصر الضوء، ونظرية الألوان هي فرع من فروع التصميم، حيث تركز على مزج واستخدام الألوان المختلفة في التصميم والفن، ويوجد في نظرية الألوان تمييز مهم بين الألوان التي تختلط بطريقة طرحية والألوان التي تختلط بطريقة المزج الجمعي. ففي الطلاء، تختلط الألوان بطريقة المزج الطرحي، حيث تمتص الأصباغ الموجودة في الدهانات الضوء، وعندما تُخلَط أصباغ مختلفة معًا، سيمتص الخليط نطاقًا أوسع من الضوء، مما ينتج عنه لون داكن أكثر، فينتج عن المزيج الطرحي من السماوي والأرجواني والأصفر لون أسود، وينتج عن المزيج الطرحي من الألوان في الطلاء والطباعة بنظام ألوان CMYK (أي سماوي وأرجواني وأصفر وأسود). وفي التصميم الرقمي، يظهر المنتج على الشاشة، وتمتزج الألوان بطريقة المزج الجمعي، بحيث تبعث الشاشة الضوء وتضيف الألوان بعضها إلى بعض وفقًا لذلك، عندما تخلط ألوان مختلفة معًا على الشاشة. يلفظ الخليط نطاقًا أوسع من الضوء، مما ينتج عنه لون أفتح، فينتج عن المزيج الجمعي من الألوان الأحمر والأزرق والأخضر على الشاشات الضوء الأبيض، وينتج المزيج الجمعي من الألوان على الشاشات الرقمية نظام الألوان RGB (أي الأحمر والأخضر والأزرق). ينتج مزيج الألوان الطرحي في الطلاء والطباعة نظام ألوان CMYK، بينما ينتج مزيج الألوان الجمعي على الشاشات الرقمية نظام ألوان RGB. نستخدم الألوان في التصميم المرئي لنقل المشاعر وإضافة التنوع والاهتمام إلى تصاميمنا، وفصل المساحات المميزة للصفحة، ولتمييز عملنا عن المنافسين. الملمس الملمس هو طبيعة سطح الشيء، ويمكن إنشاء الملمس بنمط متكرر من الخطوط، أو باستخدام صور متجانبة من العنصر، وفي الشكل الموضح بالصورة أعلى، تضيف الخطوط القطرية تأثير قبضة إلى مستطيل أملس. يمكنك بصفتك مصممًا العمل مع نوعين من الملمس: القوام الملموس، حيث يمكنك أن تشعر بالملمس؛ والملمس الضمني التقديري؛ ويمكنك فيه رؤية الملمس دون التشعور به. سيعمل معظم المصممين المرئيين مع الملمس الضمني، لأن الشاشات غير قادرة على إنتاج ملمس محسوس. تحاكي تصميمات أيقونات التطبيقات في iOS 6 -والإصدارات السابقة- الملمس اللامع للزجاج لتحفيز المستخدمين على النقر عليها، وفي وقت لاحق، قدمت شركة أبل الشهيرة ملمس الكتان إلى واجهة المستخدم الخاصة بها، مع شعبية التصميم المسطح (أسلوب الحد الأدنى الذي يتميز بمساحات نظيفة ورسوم توضيحية ثنائية الأبعاد ومسطحة). تتميز أيقونات تطبيقات iOS 1-6 بتصميم ملمس لامع بحيث تبدو وكأنها أزرار فعلية. قدمت شركة أبل Apple في عام 2011 تقريبًا استخدامًا واسعًا لملمس الكتان (الذي ظهر لأول مرة على نظام iOS) في جميع أنظمة التشغيل الخاصة بها مبادئ التصميم تستخدم عناصر التصميم المرئي كلًا من الخط والشكل والفراغ/المساحة البيضاء والكتلة والقيمة واللون والملمس لوصف اللبنات الأساسية لجماليات المنتج، ومن ناحية أخرى تخبرنا مبادئ التصميم عن كيف تتكامل هذه العناصر معًا للحصول على أفضل النتائج، وترتبط العديد من المبادئ الواردة أدناه ارتباطًا وثيقًا وتكمل بعضها البعض. ما مدى أهمية مبادئ التصميم لوظيفة المصمم المرئي؟ يوضح ذلك ويليام ليدويل الشريك وكبير مسؤولي البحث والتطوير في معهد العلوم الإدارية التطبيقية في كتابه التاريخي، والمشار إليه على نطاق واسع المبادئ العالمية للتصميم، حيث يقول: "يتجاهل أفضل المصممون أحيانًا مبادئ التصميم، وعندها عادةً ما تكون هناك بعض المزايا التعويضية التي نحصل عليها على حساب الانتهاك، لذا إذا لم تكن متأكدًا من القيام بذلك، فمن الأفضل الالتزام بالمبادئ". الوحدة يتمحور مبدأ الوحدة حول خلق شعور بالانسجام بين جميع العناصر في الصفحة، فمن المرجح أن تخلق الصفحة التي تحتوي على عناصر مرتبة بصريًا أو مفاهيميًا إحساسًا بالوحدة. قد يؤدي الافتقار إلى الوحدة في التصميمات إلى خلق شعور بعدم الارتياح والفوضى، والعين ترى وتحكم، لذا عندما نصمم مواقع الويب، يمكننا الاستفادة من الشبكة لتحقيق شعور الوحدة، وذلك لأن العناصر المنظمة في شبكة ستتبع ترتيبًا منظمًا، لكننا بحاجة إلى إدخال بعض التنوع في عملنا من أجل تحقيق التوازن بين التصميم الممل والفوضوي. مبدأ الجشطالت Gestalt يشير مبدأ الجشطالت إلى ميولنا لتمييز الأجزاء بشكلها العام، أي النظرة العامة إلى الكل، ثم النظر إلى الأجزاء الفردية، حيث تدرك العين والعقل البشريان الشكل الكلي بطريقة مختلفة عن الطريقة التي يدركان بها الأجزاء الفردية من هذه الأشكال، وعلى وجه الخصوص، نميل إلى إدراك الشكل العام للشيء أولًا، قبل إدراك تفاصيله بما فيها الخطوط والملمس وما إلى ذلك. مبادئ الجشطالت هي السبب في أنه يمكننا رؤية مربع ودائرة ومثلث على الرغم من أن الخطوط ليست كاملة، حيث نرى الكل يتكون من الخطوط المنقطة أولًا، قبل أن ندرك الخطوط المنقطة المنفصلة في كل صورة. يُعَد شعار WWF الموضح سابقًا مثالًا على الاستفادة من مبدأ الجشطالت لإنشاء تصميمات مميزة، فمن خلال وضع أجزاء الباندا بالقرب من بعضها البعض، يستفيد التصميم من ميلنا إلى رؤية الصورة بأكملها بدلًا من أجزائها، وبالتالي خلق وهم الباندا. يُعَد مبدأ الجشطالت مهمًا لجعل الأقسام المنفصلة في موقع الويب مميزةً وبارزةً من خلال زيادة المساحة البيضاء بينها، وعلينا معشر المصممين أن نتأكد من أنه إذا ما كانت أجزاء موقع الويب التي نجمعها باستخدام مبدأ الجشطالت قريبةً من بعضها البعض، ولها نفس الشكل أو متشابهة الحجم أو هما معًا، فيجب تجميعها معًا من الناحية المفاهيمية، حيث يؤدي تجميع العناصر غير المتشابهة من الناحية المفاهيمية إلى إرباك المستخدمين. يُعَد استيعاب وتفحص التصميمات ذات الأقسام الواضحة أسهل من التصميمات التي ليس لها تمييز واضح بين الأقسام، خاصةً إذا كانت الأقسام متميزةً من الناحية المفاهيمية. التسلسل الهرمي يوضح التسلسل الهرمي الاختلاف في أهمية العناصر في التصميم، فاللون والحجم هما أكثر الطرق شيوعًا التي يمكننا من خلالها إنشاء تسلسل هرمي، ومن خلال تمييز زر أساسي، أو استخدام خطوط أكبر للعناوين، تميل العناصر التي تظهر أعلى الصفحة أو التطبيق كذلك إلى الظهور على أنها ذات تسلسل هرمي أعلى من تلك التي تظهر أدناه. التوازن التوازن هو المبدأ الذي يحكم كيفية توزيع عناصر التصميم بالتساوي، وتميل التصميمات المتوازنة إلى الظهور بمظهر هادئ ومستقر وطبيعي، بينما تجعلنا التصميمات غير المتوازنة نشعر بعدم الارتياح. تبدو التصميمات المتوازنة مستقرةً، بينما تبدو التصميمات غير المتوازنة غير قابلة للاستمرار وغير طبيعية، ويمكن تحقيق التوازن من خلال وجود تماثل في التصميم، مثل وجود صفحة ويب بها نصوص وصور مركزية، لكن يمكنك كذلك تحقيق التوازن بدون تماثل، وربما ليس من المستغرب أن يُعرف هذا بالتوازن غير المتماثل، حيث نحقق توازنًا غير متماثل عندما نرتب عناصر مختلفة الحجم بطريقة تؤدي إلى الوحدة، فيمكننا تخيل نقطة مركزية للتصميم وتوزيع العناصر بطريقة تخلق التوازن. التباين نستخدم التباين لإبراز العنصر من خلال التلاعب في اختلاف اللون والقيمة والحجم وعوامل أخرى، وبصفتنا مصممين (سواءً كان ذلك في تصميم الشعار أو تصميم واجهة المستخدم أو ما إلى ذلك)، فغالبًا ما نستخدم اللون الأحمر لإبراز بعض العناصر، ففي نظام التشغيل آي أو إس iOS مثلًا، يظهر اللون الأحمر غالبًا في إجراء "حذف" للإشارة إلى أن إجراء لا رجوع فيه (غالبًا) على وشك الحدوث، بينما غالبًا ما يكون اللون الأخضر شيئًا نستخدمه (على الأقل في التصميم الغربي) في الإجراءات الإيجابية مثل Go وموافق. وهذا يعني أنه لا يمكننا تجاهل المعنى الثقافي للألوان عند التصميم من أجل التباين، ومن ثم إذا كنت تصمم لعميل في بلاد أخرى، فعليك التعرف عليها وضبط تصميمك ليتوافق مع الاعتبارات الثقافية فيها، مثل أن تسأل نفسك: "هل الأحمر عندهم يشير لشيء جيد أم سيئ؟" أو "هل الأسود بالنسبة لهم جدي أم كئيب؟". يُستخدم اللون الأحمر -وهو لون ذو تباين عالٍ- على نطاق واسع في نظام iOS لوظيفة الحذف. الحجم والمقياس يصف الحجم الأحجام النسبية للعناصر في التصميم، ويمكنك التشديد على عنصر باستخدام الحجم لجعله أكبر من العناصر الأخرى التي تظهر معه، ولا يمكنك إبراز عنصر بطريقة التشديد فقط، بل يمكنك كذلك استخدام المقياس لإنشاء إحساس بالعمق نظرًا لأن الأشياء الأقرب تبدو أكبر للعين البشرية، كما تضيف المقاييس المُبالَغ فيها للصور مستوًى معينًا من الاهتمام والدراما. يمكن استخدام المقياس لإنشاء تسلسل هرمي وإضافة التركيز إلى عناصر معينة في التصميم. الهيمنة تخلق الهيمنة التركيز على عنصر واحد، حيث يمكننا استخدام اللون والشكل والتباين والمقياس والتموضع لتحقيق ذلك، إذ تحتوي معظم مواقع الويب على صورة رئيسية تسمى عادةً Hero (صورة بانر كبيرة الحجم أعلى موقع الويب)، والتي تستخدم الهيمنة لجذب المستخدمين وبالطبع تنجح بذلك. يمكن تأكيد الهيمنة من خلال استخدام التموضع والشكل واللون، والعديد من العوامل الأخرى، وعند عمل التصميم المرئي، يجب أن نتأكد من أننا نستخدم الهيمنة مع استمرارنا في الحفاظ على وحدة وتوازن مواقع الويب، وإلا فمن المرجح أن ينتج التصميم تجربةً مربكةً للمستخدمين. أمثلة لتوضيح عناصر ومبادئ التصميم مع وضع عناصر التصميم المرئي ومبادئ التصميم في الحسبان، سنحلل عددًا قليلًا من مواقع الويب لمعرفة كيف صُممت، ولماذا نجحت التصميمات. صفحة جوجل الرئيسية تُعَد صفحة جوجل الرئيسية إحدى صفحات الويب الأكثر زيارةً في العالم، والبساطة الصريحة للصفحة لها دور في نجاح تصميمها، لكن إليك بعض العوامل الأخرى التي تجعل هذه الصفحة تعمل جيدًا: الهيمنة: يمنح شعار Google الكبير ومربع البحث الهيمنة، مما يجعلها جوهر الصفحة ومحط التركيز على الصفحة بأكملها. التباين واللون: يستخدم شعار جوجل ألوانًا ساطعةً (أساسيةً في الغالب)، وتختلط هذه الألوان جيدًا لتشكل شعارًا بصريًا مبهجًا، كما يحتوي الشعار على تباين وافٍ بالنسبة للخلفية البيضاء، مما يجعله بارزًا على الصفحة. الشكل: يستخدم مربع البحث شكل مستطيل لتحديد حقل البحث، مما يجعله سهل الاستخدام للغاية. المساحة السلبية: تتكون صفحة جوجل الرئيسية في أغلبها من المساحة السلبية، مما يجعل مربع البحث (الوظيفة الرئيسية للصفحة) مركز الاهتمام، وتُعَد المساحة السلبية مفيدةً كذلك للصفحة، حيث تعمل مثل ورقة فارغة قبل أن يكتب المستخدمون مصطلحات البحث. التوازن: الصفحة متماثلة عموديًا تقريبًا، مما ينتج عنه إحساس بالتوازن ممتع للغاية وهادئ عند النظر إليه. وكالة كوارتز الإخبارية كوارتز هي وكالة إخبارية تهتم أولًا بالعالم الرقمي والهاتف المحمول، وجمهورهم منتشر بشتى بقاع العالم، وقد أطلقتها شركة أتلانتيك ميديا في عام 2012، ولها صفحة رئيسية جريئة تضع القصص الإخبارية المميزة في المقدمة وفي المنتصف، ولعرض أسلوب تصميمها من مبادئ التصميم وعناصر التصميم معًا: من السهل الإعجاب بالتأثير ككل دون النظر إلى الأجزاء واللوازم الأساسية، حيث جُمِعت العناصر جيدًا وفقًا لمبادئ قديمة من أجل إنشاء هذا التأثير الرائع، وذلك على النحو التالي: الهيمنة: يلفت الخبر الرئيسي انتباهك على الفور، حيث يجعله خطه الكبير -والعريض- مهيمنًا على الصفحة الرئيسية. التسلسل الهرمي: تستخدم الصفحة الرئيسية تسلسلًا هرميًا واضحًا لتحديد الأهمية النسبية للعناصر المختلفة، فالقصة الرئيسية ذات النص الأكبر والحروف العريضة لها أعلى تسلسل هرمي؛ أما القصص الأربعة التالية أسفل القصة الرئيسية، فلها خطوط أصغر لإظهار التسلسل الهرمي التابع لها تحت القصة الرئيسية. المقياس والقيمة واللون: تحتوي صفحة كوارتز الرئيسية على حرف Q كبير بحجم الصفحة كاملةً، وهو قناع للصورة الرئيسية hero image لأجل القصة الرئيسية، ويحدد حرف Q الكبير هوية موقع الويب بسرعة، حيث تعني Q كوارتز وهذا باستخدام المقياس، ولكن قيمة الضوء النسبية ولون التدرج الرمادي لـ Q تجعله يتلاشى في الخلفية، وبالتالي يجلب التركيز العام إلى عنوان القصة الرئيسية بدلًا منه. المساحة السلبية: معظم الصفحة الرئيسية عبارة عن مساحة سلبية مما يبرز المحتوى، وعندما يُوضَع مؤشر الفأرة فوق عنوان القصة الرئيسية، سيختفي قناع Q ويملأ المساحة السلبية بصورة القصة، ويوضح هذا المثال كيف يمكنك التلاعب بطريقة مميزة مع المساحة السلبية لكي تثير الاهتمام بتصميم موقعك. الوحدة: تستخدم كوارتز نظام الشبكة في موقعها على الإنترنت لخلق شعور بالوحدة، فمثلًا تتميز القصص الأربعة بعرض متساوٍ ومتباعد بشكل موحد، مما يخلق إحساسًا بالانتظام والبنية. الخلاصة تشكل عناصر التصميم المرئي اللبنات الأساسية للمنتج، بينما لا نحتاج نحن بصفتنا مصممين بصريين إلى فحص كل عنصر عن كثب في عملنا اليومي، حيث تؤدي مبادئ التصميم -كيفية وضع العناصر معًا لبناء الصفحات وشاشات التطبيقات على النحو الأمثل- دورًا مهمًا في ما نقوم به، لذا سيكون تعلم كيفية تحقيق الوحدة والجشطالت والتسلسل الهرمي والتوازن والتباين والمقياس والهيمنة والتشابه مفيدًا للغاية أثناء عملك في التصميم المرئي. لذلك، باستخدام عناصرك، وهي: الخط. الشكل. المساحة السلبية. الكتلة. القيمة. اللون. الملمس. وتوجيههم حول المبادئ، وهي: الوحدة. الجشطالت. التسلسل الهرمي. التوازن. التباين. المقياس. الهيمنة. يمكنك تحقيق نتائج ناجحة دائمًا. ترجمة -وبتصرّف- للمقال The Building Blocks of Visual Design لصاحبه Teo Yu Siang. اقرأ أيضًا التصميم للهواتف: التصميم البصري مفهوم الثقل المرئي (Visual Weight) والألوان في مجال تجربة المستخدم
-
يُعَد تصميم Neumorphic صيحةً جديدةً في عالم تصميم واجهات المستخدم، وقد اكتسب جاذبيةً من مصممي واجهة المستخدم، وأصبح خيارًا جماليًا شائعًا للبرامج والمواقع وتطبيقات الأجهزة المحمولة المعاصرة. وبالاعتماد على جوانب من الصورة الواقعية والتصميم ثلاثي الأبعاد، يجلب النمط الجديد سمات ماديةً تحاكي الواقع مثل الظلال والملمس إلى الواجهات الرقمية. ولفهم تأثير التصميم الجديد تمامًا، سنلقي في هذه المقالة نظرةً على أصوله. أصول تصميم Neumorphic عندما أصدرت شركة أبل جهاز ماكنتوش Macintosh في عام 1984، كان أول حاسوب شخصي بواجهة مستخدم رسومية في ذلك الوقت، حيث اعتقد ستيف جوبز وهو الشريك المؤسس لشركة أبل، أن الأيقونات والرموز المألوفة، مثل سلة المهملات أو المجلد ستساعد مستخدمي الحاسوب لأول مرة على فهم كيفية التنقل في واجهة ماكنتوش Macintosh بطريقة أفضل، وترك جوبز شركة أبل في عام 1985، لكن بعودته في عام 1997، قاد الشركة لتغيير واجهة المستخدم إلى تصميم skeuomorphism، وهو أسلوب تعكس فيه مكونات الواجهة نظائرها الواقعية في العالم الحقيقي وصولًا إلى آخر التفاصيل. وبحلول الوقت الذي أُطلِق فيه نظام التشغيل ماك أو إس Mac OS X في عام 2001، طوّرت شركة أبل نظام skeuomorphism بالكامل يسمى أكوا Aqua، وهي لغة تصميم ذات طابع مائي مع أيقونات وأزرار وقوائم منسدلة لامعة. مع طرح الآيفون في عام 2007، نمت علامة أبل التجارية وهي الواجهة Skeuomorphism لتصبح حتى أكثر واقعيةً، وبحلول أوائل عام 2010 أصبح تصميم skeuomorphic هو الخيار الفعلي للواجهات الرقمية، ولكن عندما أصبح العالم أكثر اعتمادًا على الأجهزة المحمولة أصبحت حدود تصميم skeuomorphic واضحةً، حيث يتطلب إنشاء مكوناته وقتًا طويلًا ودرجةً عاليةً من القدرة التقنية، وبينما تبدو مكونات هذا التصميم رائعةً على أجهزة الحاسوب المكتبية والشاشات الرئيسية، إلا أن تفاصيله الدقيقة تميل إلى الاختفاء عند تغيير حجمها إلى أحجام صغيرة. في تناقض صارخ مع التدرجات وتصميم الملمس الواقعي لـ skeuomorphism، شهد منتصف عام 2010 اعتمادًا واسعًا للتصميم المسطح، وأعاد التمهيد للعصر الرقمي البسيط في الستينيات، فجرد التصميم المسطح مكونات الواجهة من كل شيء، باستثناء العناصر الأساسية، وهي الخط والشكل واللون، مما يجعله أسلوبًا سريعًا ومرنًا للغاية ومناسبًا تمامًا للشركات الكبيرة التي تتطلع إلى تنظيم لغات التصميم الخاصة بها. كانت تصاميم skeuomorphism لعنةً للمصممين لعدة سنوات، ولكن برزت من رمادها صيحة جديدة لتأخذ الصدارة، في أواخر عام 2019 ظهر تصميم neumorphism (اختصار لـ "skeuomorphism الجديد") ويبدو أنه يتقدم أفضل من أسلافه لتحقيق التوازن بين الواقعية المفرطة والبساطة، حيث يستخدم neumorphism الألوان والقوام والظلال بطريقة تبدو واقعيةً دون الإفراط في التفاصيل. تصميم Neumorphism 101 يتميز التصميم الحديث بثلاث خصائص مشتركة: أنظمة الألوان أحادية اللون والتباين المنخفض والظلال الدقيقة، ويستطيع مصممو واجهة المستخدم تطبيق هذه السمات على مجموعة واسعة من مكونات التصميم التي تُظهِر الجمالية الناعمة للشكل الجديد، لذا دعونا نُلقِ نظرةً على تطبيق الآلة الحاسبة لنرى كيف يعمل التصميم الحديث: في تصميم skeuomorphic، تصمم الآلة الحاسبة مع التدرجات اللونية والبروز، وتساعد لوحة الألوان على فصل المقدمة عن الخلفية، فمن المفترض أن تبدو وتعمل مثل الآلة الحاسبة التي قد تجدها ملقاةً في مكتبك، وتتخلى نسخة التصميم المسطح لنفس الآلة الحاسبة عن تقنيات المحاكاة الخاصة بـ skeuomorphic، وتعتمد على الأشكال والألوان لتمييز أقسامها المختلفة. يُستمَد تصميم Neumorphic من تصميم skeuomorphic والتصميم المسطح Flat design كلاهما، من خلال إقران لوحة الألوان أحادية اللون مع الظلال الدقيقة التي تجعل أزرار الآلة الحاسبة تبدو مجسَّمةً، ويمنح التباين المنخفض -بين المقدمة والخلفية- الآلة الحاسبة تشطيبًا ناعمًا، والتأثير الكلي هو الواقعية المبسطة. أمثلة على تصاميم Neumorphic الآن، وبعد أن أصبحتَ على دراية بسماته الفريدة، ستلاحظ وجود تصميم Neumorphic في كل مكان، وبالطبع بدأ مصممو واجهة المستخدم -في الصناعات والمجالات المتنوعة، مثل السيارات والترفيه والرعاية الصحية والتمويل- بإعادة تخيل مكونات الواجهة بتصميم neumorphism الجديد: إيجابيات وسلبيات تصميم Neumorphic كل اتجاهات التصميم لها مزايا وعيوب، لكن عند استخدامها بعناية، تتمتع الصيحات الجديدة بالقدرة على بث روح جديدة في أنماط التصميم التي يمكن التنبؤ بها، ومع ذلك تظهر الصعوبات عندما تُفرض هذه التصميمات في تطبيقات لا تتناسب معها. دعنا نستكشف إيجابيات وسلبيات التصميم الجديد لفهم استخدامه أكثر. الإيجابيات نظرًا لأن تصميم Neumorphic بسيط من الناحية البصرية، فهو مناسب تمامًا للمنتجات الرقمية، والتي تتكون غالبًا من العشرات إن لم يكن المئات من الشاشات ومكونات التصميم، حيث تتمتع البساطة بالعديد من المزايا في تصميم المنتجات الرقمية، إذ تسهل على المصممين إنشاء تجارب متماسكة من الناحية الجمالية بغضّ النظر عن عدد الشاشات التي يمتلكها المنتج، ويسرع التصميم الجديد عملية وضع تصور للشاشات الجديدة وبنائها واختبارها وتكرارها، ويساعد المصممين على الحفاظ على تناسق المنتجات بصريًا أثناء تطويرها. بالإضافة إلى بساطته، تجعل الصفات الواقعية لـ Neumorphic مكونات واجهة المستخدم تبدو أكثر واقعيةً، وتعطي تفاعلًا أفضل للمستخدمين. السلبيات رغم أن Neumorphism يُعَد صيحةً الآن ويُستخدَم على نطاق واسع، إلا أنه يأتي مع مخاوف تتعلق بإمكانية الوصول، فإذا اختار المصممون استخدام عناصر Neumorphism أحادية اللون تمامًا، فربما يتسببون بمشاكل للأشخاص الذين يعانون من إعاقات بصرية مثل عمى الألوان، وفوق ذلك يمكن أن يؤدي اعتماد النمط الجديد على التباين المنخفض لتحقيق مظهره الناعم إلى صعوبة القراءة، ويصبح من الصعب على المستخدمين تحديد الأزرار والرموز والنماذج وميزات الواجهة المهمة الأخرى. تصميم Neumorphic يصلح لكل زمان عند تنفيذه مع وضع احتياجات المستخدمين (وإمكانية الوصول) في الحسبان، فإن Neumorphism هو خيار تصميم مقنع بصريًا لواجهة المستخدم للتطبيقات ومواقع الويب، وتضفي ظلاله البسيطة -وتصميمات الملمس الناعمة- على مكونات واجهة المستخدم دفئًا وجاذبيةً للتفاعل. تأتي الأنماط وترحل في عالم التصميم، ولكن البساطة والصفات الملموسة التي يتمتع بها تصميم Neumorphism تجعله مناسبًا تمامًا للصمود أمام اختبار الزمن. ترجمة -وبتصرّف- للمقال The New Trend in UI Design: An Overview of Neumorphism Experience لصاحبه Kayode Osinusi. اقرأ أيضًا الدليل إلى تهيئة واجهة المستخدم UI دليل المبتدئين خطوة بخطوة لتصميم شعار
-
نلاحظ جميعًا أشكالًا مختلفة من الشعارات على العديد من المنصات، بدءًا من وسائل التواصل الاجتماعي والعلامة التجارية على أكياس التسوق، وحتى أكياس الشيبس، والسؤال لماذا نرى البعض وليس الكل؟ قد تكون لاحظت من قبل شعار دجاج كنتاكي KFC في الشارع على كيس ورقي مثلًا، وشعرت برغبة بعدها في تناول الدجاج المقرمش، فكيف تبادر هذا إلى أذهاننا؟ العلامة التجارية تُعَد العلامة التجارية المؤثرة والتي تصمم بطريقة احترافية ومناسبة، ذات أهمية كبيرة لتطوير الأعمال التجارية ونظرة الناس لها، سواءً كانت شركة تصنيع السيارات فورد Ford أو شركة نايكي NIKE العملاقة الرياضية، حيث يستخدم كلاهما استراتيجيات تصميم مختلفةً جدًا في عرض منتجاتهم. ومع ذلك، هناك شيء واحد تجده فيهما وهو البساطة المطلقة في التصميم، لم تكن هذه البداية الفعلية لعلامة فورد التجارية، فقد كان أول شعار لها في عام 1903 مزدحمًا للغاية وبأسلوب مختلف تمامًا، وكان تصميم الشعار في الأصل يحمل اسم Ford Motor Co مع إضافة المكان الذي نشأت فيه، كما كان محاطًا بحدود مزدحمة للغاية، وفيما يلي سنستعرض التغيير الذي أجروه حتى وصلوا للتصميم الذي يسهل التعرف عليه. اعتَمَد الشعار في عام 1909 تشطيبًا أصفى وأبسط كثيرًا للتصميم، بدلًا من تصميم الحدود المزدحمة السابق، ولم تستمر الخطة طويلًا، حيث تغيرت الصورة مرتين في عام 1912، وكانت النتائج جيدة، إذ صمد التصميم الأخير أمام اختبار الزمن مع تغييرات بسيطة للغاية في اللون وتعديلات طفيفة على مر السنين. تُظهر هذه النتيجة النهائية حقبة التصميم الحديثة الجديدة ومظهر الجودة الرفيعة المطلوب للحفاظ على صورة علامة تجارية ناجحة حتى اليوم، وتوضح كيف يجب أن تكون الشركات منفتحةً لتغيير صورتها لجني الثمار، إذ لن تُظهر الشعارات القديمة تطور الشركة على مر السنين، فقد كُرِّرت استراتيجية تغيير العلامة التجارية هذه من قِبل الشركات في جميع أنحاء العالم، لكن عملية إعادة تصميم شعارك تجعل القرار أكثر صعوبةً. الجمهور للتصميم بطريقة فعالة عليك أن تسأل نفسك: من هو جمهورك المستهدف؟ فلو كان الجمهور من الأطفال الصغار، فيُعَد شعار شركة تويز آر أص Toys “R” Us مثالًا جيدًا، بعناصر بسيطة وحروف ليست عريضةً أو قويةً. ولكنه يعطي شعورًا كما لو أن طفلًا كتبه ويظهر المرح، إذ يساعد ذلك في ربط العلامة التجارية مع جمهورها المستهدف، ويجعل الشعار أكثر صلةً بهم، ويعود هذا كله بالنفع للعلامة التجارية، كما يقود الجمهور الأكبر سنًا إلى فهم أنهم لو احتاجوا إلى شيء لأحد أفراد الأسرة الأصغر سنًا، فإن تويز آر أص Toys "R" Us هو المكان الصحيح لتلقي الخدمة الصحيحة. يختلف استخدام الألوان اختلافًا كبيرًا عن فورد، حيث تعبّر فورد عن سيارة موثوقة و مصنوعة باحتراف، وتختلف عن شركة البيع بالتجزئة تويز آر أص Toys “R” Us، حيث يجذب امتلاك شعارها لهذه الألوان العين بطريقة مختلفة، وخاصةً الجيل الأصغر الذين يرغبون بأشياء من فئة عمرية مختلفة تمامًا. يؤدي استخدام حرف "R" المعكوس إلى شعور بالمرح، بدلًا من تهجئته بشكل صحيح أو وضعه في الاتجاه الصحيح، لذا ما يجعل شعارك ملائمًا ومرتبطًا بالجمهور هو الاستخدام الجيد لألوان النص وتقنياته. الإبداع نرغب جميعنا بشعار مبدع لتحقيق نتائج أفضل، ومع ذلك عندما نفكر في شعار مبدع. يفكر الكثيرون في أبل Apple وستاربكس Starbucks وإيباي eBay مثلًا، وهم لم يتّصفوا دائمًا بالإبداع، حيث كان عليهم جميعًا البدء من مكان ما، والتطوير والتكيف للوصول إلى ما هم عليه الآن، إذ يكمن مفتاح التصميم الجيد في بساطة تصميم كل منها، فهي خالية من الحيل والتعقيدات في التصميم، بل تفتخر بجوهر الشعار الأصلي حيث بدأت. مازال يُشار للشعار الأصلي لشركة أبل Apple (السير إسحاق نيوتن يجلس تحت شجرة وأعلاه تفاحة مميزة جاهزة للسقوط) بالشعار الحالي مع لقمة من التفاحة، ويعود نجاحهم في الارتقاء في العقدين الماضيين -ليصبحوا قوةً عظمى عالميةً- إلى قوة ارتباطهم مع الجمهور. شعار ستاربكس Twin Tailed Siren هو الآن الصورة الرئيسية المتعلقة بعلامة ستاربكس التجارية، وقد كان في الأصل يحمل اسم الشركة جنبًا إلى جنب مع جملة "قهوة محمصة طازجة" في إطار حول Siren للإشارة إلى عملهم، ثم مرةً أخرى في عام 2011، حيث أزيلت الحدود التي تقول "قهوة ستاربكس" لتترك صورةً مقرَّبةً جدًا من Twin Tailed Siren، ويمكن التعرف على الصورة بسهولة من خلال الجمع بين بدايتها المتواضعة وتكيف التصميم بشكل طفيف مع الوقت بدلًا من بدء تصميم جديد. أظهر موقع إيباي eBay تغييرًا آخر في الاستراتيجية، والذي قد لا يبدو جذريًا، لكنه غير مفهوم، وقد خلق علامةً تجاريةً ودودةً أكثر، حيث تحولت "الحروف المجنونة" بأحجامها المختلفة وغير المنتظمة التي عُرِضت سابقًا، إلى تنسيق نص أبسط، وجميع الحروف في سطر واحد، مما أعطى مظهرًا ثلاثي الأبعاد تقريبًا. الإلهام توضح الأمثلة السابقة الطرق التي يعمل تصميم الشعار مع الشركات باختلاف الحجم والتاريخ لتقديم خدمة احترافية، جنبًا إلى جنب مع فهم كيفية تأثير ذلك على إدراك الجمهور وصلتهم به، حيث أصبح تصميم الشعار الاحترافي أكثر شيوعًا، مما جعل قوالب تصميم الشعارات الرخيصة تظهر على أنها سيئة الإنشاء ومستهلكة من فرط الاستخدام. قد تنجح محاولة تكرار نموذج أو تصميم آخر، ومع ذلك ينتقص هذا من الرحلة التي يمكن أن يتخذها تصميم شعار شركتك وعلامتها التجارية. القصة المفضلة لدي هي القصة وراء تصميم شعار لاكوست، فقد راهن رينيه لاكوست المالك ولاعب التنس على مباراة إذا فاز فيها سيحصل على حقيبة من جلد التمساح، ولسوء الحظ خسر المباراة والرهان، وأخذ لقب "التمساح"، مما دفعه إلى وضع التمساح المطرز على سترته، وقد أدى هذا إلى إنشاء علامة تجارية وإلى تصميم شعار لاكوست الذي لا يزال معروفًا للغاية. أنظمة الشعارات تندرج جميع التصميمات والقصص والإلهام المختلفة جدًا في الاتجاه الذي يتحرك فيه تصميم الشعار الاحترافي في الوقت الحاضر، ونشعر بأن أنظمة تصميم الشعارات أصبحت أكثر شيوعًا بعد رسومات جوجل Google doodles الشهيرة، فالاستخدام البسيط للإطار وإدخال الأحداث التاريخية، كلها تجعلها مشابهةً لجاذبية جوجل، وتتغير الرسومات doodles في جميع أنحاء العالم من حيث الموقع والأهمية الوطنية، وأي تحديثات في أخبار العالم، وذلك من أجل ضمان دقة جميع الرسومات وإضافة إحساس بالقيمة لمستخدم جوجل. يوجد استخدام رائع آخر لنظام تصميم الشعار الاحترافي هو العلامة التجارية إم تي في اللبنانية MTV، فتغيير الألوان واستخدام أشكال وتصميمات أكثر ديناميكيةً جعل الشعار أكثر جاذبيةً، وبجعلهم للشعار متغيرًا دائمًا فهم لا يعتمدون فقط على السابق، بل يمضون قدمًا لخلق شعار فريد ومحدث. عملت إم تي في اللبنانية MTV على تكييف تصميمها بهذه الطريقة لسنوات واستمرت في هذا الاتجاه، وسمح لهم هذا التكتيك بمجاراة الأحداث والتوجهات قبل منافسيهم. تُنفَّذ معظم أنظمة التصميم من قِبل المؤسسات الكُبرَى، حيث تمكّنها ميزانياتها من ذلك، كما يمكنهم تفويض هذه المهام لشركات أخرى لمجاراة آخر صيحات التصميم، وهذا يعني أن الشركات الصغيرة التي لديها ميزانيات أقل لتصميم الشعارات، من الأفضل لها تصميم شعار احترافي من البداية، بحيث تُنفَّذ صورة علامتها التجارية مرةً واحدةً . عندما يحين الوقت ويتطلب نمو عملك نهجًا فريدًا لاستراتيجية التسويق، فسيكون عملك أكثر ملاءمةً مع تكييف تصميمك وصورة علامتك التجارية أو الانتقال إلى نهج أنظمة الشعار. الاحترافية قد يعني الحصول على تصميم شعار احترافي دفع تكاليف أعلى للوهلة الأولى، وقد يُنظر إلى هذا بسلبية، لكنني أشعر أنه يعني أن التصميم الذي حصلت عليه بصورة احترافية، أكثر حداثةً من خيار تصميم الشعار السريع غير الاحترافي. لن يحتاج التصميم إلى التغيير، وبدلًا من ذلك يتكيف مع نمو عملك والاتجاه الجديد الذي تخطط للمضي قدمًا فيه، سواءً كان تعديلًا بسيطًا لتصميم علامتك التجارية، أو تقديم نظام تصميم شعار، فهناك العديد من الطرق للمضي قدمًا. ومع الطريقة التي يسير بها التصميم، من المفيد إنتاج شعار عالي الجودة من البداية بدلًا من محاولة مجاراة صيحات الغد. ما مدى أهمية الحصول على تصميم شعار احترافي من المهم لأقصى حد الحصول على تصميم شعار احترافي، إذ يمكنه إنشاء رابط بين المستهلك والشركات، ويجعل علامتك التجارية في طليعة احتياجات عملائك تلقائيًا من خلال الارتباط الإيجابي. يُعَد وجود تصميم شعار احترافي من البداية أمرًا بالغ الأهمية حتى يستمر على مر السنين، ولكن يخلق الانفتاح على التغيير شعورًا بالضغط من أجل المزيد، وفي النهاية يتجدد الاهتمام، مما يجعلك متقدمًا على منافسيك على المدى الطويل. كيفية إنشاء شعار احترافي تُعَد الشعارات من أهم مكونات موقعك على الويب ويمكن أن تساعد في تكوين انطباع أولي رائع، فالشعار هو العنصر الأكثر استخدامًا على موقع الويب وهو "الطابع" المرئي الذي يعرّف الشركة، لذا إليك النصائح التالية: استخدم دائمًا شعارك باستمرار. استخدم ملفات jpg. أو png. فقط. تجنب استخدام القوالب المجانية الجاهزة. تأكد من أن شعارك عالي الدقة. تجنب استخدام صور تحوي أشخاصًا بداخلها (يجب أن تكون الشخصية الموجودة في شعارك عامةً). استخدم ألوانًا متباينةً لشعارك. تأكد من أن شعارك يمكن قراءته بحجم صغير. تأكد من سهولة إعادة إنتاج شعارك. تأكد من أن شعارك لا يبدو أنه ينتمي إلى موقع آخر. ما هي تكلفة الاستعانة بشخص لتصميم الشعار السؤال الذي يُطرح كثيرًا عندما يتعلق الأمر بتصميم الشعار الاحترافي هو: كم سيكلف ذلك؟ الإجابة هي أنها ستكلفك بقدر ما تشاء من المجاني إلى بضعة آلاف، وسيعتمد ذلك على مقدار الوقت والبحث وجهد التصميم الذي سيخصص لتصميم شعارك، ومع ذلك تتعلق تكلفة الشعار بالقيمة المتصورة، حيث يُنظر إلى الشعار على أنه شيء ثمين للغاية، ومثل الألماس كلما بذلت المزيد من الوقت والجهد، زادت التكلفة. إذًا كم يستحق بالنسبة لك؟ ماذا يستخدم المحترفون لتصميم الشعارات يستخدم المصممون مجموعةً من البرامج لإنشاء شعاراتهم، ومنها برامج التصميم الأساسية مثل أدوبي إليستريتور Adobe Illustrator وسكيتش Sketch وكورل درو Corel Draw، ويستخدم بعض المصممين أدوبي فوتوشوب Adobe Photoshop بصفته برنامج التصميم الأساسي لهم، بينما يستخدم الآخرون أدوبي إليستريتور Adobe Illustrator بصفته أداةً مفضلةً لهم، وبرنامج كورل درو Corel Draw الذي له شعبية عند مصممي الشعارات، وبالنهاية تسمح جميع هذه البرامج الأساسية بتصميم الشعارات. كيف يمكنني إيجاد شخص لتصميم الشعار سيفي البحث السريع في Google عن "مصمم شعار محترف" بالغرض. يتقاضى هؤلاء المصممون مبالغ مختلفةً، كما يمكن البحث عن مصممين عبر مواقع العمل الحر والخدمات المصغرة مثل مستقل وخمسات وغيرها ﻹيجاد مصممين من مختلف المستويات ومختلف القيم المادية. كم من الوقت يستغرق تصميم الشعار يُعَد إنشاء شعار أو هوية العلامة التجارية عمليةً معقدةً تتطلب العديد من الخطوات، وتتطلب كل خطوة معلومات وإبداعًا وعصفًا ذهنيًا وبصيرةً وصبرًا ووقتًا، لذا عليك اتباع الخطوات التالية: البحث: من أين تريد أن تبدأ؟ ما هي مهمتك؟ ما هي أهدافك؟ ما نوع الشعار الذي سيمثل شركتك على أفضل وجه؟ العصف الذهني: استكشف العديد من الأفكار، حيث سيساعدك البحث على إنشاء مناهج متعددة. المسودة الأولية: أنشئ بسرعة مفهوم التصميم الأول، وبعد الاختيار والمراجعة أنشئ مسودةً ثانيةً. المسودة النهائية: راجع مفهوم التصميم حتى يصبح مثاليًا. التنفيذ: نفّذ الشعار بطريقة متسقة، وثبّت الخطوط والألوان والعناصر الأخرى. التشطيب: أنتِج الشعار بصورته النهائية. ترجمة -وبتصرّف- للمقال How Valuable is a Professional Logo Design? Experience. اقرأ أيضًا علم نفس الألوان في تصميم العلامات التجارية أساسيات ابتكار العلامة التجارية دليل المبتدئين خطوة بخطوة لتصميم شعار
-
تُعرَف الألوان في عالم التسويق بتوصيلها للمعاني العميقة وتجميلها للأشياء، تخيل عالمًا لا يرى فيه الناس الألوان ويعيشون بالأسود والأبيض فقط. عندها قد يصعب الشعور بسعادة العقل الباطن فيه، ومن المعروف أن الألوان تجعل كل شيء ينبض بالحياة، حتى أوراق الشجر لها درجات مختلفة من الألوان في كل موسم، وتؤثر فينا في كل مرة ننظر إليها. لذلك تُعَد الألوان أداة اتصال قويةً تؤثر بسهولة على الحالة المزاجية وردود الفعل، ويسعى العديد من مالكي العلامات التجارية لإحداث تأثير نفسي قوي على المشترين، لذا يستخدمون علم نفس الألوان في العلامات التجارية، وذلك لجعل صورتهم ساحرةً ولجذب جمهور أكبر. فمثلًا، ألقِ نظرةً على شعار موقع Gaming Verge، حيث له لون أحمر معروف بالعاطفة، ويحتوي الموقع على مزيج جيد من الألوان، مثل الأحمر والأبيض، كما يركز الموقع على تقنية الألعاب، وقد اختيرت الألوان الحمراء والبيضاء بعناية لجذب جمهور الألعاب، أي اللاعبين العاطفيين والمتحمسين، كما يصور الإخلاص بين اللاعبين وما بينهم من سلام خالٍ من التوترات، وهذه طريقة استراتيجيات التسويق لاستخدام مجموعة متنوعة من الألوان، وذلك لإظهار التعاطف والدفء للغالبية العظمى من الناس. تؤدي تركيبات الألوان وخياراتها في تصميم الشعار دورًا كبيرًا في إحداث تأثير هائل على المستهلكين، لذا فلنُلقِ نظرةً على ما تعنيه الألوان وكيف يصور علم نفس الألوان معاني أعمق في العلامة التجارية. أنواع مخططات الألوان Color Schemes الألوان المتماثلة Analogous. الألوان أحادية اللون Monochrom. الألوان المكملة complementary. الألوان المتممة المقسمة Split complementary. اﻷلوان الثلاثية Triadic. الألوان الرباعية المستطيلة Rectangle. الألوان الرباعية المربعة square. كل لون له معنى عميق أو خفي لا يمكن معرفته إلا بإجراء بحث متعمق، لكن لتسهيل الأمر عليك وتوفيرًا لوقتك، سنناقش معظم الألوان التي ستؤثر على الغالبية العظمى من الجمهور. 1. الأحمر ينبض اللون الأحمر بالحياة وهو الأكثر وضوحًا، كما أنه مليء بالطاقة والقوة والعاطفة، ويجذب الأحمر انتباه كل الأشخاص تقريبًا، وكأنه يصرخ لأجل شيء مفاجئ، لذا يوجد اللون الأحمر على سيارات الإطفاء، وكلما مرت ننتبه لها بسرعة ونشعر بالقلق. بالإضافة إلى ذلك، فإن اللون الأحمر مليء بالطاقة، ويعطي شعورًا جريئًا وشابًا، وعلاوةً على ذلك هو لون محبوب من غالبية الناس حول العالم. يُظهِر اللون الأحمر كذلك ردود فعل عاطفيةً شديدةً وقويةً، لذلك يقال إن رؤيته تؤدي إلى ارتفاع مفاجئ في معدل ضربات القلب ويفتح الشهية كذلك، ولهذا قد ترى الكثير من درجات اللون الأحمر في العديد من شعارات العلامات التجارية للأطعمة، وغالبًا ما تستخدم الكثير من المطاعم أو العلامات التجارية المتعلقة بالطعام أو الوجبات الخفيفة اللون الأحمر لجذب الانتباه. تشير جامعة سبون أيضًا إلى أن اللون الأحمر يسرّع من تدفق الدم، وبمجرد زيادة تدفق الدم تزيد سرعة عملية التمثيل الغذائي وتصبح جائعًا وتريد المزيد، ومن الأمثلة على هذه الشعارات، نجد كلًا من ليز Lays وماكدونالدز Mcdonalds ودجاج كنتاكي KFC وبرجر كنج Burger King ووينديز Wendy’s، وغيرها. لذا لو كنت ترغب في جذب الآخرين نحو منتجاتك ومواقعك الإلكترونية عبر إثارة الجوع لديهم، فسيكون الأحمر هو خيارك المناسب. 2. الأزرق إذا كنت تخطط لتصميم شعارك باللون الأزرق، فعليك أن تفهم التأثير النفسي للون الأزرق في العلامة التجارية، حيث يعطي بعض المعاني العميقة، ويمنح شعورًا بالهدوء والمنطقية والسلام، وفوق ذلك يجعل علامتك التجارية تبدو جديرةً بالثقة ويُعتمد عليها. تُرى الشعارات باللون الأزرق عادةً على زجاجات المياه، وبما أن الأزرق هو لون السماء والمحيط، فستشعر تلقائيًا بأنك قد رويت عطشك، لذا لو رغبت بزرع شعور بالارتياح لدى جمهورك حتى يشعروا بأن شعارك وعلامتك التجارية جديرة بالثقة، فيجب أن تفكر في ملء شعارك باللون الأزرق لأنه يُعَد أكثر جاذبيةً ويبعث المودة للجمهور، ومن أفضل الأمثلة على الشعار الأزرق هي فيسبوك وتويتر. 3. اللون الأخضر من المعروف عالميًا أن اللون الأخضر يمثل الطبيعة، ويمثل شيئًا طازجًا عند الحديث عن الصحة وما إلى ذلك، فعندما تتجول بين الجبال، ستشعر بالهدوء؛ وعندما تتنفس هذا الهواء النقي، ستشعر أنك مليء بالطاقة الأرضية، وتجد التوازن والانسجام. يعطي اللون الأخضر أيضًا شعورًا بالاسترخاء والنقاهة لأنه لون الطبيعة، ويمثل اللون الأخضر النمو والتجديد وبعث الحياة كذلك، كما يرتبط بالثروة والمال، وغالبًا ما ترى هذا اللون على العملة. عندما تختار هذا اللون، فهذا يعني أنك تريد أن تخبر جمهورك أن منتجاتك عضوية للغاية وأن شركتك صديقة للبيئة، ويمكن أن يكون مناسبًا كذلك للشركات المالية لأنه يذكّر الجمهور لا شعوريًا بالمال، ومن أبرز الأمثلة على الشركات أو العلامات التجارية التي تحمل شعارًا أخضر، نجد كلًا من آيسر Acer وستاربكس Starbucks وأندرويد Android وتروبيكانا Tropicana، وغيرها. 4. الأصفر يثير هذا اللون الشعور بالبهجة والسعادة الكاملة، ويمكن أن يُنظر إليه على أنه يمثل التفاؤل والكثير من الطاقة والشباب والشعور بالحماس، وكلما رأيت لونًا أصفر، سيمنحك ذلك عمومًا شعورًا بالود والأمل، كما يمكن أن يكون اللون الأصفر هو اللون الذي يجذب انتباه الناس بسرعة، حيث يُعَد كذلك علامةً على الحذر، ولهذا نرى هذا اللون في إشارات التحذير على جوانب الطريق، والتي تعطي بسرعة فكرةً واضحةً للناس عما ينتظرهم. إذا اخترت هذا اللون لتصميم شعارك، فتأكد من أنه ليس ساطعًا جدًا أو مزعجًا أو يجهد العين، واختر الدرجة المناسبة التي إذا رآها العملاء في شعارك تنقل لهم الرسالة الصحيحة للسعادة والود والطاقة الإيجابية. 5. البرتقالي تحصل على اللون البرتقالي عند مزج اللونين الأحمر والأصفر، وهما من الألوان الأساسية، لكن إلى ماذا يرمز هذا اللون؟ حسنًا، من المعروف أنه لون دافئ يُظهر السعادة والحماس والإثارة، ومن المعروف كذلك أنه مرتبط بالمرح والحيوية، ونعني بالحيوية أنه مرتبط بالصحة كذلك، وقد تكون رأيت هذا اللون غالبًا على أقراص الكالسيوم التي تمد الناس بالطاقة وتشعرهم بالقوة والحيوية، وعادةً ما يستخدم المسوقون اللون البرتقالي لإبراز مكان في المنتج يحتاج لإجراء معين، وهذا أسلوب معروف وناجح مع المشترين المتسرعين. تُعَد أمازون Amazon وفايرفوكس Firefox وفانتا Fanta وشل Shell وغيرها، من الأمثلة الشهيرة التي لها علامة تجارية مستندة على اللون البرتقالي، لذا إذا كنت تريد أن يرسل شعارك رسالةً مفادها أنه ودود وحيوي جدًا ومبهج، فسيكون اللون البرتقالي مثاليًا لشعارك، حيث سيجعل علامتك التجارية تُرى على أنها واثقة ومرحة. 6. اللون الوردي يُعَد اللون الوردي ناعمًا ولطيفًا وأنثويًا يعبّر عن الدفء والطاقة والمرح، وغالبًا ما يصوّر اللون الوردي الحلاوة والحب، لذا ترى هذا اللون في شعارات، مثل دانكن دونتس Dunkin donuts وباسكن روبنز Baskin Robbins وباربي Barbie وهالو كيتي Hello kitty وغيرها. عادةً ما يرتبط اللون الوردي في الشعارات بالأنوثة، ويستخدم عمومًا في الشعارات لجذب النساء أو استهدافهم، لذا تحتاج للحصول على الصورة الأنثوية، وإذا كنت ستبيع أطعمةً حلوةً، فأنت بحاجة إلى هذا اللون في شعارك لنقل رسالة إلى الجمهور مفادها أن شركتك حيوية وممتعة ومرحة. 7. اللون الأرجواني يُظهر اللون الأرجواني الملكية والحكمة والاحترام، وهو مرتبط بالإبداع والخيال كذلك، ويربط علم نفس الألوان اللون الأرجواني في العلامة التجارية بالرفاهية، مثل كادبوري Cadbury وتاكو بل Taco Bell وياهو Yahoo ورالف لورين Ralph Lauren، وما إلى ذلك. يصور اللون الأرجواني كذلك إحساسًا بالخيال أو الغموض أو السحر الذي يثير شعورًا بالحكمة والخيال، لذا غالبًا ما ترى هذا اللون بدرجات متنوعةً في شعارات ماركات التجميل، خاصةً تلك التي تحتوي على منتجات مقاومة للشيخوخة. ولأنه يمنح الفخامة والخيال، فهو يجذب المستهلكين الذين يرغبون في أن يُنظر إليهم على أنهم حكماء أو أثرياء، أو أولئك الذين يميلون أكثر نحو السحر أو الغموض. وفوق ذلك، فإن اللون الأرجواني عادةً ما يكون له طابع ملكي مثل الأزمنة القديمة، حيث ابتكر الناس الصبغة الأرجوانية من القواقع، وكان معروفًا أنها باهظة الثمن، حيث لم يتمكن سوى الأثرياء مثل أفراد العائلة المالكة من تحمل تكاليفها، وهذا هو السبب في أنك ترى اللون الأرجواني على المنتجات الراقية التي تؤكد على الفكرة المتميزة للعلامات التجارية، مثل رولكس Rolex وHallmark Crown Royal والمزيد. لذلك إذا كنت تقدم للعالم منتجًا من الدرجة الرفيعة، فاللون الأرجواني هو المناسب في العلامة التجارية لجذب المستهلكين حسب علم نفس الألوان. 8. اللون الرمادي يعطي اللون الرمادي أو الفضي في الغالب شعورًا بالرقي والنضج والتواضع والاستقرار والحياد، ويستخدم ليربط الأشخاص الذين يرون هذا اللون بالخلود ورباطة الجأش، لذا يظهر هذا اللون في الغالب على شعارات العلامات التجارية الشهيرة، مثل مرسيدس بنز Mercedes Benz وأبل Apple ونيسان Nissan وويكيبيديا Wikipedia، وغيرها. يمكن أن يرتبط اللون الرمادي بالعواطف السلبية مثل الاكتئاب أو الحزن، ولكن له دلالةً إيجابيةً كذلك ويبرز الجانب الفاتن، ويمكن أن يُعَد لونًا أنيقًا وجميلًا. 9. اللون الأسود الأسود هو اللون المفضل لكثير من الناس في جميع الأوقات، ويُرمز في علم نفس الألوان في العلامات التجارية إلى الحزم والتطور وقمة الأناقة والجدية والحصرية، وغالبًا ما يكون هذا اللون عاديًا، لكنه يُظهر أناقة وبريق المنتجات الفاخرة، فإذا كان لشركتك شعار أسود، فربما يعني ذلك أنك لا تستخدمه لجذب الانتباه، لكنك تريد أن يُنظر إلى شركتك على أنها شركة راسخة تتمتع بسمعة طيبة وأناقة، وتريد أن يكون شعارك جزءًا من تلك الرغبة،، حيث لا تحتاج لألوان براقة لتوصيل الرسالة، ومن الأمثلة على العلامات التجارية الشهيرة التي تستخدم شعارات سوداء اللون، نجد كلًا من: بلاك آند ديكر Black & Decker ونيويورك تايمز New York Times وأديداس Adidas وبوما Puma ونايكي Nike وغوتشي Gucci وبرادا Prada وشانيل Chanel وبولو Polo وهوندا Honda، وغيرها. 10. اللون الأبيض يمتزج اللون الأبيض دائمًا مع الألوان الأخرى بطريقة رائعة، ويعزز الألوان ويبرزها عند استخدامه في تركيبات معهم، كما يمثل النقاء والأمان والنظافة، ويرتبط غالبًا بالإخلاص والسكينة والبساطة، ويمكن رؤية الأبيض مقترنًا باللون الأسود في محاولة لتصوير التوازن والانسجام والحياد، وتوجد لكل علامة تجارية تقريبًا نسخة بالأبيض والأسود من تصميمها. استنتاجات من علم نفس الألوان في العلامات التجارية عندما تبدأ بعملية التسويق، فلا تستخف بأي شيء، إذ لكل شيء استخدامه وغرضه، حتى الألوان، ويمكن لعلم نفس الألوان في العلامة التجارية أن يترك انطباعًا قويًا لدى العديد من المستهلكين ويؤثر على قرارات الشراء، وهذا هو سبب تجميع هذه المقالة معًا لتُظهِر لك ما يصوره كل لون والمعنى العميق له ولماذا تمتلئ شعارات العديد من الشركات بالألوان، لذلك عندما تريد تسويق منتج أو موقع ويب أو فتح شركة خاصة بك، لهذا فكِّر مليًا في الألوان. ترجمة -وبتصرّف- للمقال Colour Psychology in Branding: Choosing Logo Colours Experience لصاحبته Sarah. اقرأ أيضًا دليلك لاختيار تركيبات الألوان عند تصميم مواقع للعملاء أفضل 12 أداة انتقاء للألوان لمصممي الويب أساسيات ابتكار العلامة التجارية قواعد تصميم الهوية البصرية
-
يُعَد تصميم العلامة التجارية للشركات والمنظمات والأشخاص أو المنتجات وأي شيء آخر، خطوةً أساسيةً في رحلة التسويق، فهي أول خطوة عندما تنشئ شيئًا جديدًا وتدخله للسوق، ويستحيل تسويق شيء ما وإقناع الناس به بدون العلامة التجارية والهوية المميزة. ما هي أساسيات ابتكار العلامة التجارية يعود ظهور فكرة العلامة التجارية Branding لمربّي الماشية الذين استعملوها لتمييز ماشيتهم، وكان حينها رمزًا ماديًا يوضع على الحيوان ليظهر للناس أنه ينتمي لمزرعة معينة، ولم تتغير الفكرة العامة كثيرًا. هوية العلامة التجارية brand identity هي ما تستخدمه لإظهار ملكيتك للشيء الذي تسوقه، حتى لو كان هذا الشيء هو أنت بشخصك، تمامًا مثل الشخصيات المؤثرة على مواقع التواصل الاجتماعي، ويُعَد تصميم شعارك تكرارًا واضحًا لفكرة مربّي الماشية. يدرك الناس أن هذه الشركة أو المنتج أو الخدمة وما شابهها مملوكة لعلامة تجارية معينة فور رؤيتهم للشعار، ويخبرهم الشعار عن العلامة التجارية بما إذا كانت تخص شركةً عاديةً أو ترفيهيةً أو متخصصةً بسوق معين. يقال الكثير بشعار واحد فقط، ومع ذلك فإن الشعار ليس العنصر الوحيد لهوية علامتك التجارية، بل تشمل كل شيء من الألوان المحددة التي تستخدمها إلى الانطباع العام الذي تتركه علامتك التجارية للناس، لذا عند بناء هوية علامتك التجارية، عليك أن تدرك أن كل خيار تتخذه سيؤثر على هذا الانطباع، ومن هنا يجب أن تكون حريصًا في سبب وكيفية تشكيل هذا الانطباع. كيف تبني هوية العلامة التجارية الأمر ليس بسيطًا مثل اختيار بعض الألوان التي تريدها وإنشاء صورة جميلة لشعارك، وعليه إذا رغبت في بناء هوية تجارية قوية تستمر لسنوات، فأنت بحاجة للبحث وإجراء تحليل سليم، وفهم تأثير الخطوط والألوان والنغمة والأسلوب على السوق المستهدف. 1. فكر بشأن القيمة المقدمة عليك أولًا معرفة ما ستقدمه لجمهورك المستهدف، فالقيمة المقدمة لعملائك هي ما ستميّز علامتك التجارية وتجعلها فريدةً من نوعها، ويصبح هذا أمرًا سهلًا عندما تقدم خدمةً أو منتجًا لم يقدمه أي شخص آخر من قبل، ومع ذلك لا يعقل أن تتمتع علامتك التجارية بالأصالة المطلقة، لكن لا يعني هذا عدم قدرتك على التميز وتحقيق المبيعات، فمثلًا، قد يحظى مطعم بيتزا بالتفرد لأنه يستخدم صلصةً خاصةً أو لديه أسماء وجبات مضحكة في قائمته؛ أو قد يتمتع محل غسيل السيارات بالأصالة لأن فيه مقهًى رائعًا للعملاء لاستخدامه أثناء انتظارهم، وتوجد الكثير من القواسم المشتركة بين قيمتك المقدمة والجمهور المستهدف، لذا يجب أخذها معًا في الحسبان. 2. ابحث عن جمهورك المستهدف عليك الآن تحديد من الذي تتحدث إليه، حيث تحتاج أي علامة تجارية -سواءً كانت لشخصية مؤثرة أو شركة مالية- إلى جمهور مستهدف، إذ سيحدد هذا الكثير حول كيفية ظهور علامتك التجارية وتفاعلها مع الناس، لذا يجب توجيه كل خيار تتخذه بشأن علامتك التجارية لخدمة الجمهور المستهدف، وهناك عدة طرق يمكنك استخدامها، بما فيها استخدام علم البيانات لرؤية الصورة الأكبر. 3. راقب منافسيك بعد ذلك، راقب ما يفعله المنافسون، عليك التأكد من أنك لا تتشابه كثيرًا مع أحدهم، لكن في الوقت نفسه، لا تكن مختلفًا جدًا بحيث لا يتعرف عليك نفس الجمهور المستهدف بنفس السرعة. من الضروري أن تنظر جيدًا إلى منافسيك لترى كيف يمكنك أن تتميز عنهم، وهذه واحدة من أساسيات بناء العلامة التجارية التي تعطيك نقطة انطلاق رائعةً لهوية علامتك التجارية. 4. أنشئ صورة عامة للعلامة التجارية من أسهل طرق التواصل مع جمهورك المستهدف هو الصورة العامة، فمثلًا لو كنت تمثل شركة تأمين للنساء، فسوف تستهدف غالبًا النساء اللاتي تحت سن الأربعين، وهذا ما يجب أن تعكسه صورتك العامة، حيث تُعَد تلك أفضل طريقة لإنشاء علاقة حقيقية واتصال حقيقي مع جمهورك المستهدف، وكلما كنت محددًا في بحثك عن الجمهور المستهدف، سيسهل عليك أن تكون محددًا في تكوين شخصية لعلامتك التجارية. 5. ابدأ في التصميم بهذا تكون جاهز أخيرًا للبدء في عناصر التصميم الأساسية لهوية علامتك التجارية، ويجب أن تكون محطتك الأولى هي الشعار. عليك التفكير في الألوان التي سوف تستخدمها والخط ونمط الشعار، وتذكر أن الألوان وراءها مشاعر ويمكن أن تشير إلى أشياء مختلفة لمجموعات مختلفة من الناس، لذا تأكد من الاختيار بحكمة ووضع جمهورك المستهدف في الحسبان. أثناء تصميم شعارك أو الحصول على اختصاصي تصميم لتجهيزه لك، فكّر في كيف ستستخدم الشعار والألوان عبر عناصر التسويق المتنوعة، وفكّر في الشكل الذي سيبدو عليه في مختلف ألوان الخلفيات، وكيف يمكنك استخدام الشعار بالكامل في أماكن، وجزء صغير منه فقط في أماكن أخرى. وخير مثال على ذلك هو التسويق بالهدايا، مثل حامل الكوب وزجاجات المياه والمظلات والملابس وغيرها الكثير، فالهدف هو التناسق في الجوانب المرئية لأساسيات علامتك التجارية. 6. ضع إرشادات التنسيق في الأخير، يمكننا القول أنه قد حان الوقت للتفكير في اللغة التي سوف تستخدمها، وكيف ستتفاعل علامتك التجارية مع العالم الخارجي، حيث تُعَد إرشادات التنسيق مستندًا أساسيًا، وذلك لأنها المكان الذي تحدد فيه قواعد لهجتك وطريقة التحدث أو الكتابة لعلامتك التجارية، لذا يجب أن تبدأ بشخصية علامتك التجارية والسوق المستهدف والتفكير في أنواع العبارات التي يستخدمونها في الكلام اليومي. كن محددًا في إرشادات التنسيق، وضع قائمةً تتضمن استخدام الاختصارات والكلمات العامية المقبولة، وقدم فكرةً عن العبارات التي تفضلها. هل علامتك التجارية دافئة وجذابة؟ أم أنها رائعة وجريئة؟ سيؤثر هذا على كيفية كتابة أوصاف المنتج على موقع الويب الخاص بك أو اللغة التي تستخدمها على وسائل التواصل الاجتماعي. الخلاصة إن بناء هوية علامة تجارية ناجحة من البداية لا يأتي من فراغ، بل يستغرق اتباع أساسيات العلامات التجارية هذه وقتًا وجهدًا وبحثًا وتخطيطًا دقيقًا، ويتطلب بناء هوية العلامة التجارية المتميزة استراتيجيةً مَصُوغةً بعناية، والنتيجة هي علامة تجارية بارزة ولا تُنسى، ولها استجابة عند العملاء المحتملين. ترجمة -وبتصرّف- للمقال Branding Basics: How to Create a Successful Brand Identity From Scratch Experience. اقرأ أيضًا كيف تختار اللون المثالي لعلامتك التجارية الدليل المفصل لصنع علامة تجارية أكثر تركيزا على الفيديو النسخة العربية الكاملة من كتاب مدخل إلى تجربة المستخدم (User Experience - UX)
-
قد تصاب بالإحباط أحيانًا عند تفاعلك مع المواقع والتطبيقات. ألم تصادف من قبل رابطًا أو صورةً أو أيقونةً لا تستجيب لك كما ينبغي مهما كررت النقر عليها؟ لو حصل هذا معك، فستفهم معنى نقرات العصبية. تحدث نقرات العصبية عندما يكرر المستخدمون النقر على عنصر أو مكان محدد في وقت قصير، وبطبيعة الحال يتوقع المستخدمون استجابة الواجهات الرقمية لهم بفاعلية، ويشعرون بالغضب لعدم استجابتها، وتُعَد نقرات العصبية -وغيرها من أشكال الغضب على الحاسوب- تجسيدًا ماديًا لهذا الشعور. ماذا تعني نقرات العصبية عادةً ما يُعَد تكرار حدوث نقرات العصبية على موقع وتطبيق أو أي واجهة مستخدم أخرى بمثابة دليل على حدوث خلل مع المستخدم، ومن الأسباب المحتملة لذلك: النص المحير أو عناصر واجهة المستخدم لقد أصبحت بعض التصاميم لواجهات المستخدم أكثر انتشارًا وشيوعًا على مر السنين، حتى أصبح بعضها مثل العرف السائد بالتصميم، وقد تسبب مخالفتها أو تغييرها ارتباكًا للمستخدمين الذين طالما اعتادوا على عمل أشياء بطريقة معينة، فقد درجت العادة على فهم النصوص التي أسفلها خط مثلًا، على أنها روابط، وعليه سوف نتوقع من المستخدمين النقر عليها، مما يعني أن وجود نص تحته خط -ولا يمكن النقر عليه- قد يؤدي إلى سوء فهم من المستخدم الذي يتوقع وجود رابط، وبالتالي سيسبب نقرات العصبية. الاستجابة البطيئة وقلة الردود نقر المستخدمين على عنصر ما وعدم تلقيهم استجابةً سريعةً سيجعلهم يكررون النقر لكي يتأكدوا من أن النقرة قد حدثت فعلًا، ويحتاج المستخدمون في هذه الحالة إلى رسالة أو أي مؤشر بصري آخر؛ ليساعدهم في أن يشعروا بأن أفعالهم لها تأثير. الأعطال والعناصر والروابط التالفة سوف يغضب المستخدمون عند عدم استجابة العنصر الذي يفترض أنه يعمل بالعادة، لذا من الضروري التأكد من أن كل العناصر والروابط محدثة وتعمل جيدًا. العناوين المبهمة والتصفح المربك يرغب المستخدمون في أن يكون المحتوى المهم بارزًا وواضحًا، ويودون أن يعلموا يقينًا ما سيجدون عندما ينقرون على عنوان أو قسم في شريط التنقل، لذا يجب أن يكون التنقل واضحًا قدر الإمكان، ومع تصنيفات يتوقعها المستخدم، قد تؤدي فئات التنقل المبهمة والتصنيف غير الواضح إلى نقرات العصبية بكثرة. ستحدث نقرات العصبية غالبًا إذا عجز المستخدم عن إيجاد طريقة أخرى للوصول لما يريده في الواجهة، وعليه إذا لم يُجدِ النقر، فماذا سيفعلون؟ في هذه الحالات يجب تعديل واجهة المستخدم لتوجيه المستخدمين بوضوح أكثر. كيف يمكنك معرفة حدوث ذلك يمكنك مراقبة تفاعل المستخدمين في موقعك باستخدام أدوات مثل أداة hotjar لتسجيل جلسة المستخدم، حيث تسمح لك بتتبع تحركاتهم على الموقع مثل النقرات والتمرير، لتكشف عن كيفية تفاعل المستخدمين مع موقعك، حتى إن بعض الأدوات فيها ميزة مخصصة للكشف عن نقرات العصبية بالذات لتساعدك في معرفتها تحديدًا. إن ما تبدو للحظة أنها نقرات عصبية قد لا يكون دائمًا سببها خللًا في واجهة المستخدم، فمن المهم ملاحظة السياق عندما تجد منطقة نقر مكثف. في بعض الحالات، يكرر الأشخاص النقر بدافع العادة أثناء قراءة الصفحة أو تفحصها، ولا يعني ذلك بالضرورة أنهم محبطون أو غاضبون. وبالطبع، عند ملاحظتك نقرًا متكررًا باستمرار على عناصر أو مناطق معينة، وكان من عدة مستخدمين مختلفين، فسيكون هذا هو الوقت المناسب للتعمق أكثر وتحديد الأسباب. لكن تستدعي بعض العناصر بطبيعتها تكرار النقرات، مثل أزرار التكبير zoom أو الصوت، في مثل هذه الحالات قد لا تدل النقرات المتكررة على الإحباط، بل تشير ببساطة إلى تفاعل المستخدمين مع الصفحة، وقد يكون من المفيد مراجعة هذه العناصر على أي حال لمحاولة إيجاد طريقة أكثر فاعليةً لوصول المستخدمين لهدفهم. كيف نحول نقرات العصبية لإجراءات تحسين استفادت شركة Cyber-Duck من نقرات العصبية بوصفها علامةً إرشاديةً في إجراء تحسينات على تجربة المستخدم UX لأحد عملائهم، وهي شركة للإسكان. وبمشاهدتهم لتسجيلات جلسة المستخدم بأداة Hotjar، لاحظ فريق تجربة المستخدم UX أن نقرات المستخدمين تشير لحدوث مشاكل في الوصول لما يريدون، كما تشير لصعوبة في العثور على المعلومات المهمة. وبسبب خيارات التنقل المربكة أو المخفية في القوائم المنسدلة العمودية، نقر 339 مستخدمًا مختلفًا نقرات عصبيةً على مدى ثلاثة أشهر، مع تركيز معظم هذه النقرات على مناطق معينة في الموقع. وفي النهاية، فقد المستخدمون الأمل بالعثور على المعلومات بأنفسهم ولجأوا لصفحة الاتصال في الموقع، وأجروا مكالمات هاتفيةً لفريق خدمة العملاء، مما أضاع الكثير من وقت فِرَق العمل الداخلية للإجابة على الاستفسارات، ومن جهة أخرى شعر المستخدمون بالإحباط لعجزهم عن إيجاد المعلومات بأنفسهم. أجرى فريق شركة Cyber-Duck بحثًا موسعًا على المستخدمين لتحديد كيف يمكنهم تبسيط وتحسين تجربة المستخدم على موقع الويب، وحددوا أن أحد الأهداف الرئيسية لهذه الشركة هو مساعدة المستخدمين على خدمة أنفسهم عند بحثهم عن معلومات يحتاجونها، ولتحقيق ذلك ركزوا على أربعة مبادئ أساسية هي: إمكانية الوصول والمرونة والبساطة وإمكانية العثور. وشملت قاعدة المستخدمين (عينة البحث) مجموعةً واسعةً من الأعمار ومستويات الإلمام بالحاسوب، حيث يجب أن يكون الموقع بديهيًا ومفهومًا للجميع، وليس فقط خبراء الحاسوب، ورغبوا في التأكد من إرشاد المستخدمين إلى المعلومات المهمة بسهولة، فعند شعورهم بقدرتهم على خدمة أنفسهم، يمكن تجنب المشاعر السلبية التي غالبًا ما تقود لنقرات العصبية، كما سيقلل ذلك من لجوئهم للمكالمات الهاتفية، والتي تُعَد عبئًا إضافيًا على فريق خدمة العملاء. وأجروا البحث في سبيل الكشف عن الأسباب الكامنة وراء نقرات العصبية، ومن أكثر مواضع الشكوى التي وجدوها هو وجود عدد كبير جدًا من الخيارات في شريط التنقل الأصلي وتصنيفات مبهمة، وكبر حجم المعلومات المعروضة، مما يربك المستخدمين، بحيث لا يعلمون أين ينقرون. ولحل هذه المشكلة، أرادوا فرز المستخدمين من بداية رحلتهم على الموقع عن طريق جعلهم يختارون أي نوع من العملاء هم، وهذا يعني أنهم لن يروا سوى المحتوى المتعلق بهم، وصمموا شريط تنقل جديدًا بخيارات أقل وفئات فرعية أكثر، مما ساعد في تسهيل رحلة المستخدم وتوجيهه نحو المحتوى الصحيح. يفرز شريط التنقل المبسط أهداف المستخدم إلى 4 فئات رئيسية لتوجيه المستخدمين نحو المكان الذي يريدونه، ثم تُقسَّم الإجراءات الرئيسية إلى أنواع أو إجراءات أخرى، ومن هنا يوجَّه المستخدمون إلى المجالات الفرعية أو صفحات أخرى على الموقع، ويجدون فيها مزيدًا من خيارات التنقل. من الأفكار المنبثقة الأخرى: تقسيم المحتوى الطويل إلى أجزاء أكثر وضوحًا لتحسين إمكانية قراءتها. تحسين آلية البحث وتقديم الموضوعات ذات الصلة لإعطاء المستخدمين مسارات متعددةً للعثور على المطلوب. توفير إجراءات واضحة لتساعد المستخدمين للوصول لأهدافهم. وبعد مرحلة التفكير، أنشأت الشركة إطارات شبكيةً للموقع ونماذج أوليةً تتضمن هذه الأفكار، وأثناء اختبار قابلية الاستخدام ، تلقوا تعليقات إيجابيةً عن مدى الوضوح وسهولة الاستخدام في التصميمات الجديدة، وعلق أحد المستخدمين قائلًا إن التصميمات الجديدة بسيطة بما يكفي ليتمكن حتى غير الملم بالحاسوب من العثور على مراده. كما يأملون مستقبلًا أن هذه التحديثات في واجهة المستخدم للموقع UX ستحدث تجربةً رقميةً أكثر بساطةً وسهولةً، ويتوقعون تسجيل عدد أقل من نقرات العصبية نتيجةً لهذه التغييرات. كيف نستفيد من نقرات العصبية قد تشعر بالأسف عند رؤية إشارة مثل هذه بما تدل عليه من إحباط المستخدم عند مراقبتك للجلسة، ولكنها توفر فرصةً تعليميةً قيّمةً، حيث تكون نقرات العصبية بطبيعتها مُركَّزةً في منطقة معينة على الموقع، مما يسمح لك بالتركيز على أجزاء محددة جدًا لمعرفة طبيعة الخطأ وسببه. وبالتعمق في نقرات العصبية، ستحدد الخطوات التي يجب اتخاذها لجعل واجهة المستخدم أكثر وضوحًا وسهولةً في الوصول وأكثر بديهيةً، بل يمكن أن يكون للتغييرات البسيطة تأثير كبير على جودة تجربة المستخدم، وفي المقابل قد يحدث هذا فرقًا كبيرًا في معدلات التحويل والأهداف. ترجمة -وبتصرّف- للمقال What Rage Clicks Can Tell Us About User Experience لصاحبته Jessica Graham. اقرأ أيضًا دور المنهج العلمي والحدس في تجربة المستخدم مخرجات تصميمية يجب على كل مصمم تجربة مستخدم أن يتقنها تصميم تجربة المستخدم من خلال بيانات وإحصائيات المستخدمين