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

Apple Vision Pro – це не дорога іграшка для технологічних ентузіастів, це перший серійний пристрій, який змушує індустрію відповісти на запитання, яке відкладали роками: як виглядає інтерфейс, коли немає екрану?

У цій статті ми розберемо, "spatial design" (просторовий дизайн), що він змінює в роботі продуктового дизайнера та слід розпочати роботи вже сьогодні.

Що таке spatial design?

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

AR (augmented reality) – цифрові елементи накладаються на реальний світ. Ти бачиш кімнату і в ній – віртуальний об'єкт. VR (virtual reality) – протилежне: реального світу не видно зовсім, ти повністю в цифровому середовищі. MR (mixed reality) – цифрові об'єкти не просто накладаються, а взаємодіють з реальним простором: «знають» про стіл, стіну, руки. XR – термін для всього вищеперерахованого.

Apple Vision Pro працює переважно в режимі MR, але дозволяє плавно переходити між усіма станами – від повної присутності в реальній кімнаті до повного занурення у віртуальне середовище.

Spatial computing – це зміна фундаментального принципу: людина більше не дивиться на екран, вона знаходиться всередині інтерфейсу.

На смартфоні ти тримаєш пристрій у руках і взаємодієш з плоскою поверхнею пальцем. На комп'ютері сидиш перед монітором і керуєш курсором. В обох випадках є чіткий кордон між тобою і пристроєм. У spatial середовищі цього кордону немає. Інтерфейс існує навколо тебе, в тому самому фізичному просторі, де стоїть твоє крісло і кава на столі.

Тобто всі інтуїтивні уявлення про те, «де знаходиться» інтерфейс, більше не працюють.

5 нових концепцій, що з'явились завдяки просторовому дизайну

  • Depth (глибина). У 2D-дизайні глибина – це ілюзія, яку створюють тінями і розміром. Тим часом, у spatial це реальний параметр. Елементи знаходяться на різних відстанях від користувача, і це фізично впливає на сприйняття та увагу.
  • Proximity (відстань). Де розмістити елемент у просторі – на відстані витягнутої руки чи за 3 метри? Це нове проєктне рішення, аналогів якому в мобільному або веб-дизайні просто не існує.
  • Gaze (погляд). В Apple Vision Pro основний метод введення – очі. Ти дивишся на елемент, щоб його виділити, і підтверджуєш дію стисненням пальців. Hover-стани, фокус, навігація – все будується навколо напрямку погляду.
  • Gesture (жест). Замість звичного нам тапу – жести руками у повітрі. Ці взаємодії мають бути інтуїтивними і фізично неперевантаженими: людина не може тримати руки підняті годинами.
  • Environment awareness (усвідомлення середовища). Інтерфейс «знає», де ти знаходишся. Він реагує на освітлення в кімнаті, розпізнає поверхні, враховує контекст. Дизайн, який ігнорує середовище, виглядатиме у spatial просторі так само дивно, як мобільний сайт без адаптивності.

На презентації Vision Pro Тім Кук назвав його «першим spatial комп'ютером». У документації visionOS Apple уникає слова «екран» і використовує натомість поняття «простір»: shared space, full space, window у тривимірному середовищі.

Apple Human Interface Guidelines для visionOS структуровані інакше, ніж для iOS: замість розмірів кнопок і відступів – принципи розміщення у просторі, правила для скляного матеріалу вікон, рекомендації щодо відстані контенту від очей.

Як це змінює роботу продуктового дизайнера

Нові виміри

Продуктовий дизайнер звик до двовимірного полотна. Навіть коли ми говоримо про «z-index» у вебі, це умовність – реальної глибини немає. У просторовому дизайні z-axis стає справжнім параметром. Елементи можуть знаходитись на відстані 50 сантиметрів або 3 метрів від користувача, і ця відстань визначає, наскільки легко їх читати, натиснути чи ігнорувати.

Масштаб теж змінюється. «Правило великого пальця» для мобільного дизайну (мінімум 44pt для інтерактивного елементу) тут не працює. Кнопка на відстані метра від очей і кнопка на відстані трьох метрів потребують різних розмірів, навіть якщо кутовий розмір однаковий.

Eye tracking замість курсора

Це найбільший зсув у патернах взаємодії. На десктопі курсор – це чіткий індикатор наміру. Я навожу мишу на кнопку і тільки потім натискаю. У visionOS погляд є і наведенням, і початком дії одночасно.

Для дизайнера це означає, що hover-стан більше не є підготовчим кроком, він стає першим кроком взаємодії. Якщо елемент реагує на погляд надто агресивно, інтерфейс «стрибатиме» щоразу, коли користувач просто сканує екран. Якщо реагує надто мляво, то відчуття лагу вбиває відчуття якості.

Apple рекомендує принцип «indirect input»: погляд вибирає, але не активує. Підтвердження завжди вимагає додаткової дії – жесту або голосу. Це захист від випадкових натискань, але й нове обмеження для flow дизайну.

Жести і голос як основний input

Проєктування для жестів – це проєктування для тіла. Людина може зробити точний щипок пальцями, але не може годину тримати руки піднятими. Це означає, що складні жести мають бути винятком, а не основним патерном. Apple рекомендує уникати жестів, що вимагають тримати руку в одному положенні довше 2-3 секунд.

Голосові команди у visionOS – не Siri. Це нативний input, інтегрований у систему, а «Scroll down», «Open Mail», «Select all» – це прямі команди без посередника. Тобто тепер дизайнеру необхідно думати про голосові можливості: чи очевидно користувачу, що він може сказати команду прямо зараз?

Типографіка і колір у просторі

