توسيع تصميمك
تصميم متعدد الوسائط
"سابا زيدي" و"أولاس كيرازجي"، يتحدّثان عن تصميم إجراءات متعددة الوسائط في مؤتمر Google I/O لعام 2018
شرح تفصيلي
مكوّنات المحادثات
يتم دمج مكوّنات المحادثة لإنشاء المحتوى في رسائل المطالبة المنطوقة والعبارات المعروضة على الشاشة والشرائح.
يجب تصميم مكوّنات المحادثات (الإشعارات والشرائح) لكل منعطف للحوار.
إشعار شفهي | المحتوى الذي يتحدث "الإجراء" مع المستخدم من خلال تقنية "تحويل النص إلى كلام" أو الصوت المسجَّل مسبقًا |
عرض الإشعار | المحتوى الذي يكتبه "الإجراء" إلى المستخدم من خلال النص المطبوع على الشاشة |
شرائح الجمهور | اقتراحات حول كيفية مواصلة المستخدم للمحادثة أو إجراء تغيير جذري فيها |
![](https://developers.google.cn/static/assistant/conversation-design/images/responsecomponents.png?authuser=8&%3Bhl=ar&hl=ar)
العناصر المرئية
تشمل المكوّنات المرئية البطاقات ولوحات العرض الدوّارة وغيرها من مواد العرض المرئية.
وتُعدّ هذه المكوّنات مثالية للمسح الضوئي والمقارنة بين الخيارات، لأنّ المكوّنات المرئية تكون مفيدة إذا كنت تقدّم معلومات مفصّلة، ولكنها غير مطلوبة لكل دور في الحوار.
البطاقة الأساسية | يمكنك استخدام البطاقات الأساسية لعرض صورة ونص للمستخدمين. |
لوحة عرض دوّارة للتصفّح | تم تحسين منصّات العرض بعناصر متغيّرة للتصفّح للسماح للمستخدمين باختيار أحد العناصر المتعددة عندما تكون هذه العناصر محتوى من الويب. |
لوحة العرض الدوّارة | تم تحسين منصّات العرض بعناصر متغيّرة للسماح للمستخدمين باختيار أحد العناصر المتعددة، عندما يمكن تمييز هذه العناصر بسهولة عن طريق صورة. |
القائمة | تم تحسين القوائم للسماح للمستخدمين باختيار أحد العناصر المتعددة عندما يكون من السهل تمييز هذه العناصر حسب العنوان. |
الاستجابة للوسائط | تُستخدَم الردود على الوسائط لتشغيل وتشغيل المحتوى الصوتي مثل الموسيقى أو الوسائط الأخرى. |
جدول | تُستخدم الجداول لعرض البيانات الثابتة للمستخدمين بتنسيق يمكن مسحه بسهولة. |
يمكنك تجميع الأجهزة حسب المكوّنات المستخدمة للردّ:
بالنسبة إلى المحادثات على مكبّرات الصوت أو سماعات الرأس الذكية، تعرض رسائل المطالبة المنطوقة المحادثة بأكملها وتنقل الرسالة الأساسية.
بالنسبة إلى المحادثات في السيارة أو على الشاشة الذكية، قد لا تكون الشاشة متاحة دائمًا للمستخدم. لذلك، يجب أن تعرض رسائل المطالبة المنطوقة معظم المحادثة وإيصال الرسالة الأساسية. يمكن استخدام الشاشة للحصول على معلومات مرئية تكميلية بالإضافة إلى اقتراحات لمواصلة المحادثة أو تحويلها إلى محور.
تكون المحادثات على التلفزيون أو الكمبيوتر المحمول أو الهاتف أو الساعة مناسبة بشكل متساوٍ لإدخال الصوت أو إخراجه والتفاعلات المستندة إلى الشاشة. يمكن للمستخدم اختيار مواصلة المحادثة إما من خلال طريقة العرض المنطوقة أو المرئية. لذا تعمل كل المكونات معًا لبدء المحادثة ونقل الرسالة الأساسية.
الانتقال من التحدّث إلى الوسائط المتعددة الوسائط
![](https://developers.google.cn/static/assistant/conversation-design/images/spokenonly-a.png?authuser=8&%3Bhl=ar&hl=ar)
ابدأ برسالة المطالبة الأصلية من المثال نموذج لمربّع حوار.
![](https://developers.google.cn/static/assistant/conversation-design/images/spoken-chips.png?authuser=8&%3Bhl=ar&hl=ar)
وفي معظم الأحيان، يمكنك إعادة استخدام الإشعار الشفهي نفسه على أجهزة مثل الشاشات الذكية، لأنّ الحاجة إلى نقل جوهر المحادثة تبقى كما هي.
في هذه المرحلة من المحادثة، لا يتوفر أي محتوى مناسب في المكوِّن المرئي، مثل بطاقة أو منصّة عرض بعناصر متغيّرة، لذلك لا يتم تضمين أي محتوى.
احرص على إضافة شرائح. ويجب على الأقل تضمين هذه الخيارات في رسائل المطالبة حتى يتمكّن المستخدم من النقر عليها بسرعة للردّ.
![](https://developers.google.cn/static/assistant/conversation-design/images/multi-novisual.png?authuser=8&%3Bhl=ar&hl=ar)
وبما أنّه لا يتوفّر أي محتوى قد يكون مناسبًا في مكوّن مرئي، لن يكون هناك أي محتوى يمكن نقله من رسائل المطالبة المنطوقة. وبالتالي، لا مشكلة في إعادة استخدام الملف الأصلي.
يجب أن تكون رسالة المطالبة المعروضة نسخة مكثفة من السؤال المنطوق ومُحسَّنة للمسح ضوئيًا. انقل أي خيارات ردّ إلى شرائح، ولكن تأكّد دائمًا من تضمين السؤال.
أعِد استخدام الشرائح نفسها التي أنشأتها للتو.
![](https://developers.google.cn/static/assistant/conversation-design/images/spokenonly-b.png?authuser=8&%3Bhl=ar&hl=ar)
ابدأ برسالة المطالبة الأصلية من المثال نموذج لمربّع حوار.
يُرجى العلم أنّ القائمة المنطوقة تضمّ 6 عناصر كحدّ أقصى (من إجمالي 17 عنصرًا) لتقليل العبء المعرفي. يتم اختيار المواضيع عشوائيًا لعدم تفضيل موضوع واحد على موضوع آخر.
![](https://developers.google.cn/static/assistant/conversation-design/images/multi-nodisplay.png?authuser=8&%3Bhl=ar&hl=ar)
ويمكننا مرةً أخرى إعادة استخدام الإشعار المنطوق نفسه، لأنّه لا يمكننا افتراض أنّ المستخدم ينظر إلى الشاشة.
إنّ تضمين قائمة مرئية بكل المواضيع يساعد المستخدم على التصفّح والاختيار. يُرجى ملاحظة أنّ القائمة المرئية لجميع العناصر البالغ عددها 17 عنصرًا (مقسمة إلى صفحات) تظهر بترتيب أبجدي، ما يسهّل على المستخدمين البحث عن الموضوع الذي يريدونه.
بما أنّ القائمة تعدّ المواضيع التي يمكن اختيارها، لا حاجة إلى تضمينها كشرائح. وبدلاً من ذلك، يمكنك تضمين خيارات أخرى مثل "لا شيء من هذه الخيارات" لتقديم تجربة للمستخدم.
![](https://developers.google.cn/static/assistant/conversation-design/images/multi.png?authuser=8&%3Bhl=ar&hl=ar)
يمكننا هنا افتراض أنّ المستخدم يملك الإذن بالوصول إلى الصوت والشاشة بالتساوي. بما أنّ النمط المرئي أكثر ملاءمةً للقوائم، يمكنك الاستفادة من هذه القوة من خلال توجيه المستخدم إلى الشاشة لاختيار موضوع. يتيح لنا ذلك تقصير الكلام الذي يتم قوله إلى نظرة عامة على قائمة وسؤال بسيط.
يجب الاحتفاظ بالسؤال فقط في رسالة العرض.
أعِد استخدام الشريحة نفسها التي أنشأتها للتو.
العلاقة بين الإشعارات
بشكل عام، يتم تحسين الإشعارات التي يتم قولها بصوت عالٍ واتّباع اصطلاحات المحادثات التي يتم قولها. يتم تحسين رسائل المطالبة الصوريّة واتّباع اصطلاحات المحادثات المكتوبة. وعلى الرغم من اختلاف الأمر قليلاً، يجب أن تنقل الرسالة الأساسية نفسها.
صمِّم إشعارات للأذن والعين على حد سواء. من الأسهل البدء بالرسالة المنطوقة، من خلال تخيل ما يمكنك قوله في محادثة بين شخصين. وبعد ذلك، يمكنك اختصاره لإنشاء إشعار العرض.
قول الغرض الأساسي
![](https://developers.google.cn/static/assistant/conversation-design/images/relationbtwnprompts1-do.png?authuser=8&hl=ar)
الإجراءات التي يُنصح بها
احتفِل بالقصة نفسها بدءًا من السؤال الذي يتم قوله حتى ظهور رسالة المطالبة.
![](https://developers.google.cn/static/assistant/conversation-design/images/relationbtwnprompts1-dont.png?authuser=8&hl=ar)
لا تفعل ذلك.
لا توجِّه المستخدم إلى موضوع أو تجربة تفريع مختلفة.
يجب أن تكون رسائل المطالبة على الشبكة الإعلانية مستندة إلى نُسخ مكثفة من نظيراتها المنطوقة
![](https://developers.google.cn/static/assistant/conversation-design/images/relationbtwnprompts2-do.png?authuser=8&hl=ar)
الإجراءات التي يُنصح بها
استخدِم رسائل المطالبة المعروضة المكثفة.
![](https://developers.google.cn/static/assistant/conversation-design/images/relationbtwnprompts2-dont.png?authuser=8&hl=ar)
لا تفعل ذلك.
لا تكرِّر المطالبات المنطوقة.
الحفاظ على اتساق الصوت والنبرة
![](https://developers.google.cn/static/assistant/conversation-design/images/relationship-between-prompts3do.png?authuser=8&hl=ar)
الإجراءات التي يُنصح بها
التركيز على الشخصية
![](https://developers.google.cn/static/assistant/conversation-design/images/relationship-between-prompts3dont.png?authuser=8&hl=ar)
لا تفعل ذلك.
تجنَّب تصميم رسائل مطالبة تبدو وكأنها واردة من شخصيات مختلفة.
صمِّم الإشعارات المنطوقة والمحتوى الذي يُعرض على الشاشة ليفهمها المستخدمون بشكل مستقل.
![](https://developers.google.cn/static/assistant/conversation-design/images/relationship-between-prompts4do.png?authuser=8&hl=ar)
الإجراءات التي يُنصح بها
إذا طرحت سؤالاً، تأكّد من أنه يظهر في كلا السؤالين، حتى يعرف المستخدم الإجراء التالي الذي يجب فعله.
![](https://developers.google.cn/static/assistant/conversation-design/images/relationship-between-prompts4dont.png?authuser=8&hl=ar)
لا تفعل ذلك.
لا تعتمد على الإشعارات المنطوقة وحدها لبدء المحادثة. ويمكن أن يؤدي ذلك إلى حدوث ارتداد عندما لا يتمكن المستخدم من سماعها. هنا، إذا لم يتم كتم صوت الجهاز، لن يسمع السؤال.
العلاقة بين المكوّنات
تذكّر أنّ جميع المكوّنات تهدف إلى تقديم استجابة موحّدة واحدة.
غالبًا ما يكون من الأسهل البدء في كتابة رسائل مطالبة بتجربة بلا شاشة، والتفكير مجددًا في ما يمكنك قوله في محادثة بين شخصين. ثم تخيل كيف يمكن أن تتغير المحادثة إذا كان أحد المشاركين يحمل شاشة تعمل باللمس. ما التفاصيل التي يمكن حذفها الآن من مكوّنات المحادثات؟ وعادةً ما يتم تقليل عدد الإشعارات التي تظهر على الشاشة بشكل كبير، لأنّ المستخدم يمكنه فهم المعلومات المرئية بسهولة كما يمكن أن تظهر في رسالة المطالبة المعروضة. يمكنك تجميع المعلومات بطريقة لا تُضطر المستخدم إلى الرجوع بينها وبين إشعار العرض المرئي بشكل متكرر.
تضمين السؤال دائمًا في رسائل المطالبة
![](https://developers.google.cn/static/assistant/conversation-design/images/turntaking-do.png?authuser=8&hl=ar)
الإجراءات التي يُنصح بها
اذكُر عبارة الحث على اتخاذ إجراء بطرح سؤال.
![](https://developers.google.cn/static/assistant/conversation-design/images/turntaking-dont.png?authuser=8&hl=ar)
لا تفعل ذلك.
وعندما تم عرض هذا التصميم، لم يأخذ العديد من المستخدمين دورهم.
تجنُّب التكرار
![](https://developers.google.cn/static/assistant/conversation-design/images/relationbtwncomponents2-do.png?authuser=8&hl=ar)
الإجراءات التي يُنصح بها
نشر المعلومات عبر رسالة المطالبة المعروضة والمكوّن المرئي
![](https://developers.google.cn/static/assistant/conversation-design/images/relationbtwncomponents2-dont.png?authuser=8&hl=ar)
لا تفعل ذلك.
تجنَّب استخدام جميع العناصر بدءًا من المكوّن المرئي إلى الإشعارات. ركِّز على المعلومات الأساسية فقط.
يُرجى تقديم إجابة قصيرة في رسائل المطالبة وتفاصيل في العناصر المرئية.
![](https://developers.google.cn/static/assistant/conversation-design/images/put-deets-in-card-do.png?authuser=8&hl=ar)
الإجراءات التي يُنصح بها
استخدِم رسائل المطالبة المعروضة والمعروضة لتقديم إجابة محدّدة عن سؤال المستخدم الموجّه (في الساعة 11:30 صباحًا في هذا المثال). يمكنك استخدام العناصر المرئية للحصول على تفاصيل ذات صلة.
![](https://developers.google.cn/static/assistant/conversation-design/images/put-deets-in-card-dont.png?authuser=8&hl=ar)
لا تفعل ذلك.
تجنُّب التكرار بين السؤال المنطوق والموجَّه إلى الشاشة والعناصر المرئية
حتى عندما تقدّم المرئيات أفضل إجابة، تأكّد من أنّ رسائل المطالبة تبقى أساسية للرسالة.
![](https://developers.google.cn/static/assistant/conversation-design/images/relationbtwncomponents4-do.png?authuser=8&hl=ar)
الإجراءات التي يُنصح بها
استخدِم الإشعارات لتقديم نظرة عامة. استخدام العناصر المرئية لتقديم تفاصيل إضافية
![](https://developers.google.cn/static/assistant/conversation-design/images/relationbtwncomponents4-dont.png?authuser=8&hl=ar)
لا تفعل ذلك.
لا تفرض على القارئ إجراء المسح الضوئي والقراءة. يجب أن تقلل شخصيتك من العمل الذي يحتاج إليه المستخدم، والذي يشمل سهولة البحث عن طريق المعلومات التفصيلية.
تشجيع المستخدمين على الاختيار من القوائم أو منصّات العرض بعناصر متغيّرة، مع السماح لهم بمواصلة البحث باستخدام الطلبات الصوتية
![](https://developers.google.cn/static/assistant/conversation-design/images/relationbtwncomponents5-do.png?authuser=8&hl=ar)
الإجراءات التي يُنصح بها
شجِّع المستخدم على الاطّلاع على القائمة.
![](https://developers.google.cn/static/assistant/conversation-design/images/relationbtwncomponents5-dont.png?authuser=8&hl=ar)
لا تفعل ذلك.
لا تعرض بيانات القائمة الكاملة.