نمط الغمر

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

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

قبل البدء

يتوفر المصدر الكامل للعبة Charades على جيت هب. ننصحك باستيراده إلى Android Studio قبل البدء، لأنّ هذا الدليل يشير إليه بشكل كبير.

  1. من شاشة البدء السريع، انقر على الدفع من الإصدار Control > Git.
  2. انسخ عنوان URL الخاص بالنسخ من Charades.
  3. ألصِق عنوان URL للنسخة المستنسخة في عنوان URL لمستودع Vcs وانقر على استنساخ.
  4. انقر على نعم في الشاشة التالية.
  5. انقر على حسنًا في الشاشة التالية.
  6. أنشئ المشروع وشغِّله على جهاز Glass المتصل بالنقر على الزر تشغيل. احرص على الاطّلاع على README للنموذج للحصول على تفاصيل الاستدعاء.

ما ستتعرَّف عليه

وستتعرف على كيفية استخدام مكونات من حزمة SDK لنظام التشغيل Android لإنشاء الجزء الأكبر من تجربة Charades الدمج ثم مجموعة أدوات GDK لجذب المستخدمين إلى تجربة استخدام Glass. وفي ما يلي قائمة بالموضوعات التي ستتعرَّف عليها:

  • تصميم تدفق انتقال واجهة المستخدم باستخدام موارد التصميم التي نقدمها
  • تصميم المشغلات الصوتية لبدء تشغيل Glassware
  • استخدام أنشطة Android لتحديد بنية واجهة المستخدم الخاصة باللعبة
  • إنشاء عناصر في قائمة Android تتيح للمستخدمين تحديد خيارات اللعبة
  • الدمج في تجربة Glass مع تشغيل الصوت في القائمة الرئيسية
  • استخدام أدوات رصد إيماءات GDK التي ترصد البيانات التي يُدخلها المستخدم وتنفّذ الإجراءات المخصّصة
  • تعلّم استخدامات بسيطة لواجهة مستخدم Android تضيف لمسة من اللمعان وتتّبع نمط Glass
  • التعرف على عملية التوزيع والأشياء التي نبحث عنها عند طرح Glassware

التصميم

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

بالطبع، يعد تصميم Glassware عملية تكرارية وتتغير بعض الأشياء التي تصممها الآن، ولكن إنجاز جزء كبير من هذا العمل في البداية أمر بالغ الأهمية لبناء تجربة رائعة.

مسار واجهة المستخدم

يعد تصميم تدفق واجهة المستخدم تمرينًا بسيطًا ويتيح لك تصور Glassware قبل كتابة سطر من التعليمات البرمجية. نحن نفعل ذلك طوال الوقت في Glassware التي ننشئها!

لنستعرض العناصر الرئيسية لواجهة المستخدم في دمج Charades، حتى تحصل على فكرة عن كيفية عمل واجهة المستخدم ومدى فائدة هذه العملية عند إنشاء Glassware الخاص بك.

شاشة البداية

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

عندما ينقر المستخدمون على لوحة اللمس، يظهر نظام قوائم به عنصرين هما: لعبة جديدة وتعليمات.

وضع التعليمات

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

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

وضع أسلوب اللعب

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

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

شاشة نتائج اللعبة

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

بطلب صوتي

ينبغي أن تكتشف أمرًا صوتيًا في وقت مبكر إلى حد ما من عملية التصميم. تتيح الأوامر الصوتية للمستخدمين بدء تشغيل Glassware من القائمة الصوتية لـ Glass Home (بطاقة الساعة)، إذا لزم الأمر، وهي جزء رئيسي من كيفية تصميم Glassware.

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

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

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

تنسيقات البطاقات

سواء أردت إنشاء عروض غامرة أو بطاقات مباشرة، عليك استخدام CardBuilder أو تنسيقات XML متى أمكن.

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

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

التطوير

ولتطوير تجربة غامرة، يمكنك استخدام الأدوات نفسها التي تستخدمها في تطوير Android لإنشاء الجزء الأكبر من Glassware، ثم تستخدم واجهات برمجة التطبيقات في إضافة GDK للدخول إلى الوظائف الخاصة بـ Glass، مثل أدوات كشف الإيماءات والأوامر الصوتية.

ستستخدم بشكل متكرر مكونات Android الشائعة لإنشاء Glassware، ولكن ضع في اعتبارك أن بعض المفاهيم تختلف في بعض الأحيان. على سبيل المثال، لا تساوي الاندماج في نشاط Android. تُعد المتعة تجارب مصمَّمة لـ Glass التي تم إنشاؤها باستخدام نشاط واحد أو أكثر من أنشطة Android، بالإضافة إلى العديد من المكونات الأخرى من GDK وAndroid SDK.

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

إليك لمحة موجزة عن المكونات الرئيسية لـ Charades:

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

بطلب صوتي

يمكنك إنشاء أوامر صوتية باستخدام ملف مورد XML يحدد الأمر الذي تستخدمه، ثم تحديد مورد XML في ملف AndroidManifest.xml.

ترتبط الملفات التالية بالأمر الصوتي لـ Charades:

  • res/xml/voice_trigger_play_a_game .xml: تعريف الطلب الصوتي المطلوب استخدامه
  • AndroidManifest.xml: يعلِن عن النشاط للبدء عند قول الأمر الصوتي.

نشاط شاشة البداية

