Діалоги

Діалог — це можливість інформувати користувача про важливі моменти або надати можливість виконати одну дію.

Діалоги повинні бути однозначними та точними. Кольором слід виділяти лише найпоширенішу або основну дію. У вертикальних діалогах основну дію слід розміщати вгорі, а в горизонтальних — справа.

Основні дії можуть бути позитивними, негативними або нейтральними. Позитивні щось додають предмету. Негативні дії вилучають, видаляють або вносять зміни, які буде складно скасувати. Нейтральні дії не додають та не видаляють нічого з предмета, але вносять зміни.

Основна дія повинна бути виділена через theme.palette.normal.negative якщо вона деструктивна, через theme.palette.normal.positive — якщо позитивна або через theme.palette.normal.focus якщо вона нейтральна. Решта параметрів мають бути сірими, без визначеного кольору.

Діалоги мають продовжити виконання дії, а не ставити запитання на «так» чи «ні». Наприклад, користувач обирає опцію видалити контакт. Ваш діалог повинен спитати: «Ви дійсно бажаєте видалити цей контакт?» та мати негативну опцію «Видалити» з позначенням червоним, та «Скасувати» сірим кольором.

Назва чи заголовок повинні містити корисну інформацію. Продовжуючи приклад видалення контакту, з використанням імені контакту як назви, можна чітко та просто побачити, що видаляється. Хорошим перевіреним правилом є дивитися на свій діалог із заголовком та без нього — в останньому випадку повинні бути явно відсутні деякі дані про те, що відбувається.

Зразки дизайнів, які слід уникати

Зліва: кнопка Завантажити використовує старий колір фокусування, а кнопка Скасувати (другорядна дія) використовує старий сірий колір.

Праворуч: Діалог використовує загальні відповіді з двома кнопками, пофарбованими у кольори основної дії, які можуть заплутати: «Чи призведе „Ні“ до незворотної дії, а „Так“ до корисних змін?»