بهترین شیوه‌های طراحی قابل پخش

بهترین روش‌های طراحی زیر به اطمینان از تجربه بهینه برای کاربرانی که بازی شما را در YouTube در دستگاه‌ها و پلتفرم‌های مختلف انجام می‌دهند، کمک می‌کند.

جدا از اجزای سیستم عامل، تجربه Playables عمدتاً از سه جزء تشکیل شده است:

  • اقدامات قابل پخش
  • بوم بازی
  • منوها و دیالوگ ها

نمای صفحه نمایش محل سه جزء را نشان می دهد

این بهترین شیوه‌های طراحی بازی، توصیه‌هایی را برای نحوه ساخت بازی خود برای بوم بازی ارائه می‌دهند.

تغییر اندازه بازی

با در نظر گرفتن این شیوه‌ها، اطمینان حاصل کنید که بازی‌ها با اندازه‌ها و جهت‌گیری‌های مختلف صفحه نمایش سازگار هستند.

اندازه بازی را تغییر دهید و رابط کاربری را با اندازه و نسبت ابعاد بوم تطبیق دهید.

بازی را به صورت تمام صفحه نمایش نمی دهد

اگر بازی نمی تواند کاملاً به اندازه بوم و نسبت ابعاد بازی پاسخگو باشد، از pillarboxing یا letterboxing استفاده کنید.

راه اندازی نوارهای پیمایش

از فعال کردن نوارهای پیمایش خودداری کنید. نوارهای اسکرول بر روی گیم پلی و ناوبری کلی تأثیر منفی می گذارد. بوم را پر کنید بدون اینکه بازی در داخل بوم قابل پیمایش شود. نوارهای پیمایش برای پیمایش عمدی مناسب هستند، به عنوان مثال هنگام پیمایش در یک لیست عمودی طولانی در رابط کاربری بازی. در حالت ایده‌آل، بازی‌ها به طور کامل در قبال viewport مسئولیت دارند.

مقیاس بندی بازی

به وضوح (نه تار، پیکسلی یا کشیده) در وضوح های مختلف صفحه نمایش دهید.

اطمینان حاصل کنید که رابط کاربری بازی (متون، نمادها) در هر دو صفحه نمایش با وضوح پایین (مانند دستگاه های تلفن همراه 360x800) و صفحه نمایش با وضوح بالاتر (مانند مانیتورهای دسکتاپ 3840x2560) به طور مناسب مقیاس بندی می شود.

مقایسه کنار هم آیکون تروفی واضح و تار

از دارایی‌های شطرنجی‌شده با وضوح پایین که هنگام مقیاس‌بندی روی صفحه‌های بزرگ تار به نظر می‌رسند، خودداری کنید.

تایپوگرافی

از خوانایی در دستگاه‌ها و اندازه‌های صفحه اطمینان حاصل کنید.

متن هایی که در بازی ظاهر می شوند مانند دکمه ها، منوها و حباب های گفتار باید در دستگاه ها و اندازه های مختلف صفحه نمایش خوانا باشند. این را می توان با مقیاس بندی و تطبیق متن به طور خودکار یا با ارائه تنظیماتی برای تنظیم اندازه قلم به کاربران دست یافت.

اگر متن کوچکتر از 18pt است، یا اگر متن پررنگ و کوچکتر از 14pt است، نسبت کنتراست رنگ را حداقل روی 4.5:1 تنظیم کنید.

برای تمام متن های دیگر، نسبت کنتراست رنگ را حداقل روی 3:1 تنظیم کنید.

برای مرجع کلی، WCAG2.1 را ببینید.

از اندازه فونت های بزرگ با وزن و کنتراست کافی برای خوانایی استفاده کنید. در این مثال، نسبت کنتراست 4.48:1 است. از اندازه فونت های کوچک و رنگ های کم کنتراست خودداری کنید. در این مثال، نسبت کنتراست 3.07:1 است.

اثر متقابل

این بخش بهترین شیوه ها در مورد تعاملات کاربر و عناصر مرتبط را پوشش می دهد.

اهداف را لمس کنید

اهداف لمسی را برای تعامل آسان تر به اندازه کافی بزرگ کنید.

