دستورالعمل‌های طراحی تنظیمات Android

این سند اصول و دستورالعمل‌های مربوط به هر کسی را که تنظیمات پلاتفرم Android، تنظیمات اصلی GMS (تنظیمات Google)، یا هر توسعه‌دهنده‌ای را که تنظیمات برنامه Android خود را طراحی می‌کند برجسته می‌کند.

اصول طراحی

نمای کلی خوبی ارائه دهید

کاربران باید بتوانند نگاهی به صفحه‌های تنظیمات بیندازند و همه تنظیمات تکی و مقادیر آن‌ها را درک کنند.

شکل ۱. تنظیمات و مقادیر فعلی آن‌ها در صفحه سطح بالا ارائه می‌شود

سازمان‌دهی شهودی موارد

تنظیمات پرکاربرد را در بالای صفحه قرار دهید. تعداد تنظیمات در یک صفحه را محدود کنید. نمایش بیش‌از ۱۰ تا ۱۵ مورد می‌تواند گیج‌کننده باشد. با انتقال برخی‌از تنظیمات به صفحه‌ای جداگانه، منوهای شهودی ایجاد کنید.

شکل ۲. تنظیمات رایج در بالای صفحه قرار دارند

پیدا کردن تنظیمات را آسان کنید

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

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

شکل ۳ و ۴. «صدای اعلان پیش‌فرض» هم در صفحه «اعلان» و هم در صفحه «صدا» نشان داده می‌شود

از عنوان و وضعیت واضح استفاده کنید

عنوان‌های تنظیمات را کوتاه و بامعنی کنید. از عنوان‌های مبهم مثل «تنظیمات عمومی» استفاده نکنید. برای برجسته کردن ارزش تنظیم، وضعیت را زیر عنوان نشان دهید. جزئیات خاص را نشان دهید، نه اینکه فقط عنوان را توصیف کنید.

عنوان‌ها باید:

  • مهم‌ترین متن برچسب را در ابتدا قرار دهید.
  • کلمات منفی مانند «نکن» یا «هرگز» را به عبارات خنثی مانند «مسدود کن» تغییر دهید.
  • از برچسب‌های غیرشخصی مثل «اعلان‌ها» به‌جای «به من اطلاع بده» استفاده کنید. استثنا: اگر ارجاع به کاربر برای درک تنظیمات ضروری است، به‌جای اول شخص («من»)، از دوم شخص («شما») استفاده کنید.

عناوین باید از موارد زیر اجتناب کنند:

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

انواع صفحه

فهرست تنظیمات

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

اگر تنظیمات زیادی در یک دسته وجود داشته باشد، می‌توان آن‌ها را باهم گروه‌بندی کرد. برای جزئیات بیشتر، گروه‌بندی و جداکننده‌ها را ببینید.

شکل ۵. نمونه فهرست تنظیمات

نمای فهرستی

نمای فهرست برای نمایش فهرست مواردی مثل برنامه‌ها، حساب‌ها، دستگاه‌ها، و موارد دیگر استفاده می‌شود. کنترل‌های فیلتر کردن یا مرتب کردن را می‌توان به صفحه اضافه کرد.

شکل ۶. مثالی از نمای «فهرستی»

صفحه نهاد

صفحه نهاد برای ارائه تنظیمات یک مورد متمایز مثل برنامه، حساب، دستگاه، شبکه Wi-Fi، و غیره استفاده می‌شود.

ازنظر بصری، نهاد در بالا با نماد، عنوان، و زیرعنوان نشان داده می‌شود. همه تنظیمات در این صفحه باید مربوط به این نهاد باشد.

شکل ۷. نمونه صفحه «نهاد» استفاده‌شده در «اطلاعات برنامه»

شکل ۸. نمونه‌ای از صفحه «نهاد» که در «فضای ذخیره‌سازی» استفاده می‌شود

تنظیم اصلی

