Дизайн дзен: Студия «ДзенДизайн»
«Дзен» в преддверии перехода к VK представил новый дизайн
Рекомендательная платформа «Яндекс.Дзен», которую планируется передать VK вместе с агрегатором «Яндекс.Новости», стала доступна в виде предварительной версии по адресу dzen.ru. На сайте доступны все элементы, о размещении которых на новом «Дзене» сообщали участники сделки: поисковая строка «Яндекса», заголовки новостей и лента рекомендаций, а также виджет с погодой. Внимание на редизайн обратил автор Telegram-канала «ПроДзен» Игорь Торхов.
Предыдущая фотография
Старый дизайн
Новый дизайн
ru
Следующая фотография
1 / 2
Старый дизайн
Новый дизайн
Фото: Скриншот сайта dzen.ru
С главной страницы бета-версии «Дзена» можно перейти в разделы «Новости» и «Погода». По интерфейсу и содержанию они полностью дублируют текущие «Яндекс Новости» и «Яндекс Погоду», но при этом располагаются на подстраницах dzen.ru и не содержат элементов управления аккаунтом «Яндекса».
В пресс-службе VK «Ъ» сообщили, что представят финальную версию dzen.ru после закрытия сделки. Представитель компании добавил, что сейчас «Яндекс» и VK «работают над решением технических моментов» и тестируют «все ключевые направления», в том числе перенаправление пользователей нынешней главной страницы «Яндекса» (yandex.ru). Ранее о том, что в течение некоторого времени посетители yandex.ru будут переводиться на принадлежащий VK dzen.ru, говорил источник «Ъ». Перенаправлений с cервисов «Яндекса» на dzen.ru на момент публикации не было, старая версия «Дзена» остается доступной на zen.yandex.ru.
Сделка между VK и «Яндексом» была анонсирована в апреле. В августе стороны раскрыли, что VK получит от «Яндекса» новостной агрегатор и рекомендательную платформу, а в обмен «Яндекс» получит сервис доставки еды Delivery Club.
Федеральная антимонопольная служба (ФАС) одобрила сделку с предписанием, при этом большинство требований регулятора касались вопросов конкуренции между Delivery Club и «Яндекс.Едой». Что касается «Новостей» и «Дзена», то VK как их оператор должен будет запрашивать и получать согласия на обработку персональных данных для каждого сервиса в отдельности.
Подробнее о сделке — в материале «Ъ» «»Яндекс» откроет портал в VK».
Юрий Литвиненко
как мы учили людей смотреть ролики Дзена — Дизайн на vc.ru
Я Лена Рамазанова, дизайнер продукта в команде Дзена, которая отвечает за видео. Весь прошлый год я занималась Роликами. Да, именно с большой буквы! Так мы называем раздел коротких видео в Дзене, который появился совсем недавно, около полутора лет назад, но уже занимает важное место в нашей продуктовой экосистеме. Ежедневно в Дзен загружаются тысячи новых роликов.
Но научить аудиторию нашей платформы пользоваться новым форматом оказалось не так-то просто! Я расскажу, как мы сделали это с помощью дизайна.
1622 просмотров
Пролог
Дзен — это контентная платформа для блогеров. Здесь есть несколько основных форматов, которые позволяют авторам самовыражаться: лонгриды (они же статьи), короткие текстовые посты, длинные видео и ролики. И если текстовый формат существовал достаточно давно (читай: с самого основания платформы), то с видео мы начали свои отношения всего четыре года назад. Спустя еще пару лет мы заметили успех видео у пользователей Дзена и прибавили к этому мировой тренд на потребление коротких форматов. Тогда мы приняли решение запустить ролики — вертикальные залипательные видео длительностью от 5 секунд до 2 минут.
На том этапе нам предстояло познакомить своих постоянных пользователей с новым для них форматом и изменением интерфейса Дзена: показать, где смотреть ролики, чем они отличаются от длинных видео, как их листать.
В контексте же новой аудитории все было еще сложнее: в массовом сознании Дзен — это тексты, поэтому перед нами стояла задача развеять этот миф. Все это — чтобы радовать пользователей разнообразным контентом.
И мы взялись за дело. С помощью разных интерфейсных паттернов.
Часть 1. В которой мы понимаем Самую Главную задачу
Начать придется издалека. Раньше ролики в Дзене можно было найти дважды: целенаправленно пойти в специальный раздел или случайно встретить, листая ленту (АПД: сейчас ролики тоже можно встретить в ленте, но не по одному, а в общей карусели).
В ленте ролик представлен карточкой: это обложка плюс названия видео и канала, на котором оно размещено.
Точки входа в Ролики
Повзаимодействовать с этой карточкой можно было двумя способами: не трогать ее или все-таки на нее кликнуть. В первом случае ролик проигрывался прямо в ленте, а во втором — разворачивался на весь экран. И вот здесь пользователь мог задержаться подольше — свайпая вниз и просматривая новые ролики.
Как бы не так! Люди чаще всего просто кликали на видео в общей ленте, смотрели его и переходили обратно, закрывая режим просмотра роликов.
Нам было критически важно это изменить, ведь сама концепция продукта заключается в том, чтобы именно залипать в интересные короткие ролики. К тому же свайпы, лайки и подписки позволяют алгоритмам Дзена точнее выявлять интересы аудитории и персонализировать ленту.
Так мы поняли: важнее всего — обучить пользователей открывать карточки роликов и листать их.
Часть 2. В которой пользователю очень захочется развернуть ролик
Мы предположили, что анимированные интерактивные элементы на карточке привлекут пользователя и ему захочется на них нажать. Но какими бы они могли быть? Мы начали подбирать варианты.
Сначала мы применили так называемую механику Stop&Go (англ. «остановись и иди»), которая отключала автоповтор видео в общей ленте. Теперь после его завершения пользователя встречала кнопка «Смотреть еще ролики».
Выдающихся результатов подход не принес, и мы решили пойти дальше. Так в конце каждого ролика появились рекомендации — с другими видео этого же автора.
Эти эксперименты увенчались успехом! Пользователи начали активнее переходить в ленту роликов. Ура!
Часть 3. В которой мы учим людей свайпу
Здесь мы решили упростить себе задачу и вместо образовательных элементов, которые бы призывали перелистывать один ролик за другим, взяли и внедрили автосвайп. То есть пользователю теперь не нужно прикладывать вообще никаких усилий, чтобы бесконечно смотреть ролики!
Чтобы подчеркнуть новую функцию, мы добавили специальный таймер, который стал предупреждать о следующем видео за четыре секунды до первого автоматического перелистывания. Похожую механику вы могли видеть в онлайн-кинотеатрах, где после окончания одной серии включается следующая.
Компонент с таймером
В результате эксперимента мы получили классные результаты:
● +2% к суммарному времени, которое пользователи проводят в ленте роликов
● +11% к сессиям с двумя просмотрами
● + 6% к сессиям с тремя просмотрами
Последний показатель говорит о том, что часть пользователей научилась свайпать ролики.
Разумеется, после такого эффекта мы оставили эту механику. Тем не менее нам хотелось, чтобы люди листали ролики осознанно. Поэтому мы пошли дальше…
…и решили сделать для первых нескольких просмотров роликов онбординг. Так называются обучающие механики, в нашем случае — для свайпа карточек вверх. Нам было важно, чтобы решение было не раздражающим, а интерфейс онбординга минимально перекрывал контент. Для этого мы выбрали иконку руки, которая наглядно демонстрировала, что ролики можно листать.
Онбординг свайпа карточек
В аналогичном стиле сделали и онбординг других жестов. Например, свайп влево переносит пользователя в ленту автора ролика, а двойной тап поставит лайк.
Онбординг лайка
Онбординг ленты автора
Специально для онбординга наша иллюстраторка Таня Комарова нарисовала несколько вариантов иконки руки.
Из них мы выбрали вариант № 1 — что-то среднее между самой строгой (№ 4) и игривой, похожей на мультяшную перчатку (№ 6), иконками.
Результаты эксперимента показали, что благодаря онбордингу время, проведенное в ленте роликов, увеличилось на 3,5%, а количество сессий с двумя и тремя просмотрами — до 13,9% и 10,5% соответственно.
Часть 4. В которой поиск новых роликов становится намноооого удобнее
Введем новые переменные: в Дзене есть витрина — отдельный раздел, где публикуются разные тематические подборки авторов и материалов. С ней совмещен Поиск. Это дано.
Раздел «Интересное» в Дзене (или витрина)
Исторически сложилось так, что в материалы витрины попадало не очень много роликов. И нам захотелось это изменить.
Мы подумали, что было бы здорово учитывать, откуда пользователь переходит в раздел роликов, — то есть сделать поиск и витрину контекстными. Так родилось еще одно продуктовое изменение: при переходе в раздел Поиска из Роликов для пользователя формируется собственная витрина с короткими видео. И не рандомными, а подобранными алгоритмом специально для него.
В первой версии мы стали показывать ролики в виде простой сетки. Сначала она выглядела так:
Первый вариант витрины Роликов
Во второй итерации мы изменили сетку так, чтобы разбавить стандартные ячейки более крупными, как на этом скрине:
Второй вариант витрины Роликов
Для пользователей iOS крупные ролики еще и проигрываются прямо в этой витрине. У пользователей Android такая функция появится в скором будущем. В планах также добавить теги, чтобы искать ролики стало совсем просто.
Часть 5. В которой лента роликов становится максимально интересной (а подписки на авторов растут)
Если пользователь ни на кого не подписывается, а просто смотрит случайные ролики, его лента, конечно, все равно будет интересной. Но не такой, какой могла бы быть, подпишись он на понравившиеся каналы.
В таком случае в ленте появляются не только карточки-рекомендации, но и материалы любимых авторов.
Это улучшает ее качество и делает пользовательский опыт более приятным.
Поэтому мы запустили несколько экспериментов, чтобы мотивировать пользователей больше подписываться на авторов роликов
Эксперимент с кнопкой подписки
Раньше в Роликах кнопка подписки была маленькой и не для всех заметной. Из-за этого подписки на блогеров шли не слишком активно.
Чтобы это изменить, мы сделали большую кнопку «Подписаться», но ради эксперимента показывали ее только в тот момент, когда пользователь ставил лайк ролику или делился им. Мы хотели, чтобы предложение подписки воспринималось как забота и помощь со стороны Дзена.
Увеличенная кнопка подписки
Потом мы взяли и анимировали маленькую кнопку подписки — ту, что выглядит как знак «+» в кружочке. С того момента и до сих пор она завлекательно покручивается и манит на себя нажать. Она находится на видео все время, но двигаться начинает, только если пользователь лайкнул ролик или посмотрел его несколько раз.
Анимированная кнопка подписки
Эксперимент с игровой механикой
Новым пользователям мы предлагаем подписаться хотя бы на пятерых авторов. Это поможет алгоритмам понять, что интересно именно этому человеку, и начать предлагать ему релевантный контент.
Интерфейсно мы решили использовать такой снек-бар:
Разные варианты снек-бара
Сейчас прогресс-бар выглядит иначе: это кольцо, которое заполняется по мере роста количества подписок. Так мы вызываем у пользователя азарт: хочется поскорее заполнить прогресс-бар и получить подарок в виде качественного контента.
Когда пять подписок собраны, поздравляем пользователя фейерверком из конфетти:
Конфетти добавляют интерфейсу эмоций, делают его более человечным. Это особенно важно при знакомстве пользователя с новым сервисом.
Эксперименты удались! Вот как выглядит часть их результатов:
● количество пользователей с одной новой подпиской увеличилось на 1,7%
● пользователи с 5+ подписками приросли на 15%
● число подписок в роликах стало выше на 9%.
Часть 6. В которой ролики чувствуют себя как дома
Мы решили отдельно позаботиться о пользователях, которые смотрят ролики особенно активно. Нам было важно сократить их пользовательский путь.
Сначала мы ввели настройку, которая позволяет изменить порядок табов в навигации приложения. Так Ролики можно поставить на первое место. Открываешь приложение — и сразу попадаешь в ленту роликов.
Следующим решением стала нативная функция андроида, позволяющая установить на рабочий стол телефона иконку Роликов. С помощью этой функции мы практически создали отдельное приложение роликов, где пользователь сразу попадает в ленту контента только одного формата — коротких видео.
Эпилог
В этой заметке мы рассказали лишь о небольшой части того, что происходит с дизайном в Дзене. Мы планируем продолжать эксперименты — чтобы делать наш продукт удобнее для пользователей. Хотите знать больше про дизайн в Дзене? Подписывайтесь на наш Дзен-канал.
Дизайн ZEN
на складе в 4 вариантах отделки и 5 размерах
SANTA FE GRANADO
Шкаф-ручка матового черного цвета
Купить коллекцию прямо сейчас
в наличии на складе в 3 размерах
Скандинавия Ручка
Мебельная фурнитура Ручка
Купить коллекцию сейчас
в наличии в 2 вариантах отделки: античный и матовый никель
Manico di Cotello
Фурнитура для шкафа Pull
Купить коллекцию прямо сейчас
в наличии в 4 вариантах отделки
Fune Gales
Фурнитура для шкафа Дверная ручка
Купить коллекцию прямо сейчас
Эксклюзивный современный дизайн
Жить с большим Дизайн означает жить больше ZEN
Наши дома — это небольшие спа-салоны, где каждый предмет играет терапевтическую роль, воздействуя на нас ежедневно.
ZEN Design уделяет большое внимание дизайну своих коллекций, что является результатом сотрудничества с нашим отмеченным наградами дизайнером Клебером Луисом, партнером-основателем и творческим умом, стоящим за коллекцией бренда.
Разработан, разработан и изготовлен в Бразилии. На складе и отправлены из Флориды.
Где купить
Название продукта 19,99 долларов США
Название продукта 19,99 долларов США
Название продукта 19,99 долларов США
Оборудование шкафа
ПРИНАДЛЕЖНОСТИ ДЛЯ ВАННЫ
ДВЕРНАЯ фурнитура
Allen Granado Pull из античного никеля
Наш бестселлер
Нажмите на картинку +, чтобы ознакомиться с нашими самыми продаваемыми продуктами из фурнитуры для шкафов.