Співзасновники дизайн-студії Kickpush Сем Епплбі (Sam Applebee) і Алекс Деруетт (Alex Deruette) розповіли, як застосувати досвід проектування традиційних додатків до дизайну інтерфейсів для віртуальної реальності (VR).
А DesignTalk.club традиційно зробив адаптивний переклад цього діла українською 😉
Частина 2
Першу частину можна прочитати тут
Налаштування
Розмір полотна (канвасу)
Чим простіше проблема, тим важче за неї взятися. Коли дивишся на 360-градусну область, важко навіть збагнути, з чого почати. Як з’ясувалося, UX- і UI-дизайнерам легше зосередитися на конкретній ділянці загального простору.
Щоб застосувати робочий процес для мобільного додатку до розробки VR UI, потрібно визначитися з розмірами «полотна» (канвасу). Для мобільних додатків цей розмір визначається габаритами пристроїв: 1334×750 пікселів для iPhone і приблизно 1280×720 пікселів для Android. А на визначення відповідного розміру для VR у нас пішло кілька тижнів.
На зображенні знизу видно, як виглядає 360-градусне середовище, якщо його розгорнути. Це називається рівнопроміжною проекцією. У віртуальному 3D-середовищі ці проекції розташовуються навколо сфери, моделюючи реальний світ.
Повний розмір проекції становить 360 градусів в ширину і 180 градусів у висоту. Ми можемо використовувати це, щоб визначити піксельний крок: 3600×1800.
Робота на такому величезному полі здається справжнім викликом. Але, оскільки ми заздалегідь прояснили особливості VR-додатків, ми можемо сконцентруватися на окремому сегменті цього полотна.
Спираючись на дослідження Майка Елгара про зручні зони перегляду, ми можемо відокремити ту ділянку, де інтерфейс буде мати сенс. Область нашого інтересу – це одна дев’ята 360-градусного середовища. Вона розміщується в центрі цього рівнопроміжного зображення і займає 1200×600 пікселів.
Тестування
Причина для того, щоб використовувати дві області для одного екрану, криється в зручності тестування. Виділення «UI View» допомагає фокусуватися на самому інтерфейсі і спрощує процес розробки. «360 View» використовується для попереднього знайомства з інтерфейсом в VR-середовищі.
Щоб отримати реальне уявлення про спотворення пропорцій, потрібно протестувати інтерфейс за допомогою VR-гарнітури.
Інструменти
Перед тим, як почати свій аналіз, перерахуємо інструменти, які нам знадобляться:
- Sketch
Ми будемо використовувати Sketch для розробки наших інтерфейсів і призначених для користувача сценаріїв. Якщо у вас його немає, можете завантажити пробну версію. Нам подобається працювати з цією програмою, але якщо ви віддаєте перевагу Photoshop або чомусь іншому, нічого страшного. - GoPro VR Player
Це програма для 360-градусного перегляду контенту. Компанія GoPro поставляє її безкоштовно. Ми використовуємо її для перегляду і тестування наших розробок в контексті. - Oculus Rift
Завантаживши Oculus Rift в GoPro VR Player, ми можемо тестувати дизайн в контексті.
________
Закінчення 2-ї частини
Продовження шукайте у нашій рубриці Туторіали