اطمینان حاصل کنید که اهداف لمسی حداقل 48x48 dp با حداقل 8 dp فاصله بین اهداف (به دستورالعمل‌های طراحی مواد مراجعه کنید) برای تعامل آسان‌تر، اطمینان حاصل کنید.

در این مثال، دکمه رندر بصری 24 dp است، در حالی که هدف لمسی نامرئی شامل 12 dp در اطراف نماد برای رسیدن به هدف لمسی 48x48 dp است.

ابعاد دکمه رندر شده را نشان می دهد

برای افزایش اندازه هدف لمسی، بالشتک اطراف آیکون ها و دکمه ها را اضافه کنید.

دکمه ها

برای هر حالت دکمه از سبک های منحصر به فرد استفاده کنید:

  • فعال شد
  • معلول
  • شناور (برای دستگاه های ورودی غیر لمسی)
  • متمرکز شده است
  • فشرده شده است

سعی کنید دکمه ها را بر اساس سلسله مراتب نیز متمایز کنید. به‌عنوان مثال، دکمه‌های اقدام اولیه و ثانویه در منوی استارت (به دستورالعمل‌های طراحی Google Material 2 برای دکمه‌ها مراجعه کنید).

نمای سبک های مختلف حالت را نشان می دهد

سبک های منحصر به فردی که هر حالت دکمه را متمایز می کند

ورودی صفحه کلید

برای افزایش دسترسی به بازی در بین دستگاه ها و کاربران، از ورودی صفحه کلید برای همه کنترل های بازی و ناوبری صفحه نمایش علاوه بر ورودی لمسی و ماوس پشتیبانی کنید.

برای بازی‌هایی که از ورودی صفحه‌کلید پشتیبانی می‌کنند، به کاربران اجازه دهید با استفاده از کلید Esc ، منوها و گفتگوهای درون بازی را ببندند. این علاوه بر داشتن دکمه بصری بستن (به عنوان مثال، نماد X در گوشه بالا) است. نمونه‌های رایج مدال‌ها یا دیالوگ‌ها عبارتند از: منوی تنظیمات ، منوی مکث ، پیام‌های خطا، و پنجره‌های بازشو اطلاعات راهنما .

از ترسیم هر گونه عملکرد با فشار طولانی کلید Esc خودداری کنید، زیرا برای خروج از حالت تمام صفحه در مرورگرهای وب دسکتاپ استفاده می شود.

برای بازی‌هایی که شنونده‌های فشار کلید ثبت شده‌اند: از preventDefault() با رویدادهای کلید Esc استفاده نکنید. هنگامی که در سافاری تمام صفحه است، این باعث می شود که رویداد فشار کلید بدون خروج از تمام صفحه توسط بازی مصرف شود.

هپتیک ها

در صورت لزوم، توصیه می شود از بازخورد لمسی (ارتعاشات) استفاده کنید تا بازی های خود را سرگرم کننده تر و غوطه ورتر کنید.

لحظات کلیدی بازی

این بخش لحظات کلیدی یک بازی را پوشش می دهد که تجربه ای عالی برای بازیکن ایجاد می کند.

آموزش

برای کمک به بازیکنان جدید، یک آموزش مختصر یا سطح حضوری در نظر بگیرید.

Onboarding تضمین می کند که کاربران برای ادامه و لذت بردن از بازی، گیم پلی اولیه و ملزومات بازی را یاد می گیرند.

از آنجایی که برنامه‌های Playables برای شروع بازی سریع و قابل دسترس برای کاربران در نظر گرفته شده است، سعی کنید تا جایی که ممکن است ورود به سیستم را به حداقل برسانید. در حالی که همه بازی‌ها به آموزش نیاز ندارند، اکثر بازی‌ها از نوعی از Onboarding بهره می‌برند. مکانیک‌ها، قوانین و مهارت‌هایی را که بازیکن برای موفقیت در بازی و لذت بردن از بازی باید بداند، در نظر بگیرید.

آموزش ها می توانند در قالب های زیر باشند:

  • مجموعه ای از صفحه نمایش ها در ابتدای بازی (یا در حالت ایده آل، در صورت لزوم به صورت متنی در طول بازی ارائه می شود)
  • سطح آموزشی واقعی که کاربر از طریق آن بازی می کند

مکث کنید

