Не Sketch единым: какие инструменты используют команды при работе над UX, UI и CX

Представители Avito, «2ГИС», «Точки», «Сибура», «Сбербанка» и TalentTech рассказали Redmadrobot Design Lab про дизайн-тренды, любимые инструменты и кумиров в мире создания продуктов.

В закладки
Аудио
Офис Redmadrobot​

Redmadrobot Design Lab продолжает цикл статей о продукте и дизайне. В прошлой статье мы рассказали, чем занимается менеджер продукта, и спросили у представителей профессии про выгорание на работе, приёмы для улучшения продукта и создание сильной команды.

Сегодня мы поговорим про тренды и инструменты: что и как советуют использовать продакт-менеджеры из Avito, «2ГИС», «Точки», «Сбербанка», «Сибура» и TalentTech и на кого они равняются в работе над продуктом.

Про инструменты, проверенные временем

По словам владельца продукта в «Сибуре» Игоря Громова, начинать работу следует, только когда в команде достигнуто полное взаимопонимание. По его мнению, здравый смысл — основа, на которой зиждется разработка любого продукта.

Здравый смысл позволит обнаружить, почему ваши инновационные приёмы не находят понимания у коллег. И при идеальном раскладе помогут устранить основу этого непонимания. Поэтому здравый смысл — главное решение, без которого не обойтись ни сегодня, ни в будущем.

Игорь Громов
владелец продукта в «Сибур»

После того, как все разногласия в команде улажены, нужно изучить рынок и пользователя. Руководитель продукта «Avito Работа» Анна Ошарова советует проводить опросы, фокус-группы и показывать потенциальным пользователям прототипы макетов.

Главная задача дизайна — сделать так, чтобы пользователь удовлетворил потребность, ради которой он пришёл в сервис. Без UX можно понять воронку, понять, сколько пользователей справляются с задачей, но практически невозможно понять, почему не получается у тех, кто не справился.

В моей практике был случай, когда мы сделали отличный UI, всё учли, кроме одного — пользователь к нам попадал очень «холодный», и пока шёл по сценарию забывал, зачем пришёл. Этот инсайт невозможно получить количественно, только общение с пользователем, только хардкор.

Анна Ошарова
руководитель продукта «Avito Работа»

«Стартаперов, которые делали продукты на основе "своих влажных фантазий", мир слопал не один десяток или даже сотню», — рассуждает руководитель продукта в TalentTech Андрей Ежов. И выделяет три основных правила в разработке.

Убедитесь, что продукт решает реальные проблемы пользователей, а не придуманные вами.

Изучите, сколько стоит привлечение клиента и из каких каналов трафика оно будет наиболее эффективным.

Выясните, есть ли у рынка деньги на ваш продукт и какую долю он сможет занять. Для этого продайте его хотя бы нескольким клиентам: если речь про b2b, достаточно презентации MVP (продукта, обладающего минимальными, но достаточными для удовлетворения первых потребителей функциями — Redmadrobot), а в b2c можно собрать лиды с простого лендинга.

Андрей Ежов
руководитель продукта в TalentTech
Офис «Сбербанка»​

По мнению менеджера продукта в «Точке» Марии Поликарповой, когда рынок изучен и началась работа над продуктом, самое время определиться с методологиями разработки.

Без гибких методологий мы все умрём. Конкретные agile-процессы зависят от команды и задач, но из них must have — дизайн-спринты. Это уникальный и универсальный инструмент как для проверки гипотезы, так и для теста идеи, даже для выхода продукта из стагнации. А ещё это лучший тимбилдинг.

Мария Поликарпова
руководитель продукта в «Точке»

Владелец продукта в «Сбербанке» Ирина Жигалова добавляет: «Без дизайн-мышления и юзабилити-исследований нам сегодня точно не обойтись».

А Сергей Кутьков, арт-директор в Redmadrobot, выделяет среди инструментов must have: первичные и вторичные исследования, тестирование, CJM (инструмент для визуализации взаимодействия потребителя с продуктом) и мозговые штурмы.

Про тренды UX, UI и CX

По словам Игоря Громова, самый очевидный тренд последних двух-трёх лет — голос. В июне 2019 года количество пользователей голосовых помощников в США достигло 76 млн человек, а годом ранее их было в полтора раза меньше.

