Зачем брендам нужны дизайн-системы, можно ли научить дизайнеров кодить и как инструменты паблишинга повышают вовлеченность в рекламных лонгридах — спикеры Mail.Ru Design Conference + Dribbble Meetup 2018 рассказали о последних трендах в продуктовом дизайне. Александр Окунев, продуктовый дизайнер, архитектор дизайн-систем и автор канала @sketchdesigner, вел прямую telegram-трансляцию мероприятия и собрал для Sostav самые интересные выступления спикеров.
Крупнейшая российская дизайн-конференция выросла из маленькой тусовки в баре. Именно так во всём мире проходят встречи дизайнеров, вкладывающих свои работы (шоты) на платформе Dribbble. Несколько лет московский Dribbble Meetup проходил в офисе компании Mail.Ru Group и собирал иллюстраторов, дизайнеров интерфейсов, UX-специалистов и других на неформальный митап, где все могли пообщаться, обсудить последние работы, а после переместиться в бар.
Но в в этом году дизайн-команда Mail.Ru Group полностью поменяла формат выступлений и превратила митап в конференцию по продуктовому дизайну. О своих кейсах и опыте рассказали команды «Альфа-Банка», Rambler&Co, «Сетки» (Look At Media), Mail.Ru Group и др. Много говорили о трендах в визуальном дизайне, инструментах для командной работы, взаимодействии дизайнеров и разработчиков и о самой актуальной теме — систематизации дизайна.
Одним из первых выступил Влад Зелинский из RealtimeBoard — сервиса с онлайн-досками для командной работы, в которых можно коллективно генерировать идеи и вести проекты. RealtimeBoard столкнулся со сложной проблемой: он умеет слишком много, и поэтому каждому типу пользователей: менеджерам, дизайнерам, проектировщикам интерфейсов, исследователям и пр. — нужно рассказывать, как пользоваться продуктом. Это решено через разные посадочные страницы, через кастомизацию и подсказки, которые предугадывают намерения. Например, если пользователь начинает работать над текстом, всплывают подсказки, как работать со стилями текста и создавать единый стиль для всего проекта.
Саша Ермоленко, директор департамента дизайна Rambler & Co рассказывала о систематизации дизайна в медиахолдинге и о том, как внутренняя команда развивает фирменный стиль, предложенный агентством ONY. То, что делает брендинговое агентство, как правило, ориентировано на красивую картинку, и получившийся дизайн нужно дорабатывать, чтобы использовать в живом продуктовом проекте. Ребята из команды Rambler описали, как внедряли кастомный шрифт, делали единый личный кабинет для разных проектов и приучали пользователей к ярким цветам.
Свою дизайн-систему Rambler разрабатывает по методологии атомарного дизайна — когда дизайн строится на базе вложенных друг в друга компонентов подобно тому, как устроена «матрешка». Компоненты стыкуются друг с другом как конструктор Lego.
Тему рекламных спецпроектов и визуального сторителлинга затронул Роман Худоногов из проекта «Сетка» (Look At Media). Setka. io — инструмент паблишинга, который можно встроить в любой сайт, делать эффектные лонгриды и оптимизировать контент под разные агрегаторы новостей типа Apple News и Google Amp. По словам Романа, с помощью дизайна можно создавать материалы, которые современный пользователь смартфона будет читать с удовольствием и более вовлеченно.
Дизайн-система «Альфа-Банка» построена на базе программного кода, и стала инструментом не для дизайнеров, а для разработчиков. Дизайн формируется не из макетов, как обычно, а из кусков кода (компонентов), которые можно вставить в нужное место и вкладывать друг в друга. Таким образом, в финтех-компании дизайн — это уже не «про красивые картинки», а про разработку и технологическую систему, через которую пользователи взаимодействуют с продуктом.
CEO проекта Phase Ник Бадден на конференции пообещал, что летом 2018 выпустит свой новый продукт для проектирования интерфейсов. Phase уже привлек инвестиции и в будущем составит конкуренцию популярным инструментам Sketch и Figma. По словам Ника, дизайн-инструменты, которые есть сейчас, оперируют устаревшими парадигмами. Например, что экран компьютера и печатная страница — это одно и то же. Так что Phase вполне может занять свою нишу на этом рынке.
Дизайн-команда Mail.Ru Group посвятила свое выступление работе над стилем Mail.Ru Design Conference + Dribbble Meetup 2018. Как отметили организаторы, миссия конференции — прокачивать дизайнеров, поэтому они пришли к идее разместить шкафчики как в спортзале и баскетбольные мячи с корзиной. Тем более, что сам термин to dribbble пришел из баскетбола и означает «ведение мяча».
«В этом году мероприятие называется Mail.Ru Design Conference. Мы делаем уйму активностей ? конференция, конкурс Russian Design Cup, митапы UX-Среда, интенсив в „Британке“ и онлайн-курс Contented. Но вести всё это по отдельности достаточно запарно ? разные бренды, разные сообщества, нет понятного графика между ними и случаются накладки. Трансформация началась с конференции и продолжится остальными активностями. Основная миссия конференции — развивать отечественный дизайн. Приличному количеству начинающих и опытных дизайнеров эти полезные мероприятия помогают расти, да и нас самих здорово подстегивает. Посмотрим, что у нас получится через год», — отметил Юрий Ветров, директор по дизайну бренда Mail.Ru.
Завершилась конференция очаровательным докладом «Яркая иллюстрация» от художников Димы и Лены Штольц. Живя в Омске, ребята рисуют 2D-иллюстрации для ВКонтакте, Wargaming, IKEA и PornHub. Свои работы иллюстраторы делают по-старинке в Corel Draw и считают, что можно работать в любых инструментах — главное, чтобы творчество доставляло удовольствие. В работе Димы и Лены много отсылок к другим картинкам, много пасхалок и юмора и провокаций.
А дальше конференция плавно перетекла в бар, где были мини-доклады по 20 минут и фирменное пиво Dribbble Meetup.
Сфера дизайна интерфейсов переживает пышный расцвет и мощный приток инвестиций: выходят новые дизайн-инструменты, дизайн смешивается с программированием, а крупные компании стремятся максимально автоматизировать и систематизировать все связанное с дизайном. И как шутили в зале — надо больше дизайн-систем!
Запись прямой трансляции с Mail.Ru Design Conference + Dribbble Meetup 2018