وضعیت بازی را به وضوح به کاربر اطلاع دهید.

هنگامی که بازی متوقف می شود و چگونه کاربر می تواند بازی را از سر بگیرد، به وضوح با کاربر ارتباط برقرار کنید. از اینکه کاربر فکر کند بازی یخ زده یا از کار افتاده است خودداری کنید.

دکمه های مکث و از سرگیری را نمایش می دهد

وضعیت بازی را به وضوح به عنوان "مکث" برچسب بزنید و یک عمل (دکمه) واضح برای از سرگیری بازی ارائه دهید.

پایان بازی

به کاربر اطلاع دهید که آخرین سطح را به پایان رسانده یا بازی را تمام کرده است.

اگر بازی پایان قطعی دارد (مثلاً تعداد محدودی از سطوح)، این واقعیت را به وضوح به کاربر منتقل کنید. این باعث می شود که کاربر فکر کند که بازی خراب یا یخ زده است. در حالت ایده آل، بازی جشن می گیرد و به بازیکن برای تکمیل بازی تبریک می گوید.

سمعی

این بازی می‌تواند شامل کنترل‌های جداگانه صدا برای جلوه‌ها، گفتار و موسیقی پس‌زمینه باشد. کنترل‌ها می‌توانند از لغزنده‌هایی برای تنظیم صدا یا یک کلید بی‌صدا برای هر یک یا هر دو تشکیل شوند.

تنظیمات صوتی مختلف برای پس زمینه، sfx، دیالوگ ها

دسترسی

دسترسی در طراحی به کاربرانی با توانایی های متنوع اجازه می دهد تا بازی شما را انجام دهند و از آن لذت ببرند.

برخلاف طراحی وب و نرم‌افزار، دستورالعمل‌های استاندارد دسترسی در صنعت برای طراحی بازی وجود ندارد. برای یک منبع خوب با دستورالعمل‌های اضافی در مورد طراحی بازی فراگیر، دستورالعمل‌های دسترسی به بازی را ببینید. توصیه می کنیم در نظر داشته باشید که چگونه این دستورالعمل ها می توانند در طراحی بازی شما اعمال شوند.

،

بهترین روش‌های طراحی زیر به اطمینان از تجربه بهینه برای کاربرانی که بازی شما را در YouTube در دستگاه‌ها و پلتفرم‌های مختلف انجام می‌دهند، کمک می‌کند.

جدا از اجزای سیستم عامل، تجربه Playables عمدتاً از سه جزء تشکیل شده است:

  • اقدامات قابل پخش
  • بوم بازی
  • منوها و دیالوگ ها

نمای صفحه نمایش محل سه جزء را نشان می دهد

این بهترین شیوه‌های طراحی بازی، توصیه‌هایی را برای نحوه ساخت بازی خود برای بوم بازی ارائه می‌دهند.

تغییر اندازه بازی

با در نظر گرفتن این روش‌ها، اطمینان حاصل کنید که بازی‌ها با اندازه‌ها و جهت‌گیری‌های مختلف صفحه نمایش سازگار هستند.

اندازه بازی را تغییر دهید و رابط کاربری را با اندازه و نسبت ابعاد بوم تطبیق دهید.

بازی را به صورت تمام صفحه نمایش نمی دهد

اگر بازی نمی تواند کاملاً به اندازه بوم و نسبت ابعاد بازی پاسخگو باشد، از pillarboxing یا letterboxing استفاده کنید.

راه اندازی نوارهای پیمایش

از فعال کردن نوارهای پیمایش خودداری کنید. نوارهای اسکرول بر روی گیم پلی و ناوبری کلی تأثیر منفی می گذارد. بوم را پر کنید بدون اینکه بازی در داخل بوم قابل پیمایش شود. نوارهای پیمایش برای پیمایش عمدی مناسب هستند، به عنوان مثال هنگام پیمایش در یک لیست عمودی طولانی در رابط کاربری بازی. در حالت ایده‌آل، بازی‌ها به طور کامل در قبال viewport مسئولیت دارند.

مقیاس بندی بازی

به وضوح (نه تار، پیکسلی یا کشیده) در وضوح های مختلف صفحه نمایش دهید.