Второй тренд, который пока менее очевиден, чем голосовые помощники, — spatial web. На русском языке для этого явления, кажется, пока нет устойчивого выражения.

Но если сказать простым языком, spatial web — это перенос интерфейсов с экранов компьютеров и мобильных устройств на все окружающие нас предметы. Главная движущая сила перехода на эту технологию — технологии дополненной и виртуальной реальности.

Чуть меньшей силой на пути к новым интерфейсам обладает интернет вещей. В любом случае для получения привычной информации мы гораздо меньше станем обращаться к смартфонам и мониторам и больше станем смотреть в «умные» очки.

Забавно, что первопроходцами в этом направлении, скорее всего, станут промышленные компании, которые включились в процесс цифровизации сильно позже медиа и банков.

Игорь Громов
владелец продукта в «Сибур»

Про голосовое управление рассказывает и Сергей Кутьков: «Интеграция с голосовыми ассистентами повлечёт за собой появление продукта на новых типах устройств. Расширится область применения продукта и сценарии его использования». Арт-директор называет ещё три тренда, которые точно повлияют на дизайн продуктов в ближайшем будущем.

Доступность интерфейсов. Расширяя аудиторию продукта за счёт добавления в неё людей с ограниченными возможностями, важно переосмыслять интерфейс и взаимодействие с ним. Это приводит к упрощению сценариев использования продукта.

Обучающиеся алгоритмы рекомендаций. Продукт будет знать о пользователе его предпочтения и показывать только интересные предложения. Это будет выгодно и пользователям, и бизнесу, но потребует дополнительных усилий от разработчиков.

Персонализация. Появление тёмных тем — это начало пути к кастомизируемым интерфейсам. Продукт станет для пользователя чем-то личным и любые изменения привычных паттернов будут восприниматься крайне негативно. Затратнее и сложнее станет поддержка продукта, добавление в него новых функций.

Сергей Кутьков
арт-директор в Redmadrobot
Команда Redmadrobot на дизайн-марафоне​

О важности персонализации рассказывает и Анна Ошарова. По её словам, дизайн сегодня должен выполнять не только эстетическую функцию, но и расширять возможности продукта.

Если несколько лет назад почти все сервисы можно было разделить на красивые и функциональные, сейчас внешний вид и возможности платформы работают вместе. Это важный тренд: если вы очень полезные, но при этом не «стильные», к вам просто не придёт новое поколение.

Ещё обороты набирает персонализация. Пользователи, даже возрастные, уже привыкли к тому, что сервис должен предсказывать их следующий шаг и понимать запрос с пары даже «кривых» слов. Сервисы, которые это не умеют, начинают вызывать раздражение. Дизайнер сегодня должен всё это одновременно учитывать — художник и инженер в одном лице.

Анна Ошарова
руководитель продукта в «Avito Работа»

Важность персонализации отмечает и Ирина Жигалова: «"Умная" адаптация интерфейсов под пользователей помогает приложениям становиться частью жизни клиента». Также по словам менеджера, популярность набирают технологии в области биометрии.

Рынок Китая вышел на лидирующие позиции в технологиях биометрии. Дальше рост сфер применения биометрии будет развиваться как в онлайне, так и в офлайне, помогая клиентам упростить выполнение повседневных задач: прохода на работу или посадки на рейс в аэропорту без документов и пропусков. В России господдержка способствует развитию биометрии, и в 2020 году мы увидим результаты.

Ирина Жигалова
владелец продукта в «Сбербанке»

«Чем проще, тем лучше», — отвечает Андрей Ежов на вопрос про тренды. По его словам, чем меньше сделано кликов и затрачено времени на действие, тем быстрее пользователь достигнет желаемого результата с помощью сервиса.

В 2019 году уже профицит приложений и сайтов, поэтому пользователи выбирают по принципу «лень — двигатель прогресса». Чем проще сервис — тем лучше, именно поэтому так популярны приложения заказа такси (закажи с помощью одной кнопки) или покупки билетов (все авиакомпании в одном месте).

А ещё большую популярность набирает качественный копирайтинг. Сейчас очень не хватает людей, которые «описывают» элементы и блоки интерфейсов на простом и понятном языке, для абсолютно разных сегментов аудитории.

Андрей Ежов
руководитель продукта в TalentTech

