AdobeXDзарекомендував себе як потужний інструмент для прототипування. Особливо цікавою є можливість інтеграції голосового управління. Ця функція дозволяє вам створювати взаємодії з вашим прототипом за допомогою усних команд. У цьому керівництві ви дізнаєтеся, як реалізувати голосове управління в Adobe XD. Таким чином, ваш прототип стане не лише більш зручним для користувачів, а й підвищить інтерактивність до нового рівня.
Основні висновки
- Голосове управління дозволяє взаємодії з об'єктами через усні команди.
- Візуальні підказки є вирішальними для того, щоб дати користувачам зрозуміти, що вони можуть використовувати усні команди.
- Ви можете визначити власні голосові команди та встановити їхні реакції в прототипі.
Покрокове керівництво
Створіть своє артборд
Почніть з того, щоб створити нове артборд. Обравши відповідний колір фону, надайте вашому прототипу сучасний вигляд. Тут ви можете, наприклад, вибрати м'який відтінок, щоб створити приємну атмосферу.
Додати текст
Тепер час комунікувати релевантно. Використайте інструмент тексту, щоб додати текстове поле, в якому ви розмістите запитання “Що я можу для вас зробити?”. Форматуйте текст привабливо, щоб виділити його. Розмір шрифту 90 пунктів ідеально підходить, щоб бути помітним, не виглядаючи перевантаженим.
Візуальні підказки для голосового управління
Щоб сигналізувати користувачу, що усні команди можливі, вам слід створити символ мікрофону. Ви можете створити ілюстративний мікрофон, намалювавши закруглений прямокутник та використавши інструмент кола. Будьте уважні, поєднуючи декоративні елементи таким чином, щоб вони створювали привабливий дизайн.
Додайте друге текстове поле
Тепер додайте ще одне текстове поле, яке відображатиме повідомлення, такі як “Закрийте цей додаток”. Виберіть відповідне форматування тексту, щоб виділити його. Мета полягає в тому, щоб активно показати користувачам, які голосові команди вони можуть давати.
Створення анімацій
Щоб додати динамічні елементи до вашого додатка, вам слід створити кілька артбордів. Вони покажуть різні стани вашого прототипу під час інтерактивного використання. Ви можете визначити структуру анімацій у прототипі, так що при отриманні голосової команди запуститься плавна анімація.
Синхронізуйте анімації
Використовуйте налаштування анімації, щоб визначити переходи між екранами. Ви можете використовувати авто-анімацію, щоб забезпечити безшовну анімацію під час завантаження. Це забезпечить позитивний користувацький досвід, поки користувачі чекають на свої ввід.
Використовуйте голосові команди в режимі прототипу
Тепер перейдіть в режим прототипу та визначте перехід голосового управління. Тригер повинен бути встановлений на голосове управління, а не на натискання. Встановіть команду “Закрийте цей додаток” як тригер для наступної дії. Кожній команді ви повинні призначити конкретну анімацію та тривалість.
Тестуйте прототип
Якщо все встановлено, перейдіть до панелі попереднього перегляду та протестуйте ваш додаток. Утримуйте клавішу пробілу під час тестування, щоб віддавати голосові команди. Перевірте, чи ваш прототип правильно реагує на голосові ввід і чи працюють анімації. Протестуйте команду “Закрийте цей додаток” і спостерігайте за процесом.
Підсумок – ефективне використання голосового управління в Adobe XD
У цьому керівництві ви дізналися, як реалізувати голосове управління в Adobe XD. Ви пройшли через кроки створення прототипу, додавання текстових полів і візуальних підказок, а також встановлення анімацій і переходів. Ця техніка допоможе вам поліпшити взаємодію з користувачами та зробити ваш прототип більш привабливим.
Часті запитання
Як я можу активувати голосове управління в Adobe XD?Голосове управління можна активувати шляхом налаштування голосових команд у режимі прототипу.
Чи можу я визначити власні голосові команди?Так, ви можете визначити власні голосові команди в прототипі та встановити їхні реакції.
Як я тестую голосове управління?В панелі попереднього перегляду ви можете протестувати голосове управління, утримуючи пробіл і вимовляючи вашу команду.
