Запуск промосайта «Яндекс.Станции»: уйти от шаблонности и заодно придумать визуальный стиль Статьи редакции
Арт-директор «Яндекса» Иван Оленкевич — о процессе работы над дизайном сайта для «умной» колонки.
Материал из его личного блога.
В России до недавнего времени вообще не было категории «умных» помощников, если не брать привозные англоязычные Google Home и Amazon Echo. И поэтому мы хотели придумать для «Станции» запоминающийся визуальный образ, чтобы, во-первых, пользователи быстро поняли ценность нашей колонки, а во-вторых, чтобы заранее отстроиться от будущих конкурентов.
Посмотрев на сайты других устройств, мы поняли, что нужно выделяться из этой серой массы. Все сайты строятся по одному шаблону: счастливые люди в красивых интерьерах.
Начинаем думать над концепцией промосайта. Что, если показать типовые сценарии «Станции», не показывая её целиком? Как бы от лица колонки. Проверяем быстрыми видеопрототипами.
Всё не то, получаются те же счастливые люди в интерьерах. Приходит идея, что «Яндекс.Станция» настолько умная, что может рассказать и продать саму себя. Такую выходку может позволить себе только «Алиса».
Думаем, как добавить эмоций и красок. Узнаём, что «Станции» будут в разных исполнениях кожуха, поэтому пробуем рисовать прямо поверх них.
Выглядит грязно и неубедительно. И это уже сто раз где-то было. Нужен простой графических ход и запоминающийся образ. Пробуем показать «Станцию» с ракурса чуть повыше и в получившийся силуэт вписать фото и партнёрский контент. И на первой странице интрига — не показываем сходу внешний вид и порционно рассказываем об особенностях.
Силуэт слишком грубый, у «Станции» же нет таких острых граней. Делаем силуэт помягче и продумываем, когда и в каких образах перед нами предстаёт устройство.
Вроде теперь всё сложилось, и у нас получился гибкий, геометричный и узнаваемый образ «Станции», будь то фотография колонки, партнёрский контент или рендеры внутренностей. И этот ракурс мы будем использовать на протяжении всей коммуникации с пользователем. Кстати, стоит этот путь нарисовать.
Это значит, что решения, заложенные в дизайне сайта, должны откликаться в других каналах, и наоборот, промосайт не должен создаваться в вакууме.
Быстро примеряем образы на упаковку, инструкцию и приложение.
Нужно зафиксировать несколько сущностей. Например, как изображать то, что «Алиса» произносит из «Станции»? Пробуем плоские баблы, объёмные баблы в воздухе и просто прямую речь через тире. Будет странно, если на промосайте и в телевизоре «Алиса» будет говорить по-разному.
Решаем, что баблы будут использоваться только в виде чата с «Алисой», а для визуализации вербальной коммуникации используем диалог через длинное тире.
Возвращаемся к сайту, думаем над компоновкой и навигацией.
Решаем разделить сайт целиком напополам. При прокручивании справа меняется информация, а слева визуализируются функции.
Мы уже отказались от фотографий в интерьерах, но в пустом окружении сложно понять масштабы. Приходит идея собирать композиции из «Станции» и предметов.
Подбираем предметы и проводим фотосессию.
Выстраиваем навигацию по вертикали. На первом экране показываем загадочное проявление «Станции» из темноты. Делаем отдельную упрощённую мобильную версию.
Доделываем макеты и передаём в разработку. Тем временем собираем версию для «Маркета» и «Беру».
Дальше дорабатываем мелочи, правим вёрстку, редактируем фотографии, запускаемся и уже делаем вторую версию сайта.
Команда дизайна «Яндекса»: арт-директор Илья Михайлов, дизайнер Иван Оленкевич, фотограф и техдизайнер Аня Пономарёва, менеджеры Лена Кириллова, Денис Новиков и Кристина Домино.
Мелочь, но все же. Иконки бы поменять местами
На сайте все норм. А до рабочего макета доёбываться, такое себе
Я писал про десктопную версию )
А, все. Там уже поправили
Слово «промосайт» с третьего раза правильно прочитал 😆
А как же исходное устройство Алисы
Миелофон
Средний возраст сотрудника Яндекса не позволяет им мыслить так далеко)
И это хорошо
Че-т я не понял.
Почему на фото с предметами, призванном показать масштаб устройства 2 колонки поменьше и 1 большая?
Комментарий удален модератором
Комментарий удален модератором
Комментарий удален модератором
Ну класс, че
Комментарий удален модератором
Надо было счастливых людей в интерьерах
Серьезно. Все хорошо с дизайном, но пока не придумали другого способа передачи человечности предмету, эмоций и одомашненности без изображения человека и сцен из его привычной среды жизнедеятельности. Думаете конкуренты не хотели выделиться, но невежество их сотрудников заставило использовать все тех же счастливых людей в интерьерах?
С дизайном колонки же не стали выделяться. Получился хороший, красивый современный дизайн, но такой же как и у всех остальных колонок. А могли бы сделать и, правда, мелафон, только в нормальном дизайне, а не как угловатый кирпич из фильма, ЦА то российская.
"Посмотрев на сайты других устройств, мы поняли, что нужно выделяться из этой серой массы. Все сайты строятся по одному шаблону: счастливые люди в красивых интерьерах."
И вы решили не выделяться из серой массы? ))
Комментарий недоступен