Про тренд на упрощение рассказывает и Мария Поликарпова. По её словам особенно ярко он проявляется в интерфейсе мобильных операционных систем.

Во-первых, даже недорогие смартфоны теперь большие и мощные, и это наконец-то влияет на навигацию. Контролы уходят вниз, а верхняя часть дисплея остаётся для просмотра (смотри Samsung’s One UI).

В будущем должно поменяться и управление жестами, логично, что произойдёт развитие бесконтактных жестов. В основном это эволюция удобства, но для людей с ограниченными возможностями (и для разных ситуаций вроде управления автомобилем) — это критическое изменение.

Во-вторых, 5G повсеместно становится новой нормой. Анимации, микровзаимодействия, интерактивный контент, — всем этим не обязательно жертвовать в пользу скорости. Дизайнер может дать пользователю покрутить 3D-модель товара перед покупкой, а не просто посмотреть фото.

В-третьих, популярный IoT. Интернет вещей в ритейле может быть интереснее, чем управление роботом-пылесосом и, возможно, появится раньше, чем «умные» города. Проходя мимо магазина, можно получить персонализированную скидку на потенциально интересный товар и прокладывать AR-маршрут к нужной полке.

Ваш смартфон и 5G это выдержат, а edge computing (парадигма распределённых вычислений, которая используется для ускорения работы сервиса — Redmadrobot) даст безотказный сервис. Но это завтра, а сегодня можно начать хотя бы с того, чтобы выдать талончик электронной очереди прямиком на устройство при входе в банк.

Мария Поликарпова
руководитель продукта в «Точке»

Про самые полезные инструменты

Основные инструменты для менеджера продукта — те, что облегчают взаимодействие в команде. По словам Анны Ошаровой, к таким относится платформа для совместной работы Miro.

В Miro удобно совместно работать над продуктом, собирать продуктовую историю на разных фреймворках, а ещё их очень легко освоить — спасибо современным трендам. Если вы строите пользовательский CJM (карту пользовательских историй — Redmadrobot), проводите много качественных исследований, это просто незаменимый инструмент.

Если говорить не про физические инструменты, мы начали с командой регулярно проводить «встречи эмпатии». Это когда мы собираемся командой, приглашаем пользователей или исследователей, и вся команда получает информацию из первых рук. Это так круто, когда любой инженер в команде участвует в разработке решения и слышно что-то в стиле «да нет, нужно по-другому, ведь наши пользователи думают иначе».

Анна Ошарова
руководитель продукта «Avito Работа»

Игорь Громов из любимых инструментов называет Slack. По словам менеджера, мессенджер сильно помогает при работе с командой.

Это великолепное средство для выстраивания прозрачных процессов, как в небольших командах, так и в корпоративных империях. Сила Slack не в наличии хорошего десктопного клиента, а в понимании того, над чем работает команда и когда ожидать результата. Это возможно благодаря интеграциям с другими рабочими инструментами — той же Jira или Zeplin.

Игорь Громов
владелец продукта в «Сибур»
Команда «Сбербанка»​

Когда коммуникация в команде налажена и началась работа над продуктом, на помощь дизайнерам приходят графические редакторы. По словам Ирины Жигаловой, одно из главных качеств при выборе инструмента — универсальность.

В этом году перешли на Figma, которая становится сильной альтернативой Sketch. Очень быстро произошёл переход, инструмент удобен своей универсальностью, потому что в нём легко работать как дизайнеру и аналитику, другим участникам команды.

Ирина Жигалова
владелец продукта в «Сбербанк»

«Тут уже сложно удивить, перепробовано великое множество», — рассуждает Андрей Ежов. Из ежедневных помощников, он как и коллеги, называет Slack, Figma и Miro и добавляет в список «Google Документы». А Сергей Кутьков называет ко всему прочему Notion, Reminders и «Google Таблицы».

Примеры для подражания

По словам менеджера продукта в «2ГИС» Антона Спиридонова, направление развития технологий чаще всего задают крупные компании, но самые интересные идеи исходят от стартапов.

Глотать свежий воздух стоит, посматривая на маленьких, дерзких и смелых. Хотя, например, Microsoft с Windows Phone в своё время сильно и приятно удивила, но это было давно, а с тех пор такого не припоминаю.

