UX المبادئ التوجيهية لتصميم لعبة الهاتف المحمول

صورة

منذ أكثر من 10 سنوات ، كنت أعمل كمصمم للألعاب في شركات ناجحة للغاية (مصمم ألعاب كبير في Matific ، مصمم ألعاب رائد في TabTale ، مالك ألعاب Lookandfeel) ، وقد امتلكت طوال هذا الوقت الامتياز والقدرة على استخدام البيانات الواردة من مئات الملايين من المستخدمين من كل العالم. لقد حان الوقت لتبادل معلوماتي مع العالم.

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

"من المؤسف أن نخيب أملك ، لكن فكرتك لم تنجح."


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

واجهة المستخدم الموقع


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


ألقِ نظرة على أمثلة مأخوذة من مختلف ألعاب الجوال:


كما ترون ، في أكثر المناطق التي يسهل الوصول إليها ، من الأفضل وضع العناصر التفاعلية التي تؤدي إلى تحقيق الدخل:

زر المتجر

المزيد من التطبيقات

إعلان


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

الزواحف


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

فيما يلي خمسة أمثلة لتصاميم المنزلق ، بما في ذلك التمرير الأفقي أو العمودي المستخدم لتحديد عالم ، ومتجر ، واختيار فئة المناظر الطبيعية / الكائن ، واختيار فئات صورة / كائن ، وإعداد الصورة الرمزية:


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

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


النوافذ المنبثقة


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

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


النصائح:

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

اختيار المستخدم (عبر النوافذ المنبثقة)


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


كما ترون ، نستخدم هنا قاعدة مثبتة:

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


توجد قرارات المستخدم ، السيئة للعبة ، على الجانب الأيسر من النافذة المنبثقة - بصفتنا مصممين للألعاب ، لا نريد من اللاعبين الخروج من اللعبة أو قطع الاتصال أو إعادة ضبط التقدم ، إلخ:


على الرغم من أنك قد تعتقد أن هذا هو UX مظلم ، في الواقع ، فإن هذا المبدأ يساعد المستخدم إلى حد كبير - لا نريد من المستخدمين إعادة تعيين تقدمهم عن طريق الخطأ؟ مهما كان الأمر ، فإن الهدف الرئيسي هنا هو توجيه المستخدمين إلى الحل الذي تحتاجه ، وهو أمر جيد لألعاب KPI (عمليات الشراء داخل اللعبة (IAP) ، والاحتفاظ ، والمشاركة ، والفيروسية ، منشورات المستخدم على الشبكات الاجتماعية (المشاركة ) وهلم جرا).

نصيحة: قم بربط لون الزر بوظيفته (سلبية - حمراء ، موجبة - خضراء ، محايدة قد تكون زرقاء).

مكافأة الفيديو


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

يجب أن تبدو الأيقونة التي تمثل إعلان الفيديو للمكافأة كلوحة سينمائية مع رمز تشغيل (لقد اختبرنا العديد من الرموز المختلفة وهذا تبين أنه الأفضل).



فيما يلي بعض الأمثلة على العروض لمشاهدة مقاطع الفيديو المكافئة من ألعاب الجوال المختلفة:


كمصمم للألعاب ، يجب أن تفكر جيدًا في ماهية الجائزة ، وكيفية مكافأة المستخدم ، و "متى". الاستراتيجيات الرئيسية:

دائم - بعد مشاهدة الإعلان ، يحصل المستخدمون على جائزة لفترة غير محدودة (على سبيل المثال ، عنصر يضاف إلى المخزون ويبقى هناك بشكل دائم).

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

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


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

نصيحة: لا تخبر المستخدمين عن نوع المكافأة التي سيحصلون عليها لجعلها أكثر إثارة (حفز فضولهم ورغبتهم في الشعور بالدهشة وزيادة احتمالية مشاهدة الإعلانات).

كائنات قابلة للسحب


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

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


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

فيما يلي بعض الإرشادات المهمة للعمل مع الكائنات القابلة للسحب:

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



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

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

قيم مربعات حوار التطبيقات


يستخدم العديد من مصممي اللعبة مربع حوار Rate us مبكرًا ، ويحثون المستخدمين على تقييم تجربة اللعبة حتى قبل إبداء الرأي حولها. عند تنفيذها بشكل صحيح ، تساعد نافذة "Rate the game" في الحصول على تقييمات جيدة في المتاجر وتشجع الترويج العضوي. كيفية تنفيذه بشكل صحيح؟ يجب أن يرى المستخدمون هذه النافذة في المواقف التالية:

  • بعد اتخاذ خطوة جدية أو بعد لحظة مهمة (على سبيل المثال ، بعد هزيمة رئيس ، أو اجتياز المستوى ، أو الفوز في مباراة مهمة ، وما إلى ذلك).
  • بعد القيام بعدة خطوات صغيرة (على سبيل المثال ، بعد الفوز بـ 10 ميداليات).


لتعظيم احتمالية قيام المستخدمين بتقييم اللعبة ، يجب أن يكون لمربع الحوار "تقييم اللعبة" التصميم التالي:

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

نصيحة: لا تستخدم أبدًا عبارة "5 نجوم" - فهذا ينتهك قواعد Apple.

متجر الحوار


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


لتعظيم عدد مشتريات الإصدار الكامل ، يمكنك استخدام التوصيات التالية:

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

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

استنتاج


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

Source: https://habr.com/ru/post/ar470223/


All Articles