اطمینان حاصل کنید که رابط کاربری بازی (متون، نمادها) در هر دو صفحه نمایش با وضوح پایین (مانند دستگاه های تلفن همراه 360x800) و صفحه نمایش با وضوح بالاتر (مانند مانیتورهای دسکتاپ 3840x2560) به طور مناسب مقیاس بندی می شود.

مقایسه کنار هم آیکون تروفی واضح و تار

از دارایی‌های شطرنجی‌شده با وضوح پایین که هنگام مقیاس‌بندی روی صفحه‌های بزرگ تار به نظر می‌رسند، خودداری کنید.

تایپوگرافی

از خوانایی در دستگاه‌ها و اندازه‌های صفحه اطمینان حاصل کنید.

متن هایی که در بازی ظاهر می شوند مانند دکمه ها، منوها و حباب های گفتار باید در دستگاه ها و اندازه های مختلف صفحه نمایش خوانا باشند. این را می توان با مقیاس بندی و تطبیق متن به طور خودکار یا با ارائه تنظیماتی برای تنظیم اندازه قلم به کاربران دست یافت.

اگر متن کوچکتر از 18pt است، یا اگر متن پررنگ و کوچکتر از 14pt است، نسبت کنتراست رنگ را حداقل روی 4.5:1 تنظیم کنید.

برای تمام متن های دیگر، نسبت کنتراست رنگ را حداقل روی 3:1 تنظیم کنید.

برای مرجع کلی، WCAG2.1 را ببینید.

از اندازه فونت های بزرگ با وزن و کنتراست کافی برای خوانایی استفاده کنید. در این مثال، نسبت کنتراست 4.48:1 است. از اندازه فونت های کوچک و رنگ های کم کنتراست خودداری کنید. در این مثال، نسبت کنتراست 3.07:1 است.

اثر متقابل

این بخش بهترین شیوه ها در مورد تعاملات کاربر و عناصر مرتبط را پوشش می دهد.

اهداف را لمس کنید

اهداف لمسی را برای تعامل آسان تر به اندازه کافی بزرگ کنید.

اطمینان حاصل کنید که اهداف لمسی حداقل 48x48 dp با حداقل 8 dp فاصله بین اهداف (به دستورالعمل‌های طراحی مواد مراجعه کنید) برای تعامل آسان‌تر، اطمینان حاصل کنید.

در این مثال، دکمه رندر بصری 24 dp است، در حالی که هدف لمسی نامرئی شامل 12 dp در اطراف نماد برای رسیدن به هدف لمسی 48x48 dp است.

ابعاد دکمه رندر شده را نشان می دهد

برای افزایش اندازه هدف لمسی، بالشتک اطراف آیکون ها و دکمه ها را اضافه کنید.

دکمه ها

برای هر حالت دکمه از سبک های منحصر به فرد استفاده کنید:

  • فعال شد
  • معلول
  • شناور (برای دستگاه های ورودی غیر لمسی)
  • متمرکز شده است
  • فشرده شده است

سعی کنید دکمه ها را بر اساس سلسله مراتب نیز متمایز کنید. به‌عنوان مثال، دکمه‌های اقدام اولیه و ثانویه در منوی استارت (به دستورالعمل‌های طراحی Google Material 2 برای دکمه‌ها مراجعه کنید).

نمای سبک های مختلف حالت را نشان می دهد

سبک های منحصر به فردی که هر حالت دکمه را متمایز می کند

ورودی صفحه کلید

برای افزایش دسترسی به بازی در بین دستگاه ها و کاربران، از ورودی صفحه کلید برای همه کنترل های بازی و ناوبری صفحه نمایش علاوه بر ورودی لمسی و ماوس پشتیبانی کنید.

برای بازی‌هایی که از ورودی صفحه‌کلید پشتیبانی می‌کنند، به کاربران اجازه دهید با استفاده از کلید Esc ، منوها و گفتگوهای درون بازی را ببندند. این علاوه بر داشتن دکمه بصری بستن (به عنوان مثال، نماد X در گوشه بالا) است. نمونه‌های رایج مدال‌ها یا دیالوگ‌ها عبارتند از: منوی تنظیمات ، منوی مکث ، پیام‌های خطا، و پنجره‌های بازشو اطلاعات راهنما .