Но Google, Apple или Microsoft имеют возможность задавать моду даже в ситуации, когда не предлагают по-настоящему новых и классных решений. Рынок приложений всё равно пойдёт по их следу, потому что ими формируются привычки и ожидания аудитории.

Антон Спиридонов
руководитель продукта в «2ГИС»

Анна Ошарова из крупных зарубежных компаний выделяет Instagram и Facebook. А среди российских игроков, по её словам, ярче всего выделяется банк «Тинькофф».

Эти компании научились перестраиваться под пользователей и сочетают в себе как запоминающийся дизайн, так и функциональность. Постоянно добавляют новые фичи, например — «Истории», «саджесты» (продолжение текущего запроса — Redmadrobot), контекстные оплаты. У них получается делать это очень органично, не усложняя пользовательский опыт.

Анна Ошарова
руководитель продукта «Avito Работа»

Игорь Громов рассказывает про положительный опыт взаимодействия со «Сбербанк Онлайн» и мобильным приложением магазина «Ашан». По его словам, эти сервисы упрощают покупки и помогают экономить время.

Недавно я установил мобильное приложение в магазине «Ашан», и с его помощью вышел из торгового зала с чеком примерно за 5 минут. Так я избежал привычных 10–15 минут стояния на кассе, которые всегда прибавляются к набору товаров в корзину. Или вот банкомат «Сбербанка», сразу вывел мне на экране сумму, которую я регулярно снимаю для похода в бассейн. Мелочь, но невозможно не восхититься её удобством.

Игорь Громов
владелец продукта в «Сибур»

«Не обязательно следить за влиятельной компанией, чтобы находить классные решения», — рассуждает Мария Поликарпова. И добавляет: «Must красивый, у Minutiae крутая идея, у Spotify и Netflix гениально "отсутствует" дизайн, а в "Кухне на районе" классная анимация "транзишенов" карточек на iOS».

Назовите ваших кумиров в мире инструментов для создания продукта
Paint
Photoshop
Сейчас расскажу в комментах
Показать результаты
Переголосовать
Проголосовать

Материал опубликован пользователем.
Нажмите кнопку «Написать», чтобы поделиться мнением или рассказать о своём проекте.

Написать
{ "author_name": "Redmadrobot", "author_type": "self", "tags": ["ux","ui","redmadrobot","design","cx"], "comments": 14, "likes": 47, "favorites": 250, "is_advertisement": false, "subsite_label": "marketing", "id": 95900, "is_wide": true, "is_ugc": true, "date": "Fri, 06 Dec 2019 13:26:45 +0300", "is_special": false }
0
{ "id": 95900, "author_id": 337772, "diff_limit": 1000, "urls": {"diff":"\/comments\/95900\/get","add":"\/comments\/95900\/add","edit":"\/comments\/edit","remove":"\/admin\/comments\/remove","pin":"\/admin\/comments\/pin","get4edit":"\/comments\/get4edit","complain":"\/comments\/complain","load_more":"\/comments\/loading\/95900"}, "attach_limit": 2, "max_comment_text_length": 5000, "subsite_id": 199113, "last_count_and_date": null }
14 комментариев
Популярные
По порядку
Написать комментарий...
41

Есть ощущение разнящегося "ожидания" и "реальности". Заголовок формирует ожидание про инструменты (Figma, XD, Principle и пр.), опрос внизу статьи это подтверждает, а сама статья о подходах к разработке от продактов.

Интересно было бы почитать истории аля "Мы в *Companyname* делаем прототип в sketch, анимируем в Principle и с этим добром идем к клиенту. Презентация проходит круто, у клиента создается впечатление уже работающего продукта, он в восторге от интерактива. Далее мы передаем макеты на верстку через Zeppelin/Avocode. Собираем кейс для портфолио, перегоняем анимированный интерфейс в Cinema 4D, любим использовать такие-то сцены, есть такие-то крутые заготовки, все это рендерим, постобработка в Premier, накладываем звуки из этих библиотек и в итоге получается такая вот красота *пример*. 

Возможно, благодаря такой статье, дизайнеры смогли бы найти интересные решения и иснтрументарий для упрощения и улучшения своих работ.

Ответить
4

