دليل أسلوب واجهة المستخدم في إضافات Google Workspace

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

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

النصوص والصور

يوضّح لك هذا القسم كيفية استخدام النصوص والصور بشكل صحيح في إضافتك.

اسم الإضافة

يجب ضبط اسم الإضافة في مشروعها. البيان ووقت ضبط الإضافة للنشر يظهر الاسم في عدة أماكن، مثل Google Workspace Marketplace القائمة وضمن القوائم. عند اختيار اسم:

  • استخدِم حالة أحرف العنوان.
  • تجنَّب استخدام علامات الترقيم، وخاصةً الأقواس، ما لم تكن جزءًا من علامتك التجارية.
  • اجعلها قصيرة، فمن الأفضل استخدام 15 حرفًا أو أقل. قد تكون الأسماء الطويلة يتم اقتطاعه تلقائيًا في بطاقة بيانات Google Workspace Marketplace وفي أي مكان آخر.
  • لا تُدرِج الكلمات "Google" أو "Gmail" أو أسماء منتجات Google الأخرى. في اسم الإضافة.
  • لا تضمِّن كلمة "إضافة". في اسم الإضافة.
  • اترك معلومات الإصدار.

أسلوب الكتابة

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

عند كتابة نص في واجهة المستخدم:

  • استخدِم حالة أحرف الجملة (خاصةً للأزرار والتصنيفات وإجراءات البطاقة).
  • تفضيل النصوص القصيرة والبسيطة بدون المصطلحات أو الاختصارات.

الإجراءات العامة وإجراءات البطاقة

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

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

رسائل الخطأ

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

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

محتوى المساعدة

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

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

الصور

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

عناصر التحكّم

يقدم هذا القسم إرشادات بشأن تجربة المستخدم التطبيقات المصغّرة التفاعلية.

الأزرار

يمكنك استخدام الأزرار للتحكم في الإجراءات الرئيسية لواجهة المستخدم بدلاً من أدوات أخرى.

  • يجب أن تبدأ معظم تصنيفات الأزرار النصية بفعل.
  • يجب أن تقتصر صفوف الأزرار على ثلاثة أزرار أو أقل في معظم الحالات.

DecoratedText

التطبيقات المصغّرة DecoatedText تتيح لك تقديم المحتوى النصي باستخدام رموز أو أزرار أو مفاتيح تبديل.

  • استخدِم حالة أحرف الجملة في المحتوى النصي.
  • يتم اقتطاع نص التطبيق المصغَّر الخاص بـ DesignatedText إذا لم يتمكن من ملاءمته المساحة المتوفرة. لهذا السبب، حاول دائمًا جعل المحتوى النصي قصير قدر الإمكان.

إدخالات التحديد

يمكنك استخدام مجموعة متنوعة من تحديد التطبيقات المصغّرة للإدخال في الإضافة: مربعات الاختيار المنسدلة ومربعات الاختيار وأزرار الاختيار.

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

إدخالات النص

تتيح الإدخالات النصية للمستخدمين إدخال بيانات السلسلة.

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

العلامة التجارية

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

في الإضافة

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

  • يجب أن تتبع جميع جوانب الإضافة إرشادات بناء هوية العلامة التجارية
  • لا تُدرِج كلمة "Google" أو "Gmail" أو أسماء منتجات Google الأخرى.
  • لا تضمِّن رموز منتجات Google، حتى إذا تم تعديلها.
  • لا تضمِّن كلمة "إضافة". في نص علامتك التجارية.
  • يجب ألا يزيد نص العلامة التجارية عن بضع كلمات.

في Google Workspace Marketplace

عند ضبط الإضافة للنشر تقدم عددًا من الأصول الرسومية والنصية لإنشاء بيانات Google Workspace Marketplace

يجب أن تتّبع جميع جوانب بطاقة بيانات المتجر ومواد العرض هذه إرشادات بناء هوية العلامة التجارية