بهترین زمان استفاده از تنظیم اصلی زمانی است که کل ویژگی را بتوان روشن یا خاموش کرد، مثل Wi-Fi یا بلوتوث. بااستفاده از کلیدی در بالای صفحه، کاربر می‌تواند این ویژگی را کنترل کند. استفاده از تنظیم اصلی برای غیرفعال کردن ویژگی همه تنظیمات مرتبط دیگر را غیرفعال می‌کند.

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

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

شکل ۹. مثال تنظیم اصلی استفاده‌شده در صفحه «اعلان‌های برنامه»؛ خاموش کردن کلید روشن/خاموش اصلی، کل ویژگی را برای این برنامه خاموش می‌کند

شکل ۱۰. نمونه‌ای از تنظیم اصلی استفاده‌شده در صفحه اعلان‌های «برنامه» با کلید اصلی خاموش

صفحه انتخاب دکمه رادیویی

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

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

شکل ۱۱. دکمه‌های رادیویی نباید در فهرست تنظیمات استفاده شود

شکل ۱۲. نحوه استفاده صحیح از دکمه‌های رادیویی در تنظیمات

اجزا

از Android 8.0، نوارابزار کنش، جستجو و راهنمایی را به‌همراه کنش‌های مرتبط دیگر ارائه می‌دهد. منوهای سرریز توصیه نمی‌شود زیرا کاربران ممکن است کنش‌های پنهان در این منوها را پیدا نکنند.

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

شکل ۱۳. نوار ابزار با کنش‌های جستجو و راهنما

برای نوارابزارهای دارای یک کنش: کنش را قبل‌از جستجو ارائه دهید.

شکل ۱۴. نوار ابزار با یک کنش قبل‌از کنش‌های جستجو و راهنما

برای نوارابزارهایی با بیش‌از ۱ کنش: کنش اصلی را قبل‌از جستجو قرار دهید و کنش‌های پیشرفته را در منو سرریز بگذارید.

اگر همه کنش‌ها پیشرفته هستند یا فقط برای مجموعه کوچکی از کاربران مفیدند، همه کنش‌ها را در منو سرریز قرار دهید.

شکل ۱۵. نوارابزار با منوِ سرریز برای کنش‌ها

سرایند نهاد

سرایند نهاد می‌تواند فقط عنوان یا عنوان با زیرنوشت (چندین خط برای زیرنوشت مجاز است) را نشان دهد. کنش زیر اختیاری است. حداکثر می‌توانید دو کنش داشته باشید.

شکل ۱۶. سرایند نهاد

بخش نماد و عنوان (برنامه ۱) در زیر سرایند (اطلاعات برنامه) پیمایش خواهد شد.

شکل ۱۷. عنوان اطلاعات برنامه در اینجا بخشی از نوارابزار است، درحالی‌که بقیه صفحه زیر آن پیمایش خواهد شد

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

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

نمونه‌ها:

شکل ۱۸. پیوند منو با نماد، عنوان، و نوشتار فرعی

شکل ۱۹. پیوند منو با عنوان و زیرمتن

شکل ۲۰. پیوند منو فقط با عنوان

پیوند منو با نماد، عنوان، زیرنویس، و هدف ضربه جداگانه در سمت چپ

سایر هدف‌های ضربه باید از رنگ زمینه استفاده کنند.

شکل ۲۱. نمونه منو هدف دو تک‌ضربی

پیوند منو با نماد، عنوان، زیرنویس، و نماد آمار/تعداد/هشدار

مقادیر عددی مثل درصد و زمان می‌تواند در سمت چپ همراه با زیرنویس نشان داده شود، درحالی‌که نمودار میله‌ای می‌تواند در زیر نشان داده شود.

معمولاً مقادیر عددی در سمت راست ارائه می‌شوند تا کاربران بتوانند به‌راحتی آن‌ها را ببینند و مقایسه کنند.

شکل ۲۲. نمونه منو با نماد، عنوان، آمار، و نمودار