Согласен, именно такого я и ожидал в статье из-за заголовка. Ожидания и реальность не совпали, к сожалению :(

Ответить
0

Понял-принял!

Ответить
2

Спасибо! Попробуем сделать 💜🖤

Ответить
2

Согласен насчет ожиданий. Когда пишут "не Sketch едины для UX/UI/.." при том на фото ребята смотрят на листки на полу думаешь "интересно, зачем они они распечатали макеты? наверное они что-то знают". В итоге мы понимаем, что инструмента-замены для Sketch не было и они не на макеты после печати смотрят, увы.

Ответить
0

Всё узнаем и сделаем материал :-) 

Ответить
0

скетч — это приложение, которое не даёт мне продать пожилой макбук, когда очень хочется это сделать :(
*мимо разработчик*

Ответить
1

Я правильно понимаю, что вы разработчик, которому присылают макеты в Скетче для верстки? Если так, то вы можете поросить дизайнера экспортнуть макет в Zeplin (2 клика).
А сами можете пользоваться приложением под виндой или в вебе. 

https://support.zeplin.io/en/articles/244698-downloading-mac-and-windows-apps

Ответить
0

Макбук я бы не стал продавать при любом раскладе. Даже через 15 лет будет рабочим девайсом

Ответить
0

В 2020 году разработчики скетча планируют добавить в облако возможность получать данные с макетов примерно как в zeplin, может быть, это для вас полезная информация. Вот тут есть видео с демонстрацией: https://blog.sketchapp.com/whats-next-for-sketch-in-2020-fbac2317e7b4

Ответить
0

Сбер уже сумму прогнозирует, а ВТБ до сих пор не запомнит что я нал снимаю, и приходится перелистывать экран...

Ответить
0

Однозначно Figma или XD , и тому подобные инструменты лучше всего) 

Ответить
0

Ну расскажи, чем тебе скетч не угодил))

Ответить
0

Все просто; Ничем. Уверен он во всех отношениях прекрасен. Просто, к чему привык и руку набил - тем и пользуюсь. Есть есть весомые причины его сильного превосходства над оными, я буду рад выслушать и планировать план миграции на светлую сторону. 

Ответить
{ "page_type": "article" }

Прямой эфир

[ { "id": 1, "label": "100%×150_Branding_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox_method": "createAdaptive", "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfl" } } }, { "id": 2, "label": "1200х400", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfn" } } }, { "id": 3, "label": "240х200 _ТГБ_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fizc" } } }, { "id": 4, "label": "Article Branding", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "p1": "cfovx", "p2": "glug" } } }, { "id": 5, "label": "300x500_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfk" } } }, { "id": 6, "label": "1180х250_Interpool_баннер над комментариями_Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "ffyh" } } }, { "id": 7, "label": "Article Footer 100%_desktop_mobile", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjxb" } } }, { "id": 8, "label": "Fullscreen Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjoh" } } }, { "id": 9, "label": "Fullscreen Mobile", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjog" } } }, { "id": 10, "disable": true, "label": "Native Partner Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyb" } } }, { "id": 11, "disable": true, "label": "Native Partner Mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyc" } } }, { "id": 12, "label": "Кнопка в шапке", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "p1": "bscsh", "p2": "fdhx" } } }, { "id": 13, "label": "DM InPage Video PartnerCode", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox_method": "createAdaptive", "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "flvn" } } }, { "id": 14, "label": "Yandex context video banner", "provider": "yandex", "yandex": { "block_id": "VI-223676-0", "render_to": "inpage_VI-223676-0-1104503429", "adfox_url": "//ads.adfox.ru/228129/getCode?pp=h&ps=bugf&p2=fpjw&puid1=&puid2=&puid3=&puid4=&puid8=&puid9=&puid10=&puid21=&puid22=&puid31=&puid32=&puid33=&fmt=1&dl={REFERER}&pr=" } }, { "id": 15, "label": "Баннер в ленте на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byudx", "p2": "ftjf" } } }, { "id": 16, "label": "Кнопка в шапке мобайл", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byzqf", "p2": "ftwx" } } }, { "id": 17, "label": "Stratum Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvb" } } }, { "id": 18, "label": "Stratum Mobile", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvc" } } }, { "id": 19, "disable": true, "label": "Тизер на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "p1": "cbltd", "p2": "gazs" } } }, { "id": 20, "label": "Кнопка в сайдбаре", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "p1": "cgxmr", "p2": "gnwc" } } } ] { "page_type": "default" }