شاشة البداية هي أول ما يراه المستخدمون عند بدء تشغيل Charades وتوجيههم قبل بدء اللعبة.

الملفات التالية مرتبطة بهذا النشاط:

  • res/layout/activity_start_game.xml: تعريف تنسيق شاشة البداية
  • res/menu/start_game.xml: تعريف نظام القائمة لشاشة البداية الذي يحتوي على تعليمات وعناصر القائمة لعبة جديدة
  • res/values/dimens.xml - يوضح أبعاد البطاقة العادية والمساحة المتروكة التي تستخدمها أنشطة هذا المشروع لاتّباع نمط Glass.
  • src/com/google/android/glass/sample/charades/StartGameActivity.java - الفئة الرئيسية لشاشة البداية
  • res/drawable-hdpi/ic_game_50.png - رمز القائمة للعبة جديدة
  • res/drawable-hdpi/ic_help_50.png - رمز القائمة للاطّلاع على التعليمات

نموذج اللعبة

يُفضل دائمًا فصل نموذج اللعبة (حالة اللعبة) عن واجهة المستخدم. تتتبّع الفئة CharadesModel نتيجة اللعبة وعدد العبارات التي تم تخمينها في وضع اللعب والتعليمات المختلفة وما إذا كان المستخدمون قد تعاملوا معها في وضع التعليمات أم لا.

الملفات التالية مرتبطة بطراز اللعبة:

  • src/com/google/android/glass/sample/charades/CharadesModel.java

نشاط اللعبة الأساسية

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

الملفات التالية مرتبطة بهذا النشاط:

  • res/layout/activity_game_play.xml - لتحديد التنسيق الذي تتم مشاركته بواسطة أسلوب اللعب وأوضاع التعليمات في Charades.
  • src/com/google/android/glass/sample/charades/BaseGameActivity.java - تحدّد هذه السمة الوظيفة الأساسية لأسلوب اللعب وأوضاع التعليمات في لعبة Charades، التي تتم مشاركتها

نشاط التعليمات

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

الملفات التالية مرتبطة بهذا النشاط:

  • src/com/google/android/glass/sample/charades/TutorialActivity.java - لتوسيع BaseGameActivity وتحديد نص التعليمات الذي يجب عرضه وكيفية التعامل مع الإيماءات أثناء اتّباع المستخدمين لتعليمات اللعبة.

نشاط أسلوب اللعب

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

الملفات التالية مرتبطة بهذا النشاط:

  • GamePlayActivity - لتوسيع BaseGameActivity وتتضمن المنطق الرئيسي لتدفق الألعاب

نشاط النتائج

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

الملفات التالية مرتبطة بهذا النشاط:

  • res/layout/game_results.xml - تحديد تنسيق بطاقة "انتهت اللعبة"
  • res/layout/card_results_summary.xml: لتحديد تنسيق عرض الكلمات التي تم تخمينها وتلك التي لم يتم تخمينها في قائمة.
  • res/layout/table_row_result.xml: لتحديد تنسيق صف فردي لملخّص النتائج.
  • src/com/google/android/glass/sample/charades/GameResultsActivity.java - يحدد النشاط الفعلي الذي يُظهر التنسيقات والقوائم المحددة بواسطة موارد XML المذكورة أعلاه.
  • res/raw/sad_trombone.ogg - الصوت الذي سيتم تشغيله عندما لا يتمكّن المستخدمون من فهم جميع الكلمات.
  • res/raw/triumph.ogg - الصوت الذي يتم تشغيله عندما يقرأ المستخدمون جميع الكلمات العشر.
  • res/drawable-hdpi/ic_done_50.png: رمز علامة الاختيار الذي يظهر بجانب الكلمات التي تم تخمينها بشكل صحيح

موارد الصور المتحركة

تضيف موارد الرسوم المتحركة هذه لمسة إضافية على Charades:

  • res/anim/slide_out_left.xml - يؤدي هذا إلى تحريك طريقة عرض خروج للانزلاق إلى اليسار (عند مرور كلمة مثلاً).
  • res/anim/slide_in_right.xml - يؤدي هذا إلى تحريك طريقة عرض دخول من اليمين (على سبيل المثال، عندما تظهر كلمة جديدة).
  • res/anim/tug_right.xml - يحدد هذا العنصر رسمًا متحركًا جذابًا إذا قمت بالتمرير سريعًا على طريقة عرض لا تستهلك التمرير السريع. يتيح ذلك للمستخدمين معرفة أن التمرير السريع ليس له أي تأثير.

بيان Android

يصف ملف AndroidManifest.xml المكونات الرئيسية لـ Glassware حتى يعرف النظام كيفية تشغيلها. يعلن بيان تشارادز عن الأشياء التالية:

  • رمز Glassware واسمه. ويعرض Glass هذه المعلومات في قائمة اللمس الرئيسية في حال استجابة أكثر من Glassware واحد للأمر الصوتي نفسه.
  • جميع الأنشطة المرتبطة بـ Charades. وهذا أمر ضروري حتى يعرف النظام كيفية بدء أنشطة Glassware.
  • عبارة عن الطلب الصوتي وفلتر الأهداف الذي يبدأ نشاطًا محددًا عند قول الأمر الصوتي.
  • رمز إصدار Glassware. يجب تحديث هذا الرمز (وعادةً ما يكون اسم الإصدار كذلك) في كل مرة يتم فيها تحميل إصدار جديد من حزمة APK هذه إلى MyGlass.