گروه‌بندی و جداکننده‌ها

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

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

شکل ۲۳. تنظیمات گروه‌بندی‌شده با جداکننده

عوض کردن

کلید با نماد، عنوان، و زیرنوشت

شکل ۲۴. کلید با نماد، عنوان، و زیرمتن

کلید با عنوان و زیرمتن

شکل ۲۵. عوض کردن با عنوان و زیرمتن

جابه‌جایی فقط با عنوان

عنوان‌ها می‌توانند با نمادی در سمت راست همراه باشند.

شکل ۲۶. فقط با عنوان عوض کنید

کلید مورد فهرست به‌علاوه

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

برای مورد فهرست در سمت راست، عنوان الزامی است. نماد و زیرنوشت اختیاری است.

شکل ۲۷. مورد فهرست و کلید

اسلایدر

نماد در لغزنده اختیاری است.

شکل ۲۸. اسلایدر

دکمه روی صفحه

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

شکل ۲۹. دکمه‌های خاکستری برای «حذف نصب» و «توقف اجباری»

شکل ۳۰. دکمه آبی برای «اکنون روشن شود»

شفاف‌سازی تدریجی (پیشرفته)

تنظیماتی که به‌طور مکرر استفاده نمی‌شوند باید پنهان شوند. فقط زمانی از «پیشرفته» استفاده کنید که حداقل ۳ مورد برای پنهان کردن وجود داشته باشد.

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

شکل ۳۱. «پیشرفته» در صفحه «نمایشگر» استفاده می‌شود

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

درصورت نیاز، می‌توان از منوهای کرکره‌ای در مواردی که تنظیمات گزینه‌های ساده‌ای دارد استفاده کرد.

شکل ۳۲. منوِ کرکره‌ای

چارگوش انتخاب

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

از چارگوش‌های انتخاب می‌توان برای موارد زیر استفاده کرد:

  • برای اقدامات منفی مثل محدود کردن برنامه‌ها یا مسدود کردن سرویس.
  • برای جلوگیری از داشتن تعداد زیاد کلید در صفحه‌نمایش.

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

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

شکل ۳۴. پیوند استفاده‌شده در تنظیمات

از نوشتار پانویس می‌توان برای افزودن محتوای توضیحی استفاده کرد. پانویس باید همیشه در بالا جداکننده داشته باشد. پانویس در پایین صفحه نشان داده می‌شود. پانویس‌ها درصورت نیاز می‌توانند پیوند داشته باشند.

شکل ۳۵. نوشتار پانویس

الگو

داده

داده‌های مهم را می‌توان در نموداری مثل نمودار میله‌ای یا دایره‌ای نشان داد. این داده‌ها را می‌توان در سرایند نهاد نشان داد. برای مثال، داده تلفن همراه و فضای ذخیره‌سازی.

داده‌های کم‌اهمیت‌تر را می‌توان بااستفاده از نمای فهرست معمولی ارائه کرد.

شکل ۳۶. نمونه‌ای که «فضای ذخیره‌سازی» را نشان می‌دهد

شکل ۳۷. نمونه‌ای از نمایش «شبکه»

آموزش کاربر

برخی‌از ویژگی‌ها ممکن است به توضیح یا آموزش کاربر نیاز داشته باشند. می‌توانید از پویانمایی یا تصویر همراه با نوشتار استفاده کنید. پویانمایی یا تصویر باید در بالای صفحه ارائه شود، درحالی‌که می‌توان از نوشتار پانویس برای افزودن توضیح استفاده کرد.

شکل ۳۸. تنظیم بااستفاده از پویانمایی و نوشتار پانویس

فرم‌ها

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

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

شکل ۳۹. فرم با کادر گفتگوی عادی

نتایج جستجو

نتایج جستجو عنوان، زیرمتن (درصورت وجود)، و مکان تنظیمات را در سلسله‌مراتب نشان می‌دهد.

شکل ۴۰. نتیجه جستجو