Текст у просторовому середовищі читається на фоні реальної кімнати, а не однорідного екрану. Це означає, що контраст не контролюється дизайнером повністю: білий текст на прозорому фоні може стати нечитабельним в яскраво освітленій кімнаті.

Apple вирішує це через «glass material» – матеріал вікон visionOS, який адаптує прозорість залежно від середовища. Але дизайнер досі відповідає за вибір розміру шрифту, товщини накреслення та інтервалу, і ці рішення тут мають більший вплив на читабельність, ніж у 2D.

Доступність

Заколисування (motion sickness) – реальна проблема. Різкі переходи, паралакс-ефекти, швидкий рух об'єктів у просторі можуть викликати дискомфорт у користувачів. Apple має системні Reduce Motion налаштування, але дизайнер відповідає за те, щоб продукт не покладався на рух як єдиний засіб передачі інформації.

Вестибулярні порушення це окрема категорія. Близько 35% дорослих мають певний рівень вестибулярної дисфункції. Для просторового дизайну це означає, що анімації і переходи потребують ще більш виваженого підходу, ніж у мобільному дизайні.

Інструменти та скіли

Figma поки що не підтримує просторовий дизайн нативно. Немає z-axis, немає роботи з реальним простором, немає прев'ю у visionOS. Отже, Figma досі залишається найкращим інструментом для проєктування 2D-інтерфейсів, але для просторового дизайну потрібно шукати інші рішення.

Що є зараз

Reality Composer Pro – безкоштовний інструмент від Apple для створення просторового експіріансу. Інструмент інтегрується з Xcode. Варто зазначити, що дизайнерам без досвіду у розробці буде складно на старті, але є офіційна документація і WWDC-сесії.

ShapesXR – інструмент для прототипування прямо в гарнітурі, що дозволяє створювати і тестувати просторові макети без коду. На сьогодні це найближче до «Figma для spatial».

Spline – 3D-дизайн у браузері з можливістю експорту для веб і AR. Більш доступний поріг входу, ніж Blender або Cinema 4D.

Unity з PolySpatial – для більш складних інтерактивних досвідів. Вимагає знання Unity, але дає максимальну гнучкість.

Чи потрібно вчити 3D-моделювання?

Все залежить від вашої спеціалізації. Якщо ви проєктуєте productivity-застосунки (текст, задачі, календарі) – не обов'язково. Ці продукти у visionOS виглядають як звичайні вікна у просторі, і тут 2D-навички переносяться майже повністю. Якщо проєктуєте імерсивний досвід, ігри, навчальні симуляції або продукти де просторова взаємодія є ключовою – так, базові 3D-навички точно стануть у пригоді. Але починати можна з Spline або ShapesXR.

Навички, які вже є і переносяться

Хороша новина: більша частина того, що робить тебе сильним продуктовим дизайнером, у просторовому контексті тільки цінніша.

  • Розуміння ментальних моделей користувача тут ще важливіше, бо просторовий інтерфейс не пробачає помилки в очікуваннях.
  • Інформаційна архітектура. Щоб організувати контент у просторі необхідно знати ті самі принципи ієрархії та угруповання.
  • Типографіка і візуальна ієрархія – читабельність у просторі будується на тих самих принципах, просто в нових умовах.
  • Проведення дослідження користувачів і тестування – просторовий досвід ще більше залежить від реального тестування, бо симулювати його на моніторі неможливо.

Впроваджувати чи чекати?

Apple Vision Pro коштує 3500 доларів. Це не масовий споживчий продукт. Аналітики прогнозують, що до 2027 року продасться від 1 до 3 мільйонів пристроїв. Для порівняння, iPhone продається понад 200 мільйонів щороку. Абсолютна більшість продуктових дизайнерів ще кілька років проєктуватиме переважно для 2D-інтерфейсів.

Бібліотека нативних visionOS-застосунків невелика, і більшість компаній не планує просторову-версію продукту найближчим часом. Вакансій «spatial designer» зараз мало, і вони переважно у великих tech-компаніях або спеціалізованих студіях.

Тож панікувати не варто, як й ігнорувати. Цикл адаптації ринку завжди довший, ніж здається. Перший iPhone вийшов у 2007 році, а у 2010 році мобільний дизайн все ще був нішевим, коли у 2013 — більшість компаній вже вимагали «mobile-first» у кожному брифі.

Дизайнери, які почали вивчати мобільний UX у 2008-2009, отримали величезну перевагу. Не тому що ринок був готовий, а тому що коли він став готовий, вони вже мали досвід.

Висновок

Не варто сприймати просторовий дизайн, як звичайну 3D-адаптацію звичних інтерфейсів. Це не просто адаптація, а перехід до нової системи координат, де змінюються фундаментальні принципи взаємодії користувача з цифровим середовищем. Отже, висновки:

  • Наступність досвіду. Попри нові виміри, базові компетенції дизайнера залишаються актуальними. Інформаційна архітектура, типографіка та методи тестування залишаються фундаментом. Просторовий дизайн додає нові змінні, але не анулює класичні правила UI/UX.
  • Стратегічна перевага. Вивчення технології на етапі її становлення дає можливість випередити масовий ринок. Регулярний перегляд сесій WWDC протягом короткого періоду забезпечить глибше розуміння галузі, ніж пасивне спостереження за новинами.
  • Перший крок до практики. Для базового занурення достатньо вивчити розділ про принципи взаємодії в Apple Human Interface Guidelines (visionOS). Це дозволить за 30 хвилин структурувати знання про відмінності просторового дизайну та оцінити необхідність подальшого поглиблення в тему.