دليل شامل لتصميم الإخطار

نشرت: 2022-03-11

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

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

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

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

تصميم الإخطار لتحسين تجربة المستخدم

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

  • نوع المعلومات التي يتم توصيلها
  • مدى إلحاح المعلومات - ما إذا كانت بحاجة إلى رؤيتها على الفور
  • ما إذا كان إجراء المستخدم مطلوبًا كنتيجة للمعلومات

بصرف النظر عن أسلوب وسلوك الإخطارات ، يجب تحديد نغمتهم بواسطة نسخة UX. يجب أن تكون جميع النسخ الموجودة في الإخطارات واضحة وموجزة ومفيدة. تم تصميم نظام إعلام جيد التصميم أيضًا مع وضع إمكانية الوصول في الاعتبار ولديه المرونة لاستيعاب اللغات المختلفة.

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

تصميم إطار إخطار رائع مع إقرارات

استخدام أفضل من خلال تصميم إعلام أفضل

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

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

أراد مصممو UX بدوام كامل في الولايات المتحدة

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

إنه يعمل بنفس الطريقة مع منتج رقمي. تُعد رؤية حالة النظام والتعليقات أمرًا أساسيًا عندما يتعلق الأمر بقابلية الاستخدام ، وقابلية الاستخدام هي حجر الأساس لتجارب المستخدم الرائعة.

تصميم UX لإخطار لوحة أجهزة القياس في السيارة

إنشاء إطار عمل إعلام مفيد

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

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

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

تصميم إطار عمل الإخطار

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

الاهتمام العالي

  • تنبيهات (مطلوب اهتمام فوري)
  • أخطاء (مطلوب اتخاذ إجراء فوري)
  • استثناءات (حالات شاذة في النظام ، شيء ما لم ينجح)
  • التأكيدات (الإجراءات التي من المحتمل أن تكون مدمرة والتي تحتاج إلى تأكيد المستخدم للمتابعة)

متوسط ​​الاهتمام

  • تحذيرات (لا يلزم اتخاذ إجراء فوري)
  • شكر وتقدير (ملاحظات على إجراءات المستخدم)
  • رسائل النجاح

الاهتمام المنخفض

  • رسائل إعلامية (تُعرف أيضًا بالإشعارات السلبية ، شيء ما جاهز للعرض)
  • الشارات (عادةً على الرموز ، للدلالة على شيء جديد منذ آخر تفاعل)
  • مؤشرات الحالة (ملاحظات النظام)

تصميم الإخطار لإشعارات LinkedIn

تصميم تجربة مستخدم رائعة للإشعارات

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

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

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

  • ما الذي من شأنه أن يطلق الإخطار؟
  • ما نوع التعليقات التي يتم توصيلها؟
  • أين سيظهر الإشعار وكيف؟
  • ما هو الإخطار الذي يتطلب تفاعلًا فوريًا؟
  • هل الإخطار مستمر أم غير مستمر؟

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

نمط تصميم الإخطار في أنظمة التصميم المختلفة
حتى مجموعات أدوات واجهة المستخدم المعروفة تستخدم أطرًا ومصطلحات مختلفة لتصميم الإشعارات. (مصدر)

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

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

تصميم الإخطار للتنبيهات
يجب أن تظل التنبيهات المعروضة على لوحة معلومات B2B قابلة للوصول كجزء من التنقل العالمي.

أسئلة أخرى يجب طرحها عندما يتعلق الأمر بتعريف سلوك الإخطارات :

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

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

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

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

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

أفضل ممارسات الإخطار لـ Great UX

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

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

تصميم ux للإشعارات لإشعارات تطبيقات الجوال الصوتية من Google
إعلانات تطبيقات الجوال ورسائل النجاح وشكرات الشكر.

أفضل الممارسات لرسائل الخطأ

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

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

ملخص

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

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

تلخيص سريع للطريقة الصحيحة لتصميم الإشعارات:

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

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


اسمحوا لنا أن نعرف ما هو رأيك! يرجى ترك أفكارك وتعليقاتك وملاحظاتك أدناه.

• • •

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

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