Моделируем реальность: как технологии VR и AR влияют на веб-дизайн
Виртуальная и дополненная реальность пока применяются не часто, но некоторые наработки этой индустрии можно использовать уже сейчас. Рассмотрим, как они влияют на дизайн и юзабилити, и что можно задействовать в дизайне своего сайта уже сейчас.
В чем отличия двух технологий
Виртуальная реальность (VR) моделирует отдельный мир. Для взаимодействия нужны специальные устройства, передающие движения человека и воздействующие на органы чувств, чаще всего это шлем или очки.Больше всего VR-контента в игровой индустрии, но для широкого применения устройствам не хватает мощностей, контент сложно адаптировать, а из-за качества видео после погружения в «виртуальный мир» кружится голова.
С дополненной реальностью (AR) работать проще. Это реальный мир, дополненный виртуальными элементами, которые его «расширяют» или «обогащают».
По данным Forbes почти 75% мировых брендов применяют VR-приложения в своей индустрии, чтобы повысить уровень сервиса.
Дополненная реальность уже помогает представить как мебель Ikea будет смотреться в вашем интерьере, используя только приложение для смартфона, а кроме того она дает возможности:
- посмотреть комнату в гостинице перед бронированием;
- примерить одежду, пользуясь своим аватаром на сайтах магазинов;
- пройти тест-драйв автомобиля;
- воспользоваться картой;
- больше узнать о бренде;
- сыграть в игру, связанную с брендом.
По данным исследования, проведенного Sketchfab — одной из крупнейших платформ, публикующих 3D-контент, большинство членов сообщества (49,1%) верят, что основная зоной применения VR останутся игры. На втором месте образование, а на третьем медицина.
Другое исследование, проведенное Statista, показывает, что рынок и виртуальной, и дополненной реальности вырастет до $ 29,5 млн в 2020 году по сравнению с $7.1 млн в 2017.
Трудно сделать прогноз относительно неигровой индустрии, но эксперты говорят об огромный интерес к этой технологии со стороны бизнеса и общества.
Технические гиганты, включая Facebook и Microsoft вкладывают миллионы долларов в эту область, что постепенно превращает VR веб-дизайн из научно-фантастического сна в реальность.
VR-технологии в рекламе
Компании из разных сегментов уже используют VR в рекламе. Volvo с помощью приложения старается передать ощущение от управления автомобилем, а Oreo показывает мир шоколада в своем видео 360.Помимо игр, дополненная реальность становится мостиком между офлайн и онлайн-продажами.
Например, в магазинах Zara в Испании покупатель может отсканировать вещь, которую собирается примерить, и при необходимости сразу отправить консультанту запрос принести другой размер или цвет.
VR-технологии в веб-дизайне
Попытки создания «объемного» пользовательского опыта начались еще в 1962 году с работы над масштабируемым интерфейсом пользователя (Zooming User Interface). В рабочей области располагались основные элементы, а дополнительные появлялись по мере приближения и увеличения содержимого. Предполагалось, что масштабируемость повысит уровень вовлечения и визуально обогатит, а также упростит пользовательский опыт. Эти идеи противоречили друг другу, и технология не прижилась.
Пока мы еще не ходим в VR-очках каждый день, технология уже повлияла на пользовательский опыт в интернете. В первую очередь, это появление 3D-карт и контента 360 — возможность увидеть товар в разных ракурсах, «погулять» по Google Earth или гостинице, в которой вы хотите забронировать номер.
Такой виртуальный тур есть на сайте нашего клиента CCI. Выбрать офис для своей компании и получить впечатление о всем здании становится проще, если можно посмотреть не только фотографии и видео, но и виртуальную модель. Она лучше передает ощущение пространства и расположение объектов.
Еще один фактор, способствующий развитию VR веб-дизайна — появление библиотеки WebVR Javascript. WebVR загружает 3D-контент прямо в браузер, поэтому скачивать отдельные приложения для просмотра не надо, что удобно и пользователям, и рекламодателям.
Несмотря на высокую точность имитации окружающей действительности, технология виртуальной реальности пока находится на стадии скеоморфизма, интерфейсы имитируют внешний мир. Новая технология ориентирована на широкий круг пользователей, к ней нужно привыкнуть.
На следующей стадии эмуляция реального мира больше не понадобится, весь информационный шум исчезает и появляется тенденция минимализма, чистых интерфейсов.
Для перехода на эту стадию нужен массовый доступ к устройствам и достаточное количество контента, но существующие разработки уже можно применить в дизайне своего сайта.
Другие посты
Темное искусство оценки проекта
Многие сталкивались с ситуацией, когда оценка пула задач в один месяц превращалась во все четыре. Поделимся своим опытом и расскажем, как этого...
Сила первого впечатления: как сделать сайт...
Бизнес давно ушел от мигающих баннерами и разными шрифтами сайтов из начала 2000-х и все больше прислушивается к мнению аудитории. Но...
Как уйти от банальных метафор в иконках
На сайтах иконки используются как дополнительный арт-объект, чтобы избавиться от пустоты. Они превратились в визуальный мусор. Попробуем добавить в...
Как интегрировать сайт с внешними сервисами
Современные приложения и сайты не могут быть изолированы. Через внешнюю интеграцию настраивается авторизация через соцсети, оплата онлайн, заказ...
Как создать личный кабинет, который понравится...
Личный кабинет — это буквально способ взаимодействия с сайтом, а значит, и с вашим сервисом. Поговорим о том, как сделать его удобным для...
В своем стиле: как сделать дизайн сайта...
Поговорим о том, как оригинальные иллюстрации могут стать вашей визитной карточкой в диджитал.
Разрабатываем алгоритм праздника: как...
В 2019 году нам удалось поработать с Почтой Mail.ru уже над тремя интерактивными проектами к праздникам. Расскажем о проектах и технической...
Метод гипотезы. Какие приемы из дизайна...
Приложения для смартфонов задают тренды в дизайне и влияют на проектирование интерфейсов. Мы выдвинули несколько гипотез о том, как дизайн...
Первый хакатон на РИФе: как это было
В этом году в рамках Российского интернет-форума впервые прошел хакатон, в котором команда Далее заняла первое место. Расскажем о разработанном...
Как сделать сайт для премиального сегмента...
Иллюстрации, видео и текст— это и есть эмоции, которые передает ваш сайт. Они задают тон и контекст — то, как пользователи будут воспринимать...
Литературные тропы в дизайне: метафоры и их...
С помощью визуальных образов дизайнеры, иллюстраторы и фотографы рассказывают истории. Метафоры — это то, что делает истории интересными....
Ключевые детали: как повлиять на решение...
Этот маленький навигационный элемент сайта может изменить восприятие продукта, пользовательское поведение и повысить конверсию. Разбираемся, как...
Мифические существа в digital: фулл-стек...
На рынке существуют полярные мнения о фулл-стек разработчиках: одни специально ищут их для проекта, другие ставят в один ряд с драконом и...
Уникальность в рамках системы
Разбираемся, ограничивают ли дизайн-система и UI-kit творческие решения дизайнеров, как разработать нестандартную идею в рамках системы и...
Проверяем свое везение. Как работают розыгрыши...
Наши клиенты часто проводят интересные конкурсы и промоакции, а мы создаем промостраницу и работаем над техническими аспектами розыгрышей....
Как найти сокровища в фотостоке
Даже крупные бренды совершают ошибки при подборе фото для иллюстрации своих услуг. Разбираемся, как найти изображения для сайта, которые вызовут...
Искусство диалога: налаживаем общение с клиентом
Много сил вкладывается в создание маркетинговых стратегий, формирование правильной команды, выбор технических инструментов, но стандарты общения...
Страница 404: как помочь пользователю, если он...
Все мы бывали на странице 404. Эта ошибка означает, что страница не найдена. Поделимся своим опытом, как этого избежать, и не только не...
5 Полезных инструментов для менеджера и всей...
Для организации процесса появилось так много программ, что выбрать подходящую уже непросто. У каждого своего приложения для смартфона и облако, а...
Как работать с другим агентством и улучшить проект
Часто привлечение нескольких агентств неизбежно, если речь идет о сложном и масштабном проекте. Разбираемся, какие плюсы и минусы в этой ситуации...
Когда релиз? Оцениваем эффективность команды...
В команде разработки МегаФона мы постоянно работаем над контролем качества кода. Для этого у нас есть практика code review, автотесты и разные...
Must have в веб-дизайне
В этом списке вы не прочитаете предсказаний о популярности видеоконтента, голосовых интерфейсов и адаптивной версии сайта, потому что и так об этом...
«Как у Тинькова»: какими решениями мы обязаны...
Российские банки одними из первых в рунете начали превращать свои сайты в сервисы. Этому способствовало несколько факторов. Во-первых,...
Волшебная кнопка. Чек-лист для повышения...
Эффективность промосайта зависит не от дизайна, копирайта и выгоды предложения. Успех заключается в том, как все работает вместе и образует...
Тренды диджитал-маркетинга в 2019 году
Мы давно слышим о том, что блокчейн и VR меняют нашу жизнь в Сети, но пока они все еще кажутся технологиями из сериала «Черное зеркало». Поговорим...
Топ 5 материалов 2018 года
Весь год мы рассказывали о наших разработках, интересных рекламных кампаниях, делились опытом и своим взглядом на применение новых технологий в...
Новогодние традиции в Далее. Спойлер: это не...
В декабре все переживают не только из-за отчетов и мероприятий, но и о том, как поздравить клиентов. В Далее есть праздничная традиция, которая...
Как нанять робота вместо менеджера проекта
Мы в Далее ищем новые способы оптимизировать распределение ресурсов и тестируем для этого разные технологии. Недавно наша команда разработала...
Микромультик для Микролакса
Для продвижения средства Детский Микролакс наш клиент Johnson & Johnson предложил конкурс, который порадовал мам и детей, а также помог в...
Время экспериментов. 10 карточек по A/B...
Рассказываем о методе, который поможет улучшить юзабилити сайта, увеличить трафик и главное – повысить конверсию.
Не заставляйте меня думать: как снизить уровень...
Технологии и стандарты меняются, и дизайн сайта должен им соответствовать. Но даже если новый дизайн эстетически и функционально безупречен,...
В поисках Dream Team для разработки сайта
Найти классную команду для разработки проекта – это челлендж для менеджера. Построить работу можно по-разному: собрать команду у себя в штате,...
Релиз или жизнь? Хеллоуин в digital
В самую страшную ночь года на специалистов нашего диджитал-агентства больше ужаса наводят не сверхъестественные силы, а дедлайны, и самые страшные...
Как данные и эмоции меняют дизайн
Четкий подход при создании нового сайта или его редизайне поможет систематизировать работу: не нужно принимать решение наугад и думать, выстрелит...
Темная сторона дизайна
Apple сделал темную тему основной по умолчанию для новой Mac iOS, а Youtube начал тестировать темный фон еще год назад. Темные темы в интерфейсах...
Зачем нужно тестирование сайта
До тестирования сайт ведет себя как кот Шредингера. Вы не знаете, работает ли все так, как задумано. Тесты перед запуском или обновлением сайта...
Большой брат: как и зачем использовать...
Сегодня сайт может подстраиваться под пользователя в реальном времени, что помогает укрепить отношения с брендом и соответствовать высоким...
Дизайн B2B-портала: найдите отличия
Есть мнение, что в компаниях, которые оказывают услуги для B2C и B2B, необходим разный подход к разработке дизайна для своего сайта, т.к....
Еще раз об эффективности: чек-лист перед...
Чтобы взять все необходимое в поездку, организовать порядок в доме, начать вести здоровый образ жизни, можно воспользоваться чек-листами. Та же...
Типографика в веб-дизайне
Типографика на сайте – это не просто выбор шрифта, а набор правил оформления текста. Они основаны на том, как пользователь воспринимает текст на...
Как бренду рассказать свою историю
Психологи-эволюционисты доказали, что притягательность историй обусловлена строением нашего мозга. По данным сайта brainrules услышанную информацию...
Финансовые сервисы в digital: будущее уже...
Удобство нашей жизни во многом зависит от скорости развития финансового сектора в digital. Многие уже привыкли к оплате коммунальных услуг на сайте...
UX-аналитик и другие профессии с приставкой UX
UX-дизайн определяет, каким будет опыт взаимодействия пользователя с продуктом. В процессе проектирования пользовательского опыта участвуют четыре...
Как отличить атомарный дизайн от UI-kit
Невозможно перестараться, оптимизируя работу над дизайном. Можно подойти к вопросу глобально и воспользоваться методологией атомарного дизайна, а...
Преимущество использования отзывчивого веб-дизайна
Как адаптировать дизайн под разные устройства, чтобы он оставался удобным для пользователя? Вместе с контент-продюссером компании InVision Уиллом...
Лучшие диджитал-кампании к Чемпионату Мира 2018
Чемпионат стартовал 14 июня, и острая борьба среди брендов началась задолго до этого. На самом главном спортивном мероприятии в мире мы увидим не...
Как составить контент-план, который работает
От контента зависит максимум эффективности кампании. Что лучше, традиционный подход с подготовкой всего контента на месяц вперед или эксперименты в...
Правило Хемингуэя: как агентству и заказчику...
В оценке качества креативной концепции есть две проблемы. Первая — как его оценивать агентству, внутри команды, что пропускать дальше, а что...
Обзор самых популярных систем для управления...
Система для управления проектами может сильно повлияет на продуктивность компании. Сложно определиться с системой для работы с клиентами, и еще...
Сам себе Youtube: 5 шагов к вирусному контенту
Над видео для компании лучше работать вместе с продакшн-агентством. Вы смотрите портфолио агентств и выбираете подходящее по стилю и по цене. Что...
Как агентства представляют свои кейсы
Когда заказчик обращается в агентство, ему нужен не просто сайт или промокампания, а гарантии и решение проблемы. И кейсы показывают, насколько...
Просто о сложном: agile-разработка
Изначально аджайл был вотчиной программистов. Так они называли методы разработки ПО, принципиально отличавшиеся от традиционного. Но оказалось, что...
Что такое нативная реклама и как она работает
Несколько лет подряд все говорят о нативной рекламе. Недавно Business Insider заявили, что к 2021 году выручка от нее вырастет до 74% от общих...
Разработка единой дизайн-системы для группы ВТБ
Собственные дизайн-системы – что это? Модный тренд или рабочий инструмент для качественного продвижения бренда? Рассказываем про наш опыт.
Чем дизайнер продукта отличается от просто...
Мы собрали пять отличительных признаков дизайнера продукта от дизайнера, занятого на «потоке» — чтобы окончательно разобраться в вопросе и...
Быстрее, выше, сильнее: как использовать видео...
Почему видеоконтента становится всё больше, где стоит размещать ваши видеоролики, и как сделать их ещё лучше.
Микроинфлюенсеры – будущее маркетинга влияния
Одним из трендов инфлюенс-маркетинга стал «подъем микроинфлюенсеров» — блогеров с небольшой, но активной аудиторией. Бренды обращают меньше...
Мессенджер-маркетинг как современный способ...
Мы решили сделать обзор самых популярных мессенджеров и выяснить, как бренды могут использовать их для коммуникации с клиентами.
Формы оплаты работ за разработку сайта
Мы разберем детально какие бывают формы ценообразования на создание интернет-проекта.
Как убрать непонимания при общении с исполнителями
Как и в любом коммуникационном процессе, у вас могут возникнуть недопонимания или даже конфликтные ситуации с вашим подрядчиком. Это норма нашей...
В каких конкурсах участвовать, если вы...
Сейчас столько конкурсов, фестивалей и премий, что уследить за всеми невозможно. Расскажем о лучших отечественных и зарубежных мероприятиях, в...
Ищем подрядчика по разработке сайта (2 часть)
Как начать искать подрядчиков? Чем руководствоваться при выборе таких специалистов? Читайте продолжение статьи про особенности подбора...
Как искать подрядчика по разработке сайта (1...
Самый надежный путь — сформулировать свои задачи, критерии поиска и отбора подрядчика и заняться поиском самостоятельно.
Поддержка и развитие сайта
Работа над сайтом не прекращается после подписания акта и сдачи проекта. Сайт или интернет-проект — это инструмент, который постоянно...
PR-менеджер в digital-агентстве: 2017
Бюджеты, зарплата, показатели, достижения и профессиональные трудности.
Выбор платформы для создания сайта
Последствия выбора платформы проявляются на финальных стадиях работы над проектом или после его сдачи заказчику.
Сколько стоит разработка корпоративных сайтов
Мы рассмотрим самый популярный тип проекта — корпоративный веб-сайт. На основе рыночных исследований мы выделили 3 ценовых группы и разобрали...
Цели проекта: имиджевые, финансовые, смежные.
В первую очередь ответьте на вопрос «Для чего и для кого делается этот интернет-проект?»
На западном фронте: особенности работы с...
О работе с западными заказчиками писали много, но в основном о финансово-юридических моментах. Мы же осветим другую сторону — организационную,...
Онлайн-трансляции в соцсетях любят больше, чем...
Live-трансляции могут быть полезны и для продвижения товаров, услуг, бизнес-мероприятий. На примере благотворительной акции банка расскажем как...
Блогеры решают: Influencer Marketing в действии
Лучше всего работает та реклама, которая не выглядит, как реклама. Поэтому сегодня Influencer Marketing становится всё популярнее. Рассказываем,...
«Мы решили заправить Instagram тем, чего от...
Агентство «Далее» запустило кулинарный Instagram-сериал с комедийной актрисой Мариной Федункив из «Реальных пацанов» в главной роли.
UFS.Travel: увеличение количества продаж за...
Команда UFS.Travel и digital-агентство «Далее» о том, какие обновления на сайте поспособствовали повышению конверсии на 16%.
KPI digital-кампаний: к чему нужно быть готовым
KPI (Key Perfomance Indicators) — ключевые показатели эффективности. Иногда их для краткости называют «метрики». Существование метрик...
Как решать конфликтные ситуации с трудными...
Разбирая проблему возникновения конфликтных ситуаций с так называемыми сложными клиентами, в первую очередь нужно сказать, что любое агентство,...