از ترسیم هر گونه عملکرد با فشار طولانی کلید Esc خودداری کنید، زیرا برای خروج از حالت تمام صفحه در مرورگرهای وب دسکتاپ استفاده می شود.

برای بازی‌هایی که شنونده‌های فشار کلید ثبت شده‌اند: از preventDefault() با رویدادهای کلید Esc استفاده نکنید. هنگامی که در سافاری تمام صفحه است، این باعث می شود که رویداد فشار کلید بدون خروج از تمام صفحه توسط بازی مصرف شود.

هپتیک ها

در صورت لزوم، توصیه می شود از بازخورد لمسی (ارتعاشات) استفاده کنید تا بازی های خود را سرگرم کننده تر و غوطه ورتر کنید.

لحظات کلیدی بازی

این بخش لحظات کلیدی یک بازی را پوشش می دهد که تجربه ای عالی برای بازیکن ایجاد می کند.

آموزش

برای کمک به بازیکنان جدید، یک آموزش مختصر یا سطح حضوری در نظر بگیرید.

Onboarding تضمین می کند که کاربران برای ادامه و لذت بردن از بازی، گیم پلی اولیه و ملزومات بازی را یاد می گیرند.

از آنجایی که برنامه‌های Playables برای شروع بازی سریع و قابل دسترس برای کاربران در نظر گرفته شده است، سعی کنید تا جایی که ممکن است ورود به سیستم را به حداقل برسانید. در حالی که همه بازی‌ها به آموزش نیاز ندارند، اکثر بازی‌ها از نوعی از Onboarding بهره می‌برند. مکانیک‌ها، قوانین و مهارت‌هایی را که بازیکن برای موفقیت در بازی و لذت بردن از بازی باید بداند، در نظر بگیرید.

آموزش ها می توانند در قالب های زیر باشند:

  • مجموعه ای از صفحه نمایش ها در ابتدای بازی (یا در حالت ایده آل، در صورت لزوم به صورت متنی در طول بازی ارائه می شود)
  • سطح آموزشی واقعی که کاربر از طریق آن بازی می کند

مکث کنید

وضعیت بازی را به وضوح به کاربر اطلاع دهید.

هنگامی که بازی متوقف می شود و چگونه کاربر می تواند بازی را از سر بگیرد، به وضوح با کاربر ارتباط برقرار کنید. از اینکه کاربر فکر کند بازی یخ زده یا از کار افتاده است خودداری کنید.

دکمه های مکث و از سرگیری را نمایش می دهد

وضعیت بازی را به وضوح به عنوان "مکث" برچسب بزنید و یک عمل (دکمه) واضح برای از سرگیری بازی ارائه دهید.

پایان بازی

به کاربر اطلاع دهید که آخرین سطح را به پایان رسانده یا بازی را تمام کرده است.

اگر بازی پایان قطعی دارد (مثلاً تعداد محدودی از سطوح)، این واقعیت را به وضوح به کاربر منتقل کنید. این باعث می شود که کاربر فکر کند که بازی خراب یا یخ زده است. در حالت ایده آل، بازی جشن می گیرد و به بازیکن برای تکمیل بازی تبریک می گوید.

سمعی

این بازی می‌تواند شامل کنترل‌های جداگانه صدا برای جلوه‌ها، گفتار و موسیقی پس‌زمینه باشد. کنترل‌ها می‌توانند از لغزنده‌هایی برای تنظیم صدا یا یک کلید بی‌صدا برای هر یک یا هر دو تشکیل شوند.

تنظیمات صوتی مختلف برای پس زمینه، sfx، دیالوگ ها

دسترسی

دسترسی در طراحی به کاربرانی با توانایی های متنوع اجازه می دهد تا بازی شما را انجام دهند و از آن لذت ببرند.

برخلاف طراحی وب و نرم‌افزار، دستورالعمل‌های استاندارد دسترسی در صنعت برای طراحی بازی وجود ندارد. برای یک منبع خوب با دستورالعمل‌های اضافی در مورد طراحی بازی فراگیر، دستورالعمل‌های دسترسی به بازی را ببینید. توصیه می کنیم در نظر بگیرید که چگونه می توان این دستورالعمل ها را در طراحی بازی خود اعمال کرد.