Московский: Дизайн & Тимлид

Матрица согласований

Fri, 14 Nov 2025 10:51:51 +0100

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

Типовая ситуация: дизайнер приносит макет, вокруг собираются разработчики, менеджеры, подруга жены босса — и каждый начинает накидывать. Дизайнер погружает новых людей в задачу и доказывает, что сценарий решается интерфейсом. Бонусом идут редкие сценарии, которые «нужно обязательно учесть».

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

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

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

Нашёл для себя триггер: если команде не хочется идти на эту встречу, потому что «сейчас накидают на вентилятор» — это сигнал, что проблема есть.

Выход — составить матрицу согласований

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

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

Как построить матрицу

Удобнее всего вести её в виде таблицы.

В ней фиксируются:

— Роль / должность;
— Заинтересованность — насколько человеку важна ваша работа и её результат (низкая, средняя или высокая);
— Мотивация — что человек получает от участия. Она может быть честная (результат), а может быть человеческая (самоутверждение, влияние);
— Насколько может повлиять? — от 1 до 5, где 1 — влияние минимально, а 5 — последнее слово;
— Текущий уровень доверия — низкий, нейтральный, средний, высокий. Есть ли напряжение в общении и затягивание согласования, или это «свой» человек;
— Заметки и риски — что важно помнить;
— Нужный уровень вовлечения по RACI — подробнее ниже.

Где тут наука

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

RACI-матрица помогает разделить роли:
Responsible — кто делает;
Accountable — кто принимает финальное решение;
Consulted — с кем консультируемся;
Informed — кого информируем.

Power—Interest Grid показывает, кого вовлекать глубже, а кого просто держать в курсе.
Salience Model учитывает влияние, легитимность и срочность требований.

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

Алгоритм по сборке

Выпишите всех, кто комментирует / блокирует / одобряет дизайн (продакт, тимлид фронта, бэкенд, аналитик, редактор, исследователь, саппорт-лид, маркетинг и т. д.). Посмотрите орг-схему или историю согласований.
Расставьте оценки по критериям: заинтересованность, мотивация, влияние и т. п. В файле в Фигме есть подсказки, чтобы делать это проще.
По итогам оценок определите роль каждого участника по RACI.
Сократите круг влияющих: оставьте ключевых A, остальным — C или I.

Для каждого участника нужен свой подход:

R — отвечает за выполнение (обычно дизайнер или тимлид).
A — участвует в согласовании с самого начала, ранние черновики, мини-синки, финальный апрув.
C — короткое информирование, ранний показ черновиков (например, для оценки реализуемости).
I — короткое информирование, регулярные демо.

Шаблон матрицы

Что это даёт?

Матрица согласований экономит время на синках и помогает понять, насколько сильна связка дизайнер + продакт.
Если человек имеет сильное влияние и при этом низкий уровень доверия — это сигнал, что нужно работать над коммуникацией.

Матрица также повышает эффективность: решения перестают «обстукивать» обо всех. Ответственность становится конкретной, а не размытой по всей команде.

Короч

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

Полезные ссылки

RACI-матрица:
Atlassian про RACI

Power—Interest Grid:
http://www.projectmanagement.com/wikis/368897/stakeholder-analysis--using-the-power-interest-grid

Salience Model:
https://projectmanagers.net/understanding-the-stakeholder-salience-model/

Интервью с победителем дизайн-конкурса Telegram: карьера в дизайне, профессиональный рост и путешествия

Sat, 22 Jun 2024 22:11:47 +0100

Поговорил с Кирилл Сидорец — победителем дизайн-конкурса Telegram про его карьеру, как он интересно и не стандартно начинал, где путешествовал и как работалось в МТС и VK, а теперь в The Open Platform

Подборка видео про презентации

Sun, 12 Nov 2023 19:10:45 +0100

Всем привет! Для презентации своих идей я использую Фигму. Это видео будет всем, кому нужно сделать презентацию.

В ходе урока мы сделаем 4 базовых слайда. Вы можете посмотреть по ссылке шаблон презентации и взять то, что вы хотите использовать. https://www.figma.com/community/file/1290426330962568110/presentation-template

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

Веб-инспектор для дизайнеров. Как быстро сделать дизайн в коде

Sat, 02 Sep 2023 11:01:42 +0100

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

8 частых ошибок дизайнеров в тестовом задании

Thu, 27 Jan 2022 10:38:19 +0100

Привет, рассказал какие видел самые частые ошибки продуктовых дизайнеров в тестовых работах. Если вы дизайнер, делаете тестовое задание и задаетесь вопросом «как сделать тестовое задание?», то вам будет полезно узнать на что я обратил внимание, проверив много дизайнерских тестовых заданий.

Копировать и вставить — обновление Figma. Быстрый разбор новых возможностей

Sun, 10 Oct 2021 20:01:57 +0100

В этом видео я собрал самые важные изменение Фигмы при обновлении функции copy/paste: позиционирование вставляемого элемента, мульти-вставка, paste here, вставка с заменой, вставка в зону видимости. Во второй части рассказываю как копировать стили в figma, как скопировать «as PNG» и как SVG.

Горячие клавиши в Фигме, которые я использую: как запомнить и как работать быстро (Figma Hotkeys)

Wed, 21 Jul 2021 21:30:12 +0100

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

Исходник с презентацией

Figma: Интерактивные компоненты (бета)

Sat, 27 Mar 2021 21:45:25 +0100

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

Ненужные функции

Tue, 05 Jan 2021 11:15:17 +0100

В админке CRM wordpress есть выбор первого дня недели.

Первый день недели может быть либо воскресение, либо понедельник, других вариантов я не знаю. Но в вордпрессе решили дать все дни на выбор. Представляю разговор разработчиков:
— А зачем нам ограничивать пользователя, вдруг кто-то захочет начинать неделю со среды. Давайте дадим эту возможность! Тем более это нам ничего не стоит, а пользователи оценят!

Так вот, большинство пользователей работают с настройками по умолчанию. С какого дня начинать неделю машина должна определять сама, в зависимости от региона использования. Чем больше интерфейс перекладывает на пользователя, тем менее он кажется понятным и удобным. Не делайте так.

Выступления в финале на хакатоне от вконтакте

Tue, 29 Sep 2020 20:46:07 +0100

Участвовал в двухнедельном хакатоне от вконтакте. Наша команда заняла 6 место из 600+ команд. Для финала за сутки нужно было продумать и презентовать случайную и смешную тему. У нас было приложение с дополненной реальностью для занятий спортом диснеевских принцесс. Было весело делать и выступать.

Из полезного: можно посмотреть или скопировать презентацию в фигме (для просмотра нажмите плей)

Figma: работа с компонентами на реальном примере

Sun, 30 Aug 2020 19:53:56 +0100

В новом видео показываю на примере как удобно можно работать через компоненты

Вопросы пишите на ютубе

Дизайн мобильных приложений. Летний интенсив в Британке

Sun, 21 Jun 2020 14:33:25 +0100

После обучения в Бюро Горбунова я хотел попасть на обучение в Британку. Это случилось на летнем интенсиве 2019. Расскажу про свой опыт и проект, который мы там делали.

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

В ходе обучение было весело, было сложно и было сжато. На что уходит месяц, нужно было сделать за 4 дня и применять новые знания, которые параллельно нам рассказывались.

На лекциях было много информации от разных спикеров.

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

Наша презентация не обошлась без юмора

Наш концепт Яндекс Почты

Один из слайдов из презентации

Мое мнение: на интенсив я пошел уже имея за плечами почти год работы в Яндексе. Там еще раз прошелся по знакомым темам и структурировал знания. Узнал, что-то новое, но многое уже знал. Плюс прокачал навык презентации. Новичкам советую. Ссылка на интенсивы

Как дизайнеру перестать думать статически

Sun, 21 Jun 2020 13:28:47 +0100

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

Образно, как я думал над макетом

На стажировке в Яндексе столкнулся со сложными взаимодействиями, но делал по-старинке: рисовал картинку, смотрел на неё, смотрел на отступы, как будет удобно расположить кнопки, что еще можно подвигать.

Потом, приносил этот макет на обсуждение команде опытных дизайнеров. Получал список замечаний в духе: а что будет если нажать на эту кнопку, а что будет если данных не будет или не загрузятся. Как будет после нажатия на меню — для меня была загадка;

Мой наставник по стажировке дал мне совет, в духе «начни представлять как будет работать интерфейс, что будет в динамике». Полностью прочувствовал этот совет совсем недавно :-)

Теперь для меня интерфейс — это история, которая движется во времени. Я прокручиваю в голове идеальный путь пользователя, как покадровая анимация. Затем ищу затыки, редкие кейсы, которые могут произойти у пользователя.

Проектируется не страница, а история

Для меня следующий этап, это продумывание анимации и микровзаимодействия, которая помогает связать экраны между собой и приносит удовольствие от использования. Буду рад советам, что почитать или посмотреть на эту тему?

Выводы: для проектирования интерфейсов представляйте как ваш интерфейс работает, как вы с ним взаимодействуете, прокрутите сценарий в голове от начала до конца. Все ли было окей? Где логика хромает? Если сложно представить, то поможет быстрый прототип в фигме, который можно дать «потыкать» кому-то ещё.

Проект Здоровье

Mon, 08 Jun 2020 08:51:26 +0100

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

Посмотреть приложение можно внутри приложения Яндекс.

Иконка настроек в фигме

Sat, 16 May 2020 21:23:42 +0100

Записал видео про то, как нарисовать иконку настроек в фигме

Дизайн счетчика баллов в репетиторе

Sat, 29 Feb 2020 23:06:25 +0100

Какое-то время назад я помогал сервису Яндекс Репетитор повысить вовлеченность учеников. Для этого команда предложила сделать счетчик баллов. В итоге появился блок с баллами, блок и раздел с достижениями ученика.

При выполнении задания счетчик растет, можно перейти в достижения и посмотреть свою статистику

При наведении на каждый из предметов можно увидеть статистику по предмету: сколько баллов за сегодня и вклад за неделю

При достижении определенных значений — выдается награда с анимацией

Вопросы для страницы при проектировании дизайна

Thu, 23 Jan 2020 09:07:20 +0100

— Постоянно забываю нарисовать какую-то фигню для разработчиков, а они меня потом достают ?
— Держи чек-лист!

Перед сдачей дизайна сайта или приложения нужно пробежаться по списку. Я частенько не задумываюсь, все ли доделал. А потом разработчик отрывает от работы и просит доделать. Чтобы такого не было, внизу чек-лист:

Чек-лист для дизайнера перед сдачей макетов

Состояние выделения у всех элементов, на которые можно нажать: кнопок, ячеек таблицы, инпуты.
Пустые экраны: когда пользователь первый раз зайдет, когда у него ничего не будет, когда он все удалит, если нет аватарки.
Что будет показываться, когда у пользователя медленный интернет: скелетон, картинка мелким размером, которая при дозагрузке станет четкой.
Проверить текст на реальных данных. Что будет если текст не влезет, что если будет на других языках.
Состояния ошибок, уведомления о действиях, алерты, попапы, 404 ошибка и т. д.
Ну и само собой, если нарисовали веб-версию, не забываем про тачи и про ширину 320 px.
Подробно об этом рассказывали в этом видео.

Чек-лист для проверки решения

А еще я для себя составляю чек-лист для этапа проверки своего решения, у кого есть идеи пишите в комментарии

Кто наши пользователи?
Какой основной сценарий выполняет пользователь на этом экране?
Как человек поймет, что это за интерфейс, будет ли обучение? Как разберется в нашем продукте?
Что главное должен считывать пользователь на этом экране?
Что не главное на этом экране?
Что если пользователь не готов выполнить наше действие или хочет отказаться?
Что если пользователя отвлекли? Он вспомнит что он делает на этом экране?
Как этот экран помогает пользователю выполнить его основной сценарий?
Какой будет не основной сценарий? А какой сценарий еще возможен?
Если есть цвета — как они помогают пользователю решить его задачу?

Нужны ли полоски внутри таблицы

Wed, 20 Nov 2019 14:54:12 +0100

Решил разобраться как лучше сделать с полосками или нет.

Сперва смотрю на сайте бюро: нашел статью про черезполосицу, они предлагают её убирать. А вот мнение Ильи Бирмана насчет линий. И у него же отличный пример таблицы без полосок:

http://biathlontime.com/2018-2019/cup/women/nations/

Нужно взглянуть на примеры других сервисов:

В моем случае решил выбрать 1 вариант:

Пример с работы: между строчек есть или нет разделительной линии (шапку замазал, чтобы ни кто не догадался)

Для себя нашел такие зависимости:

Если в таблице 2-3 значения цифр то можно обойтись и без полосок: смотрится вполне хорошо.
Когда много цифр и они находятся на непредсказуемом расстоянии друг от друга, по всей длине экрана — то полоски лучше использовать.
Черезполосицу просто так использовать не стоит, но в анализе финансовых показателей этот приём может обозначать рост и падение акций.
Если делать полоски, то делать их незаметными, серенькими.

Как оценивать UX дизайн бесплатно и без исследований

Sun, 03 Nov 2019 22:00:33 +0100

Предположим у нас есть 2 варианта пути пользователя. Как определить, что один из них лучше другого? В моем примере ниже — это очевидно: чем меньше экранов, тем лучше.

Два варианта сценария покупки

Но, что делать если количество экранов равно? Когда я столкнулся с такой задачей, то начал считать количество действий пользователя. Например, тут нужно: навести на кнопку «купить», нажать на кнопку, на другом экране прочитать заголовок, навести на кнопку добавить в корзину и т. д. Когда все действия расписаны, легко заметить, где нужно совершить меньше движений.

Метод GOMS

Более продвинутую методику я услышал от одного из спикеров на Media & Design Conference. Они так же считают количество действий пользователя, но еще переводят действия в секунды и оценивают финально сколько пользователь тратит времени на каждый экран. Самое интересное — расчеты времени пользователя.

K = 0,28 c — нажатие клавиши клавиатуры;
B = 0,2 с — клик мышью;
P = 1,1 с — среднее время нахождения любого объекта на сайте;
H = 0,4 с — перемещения руки с клавиатуры на мышь (или обратно);
M = 1,35 с — ментальная пауза (время на обдумывание следующего шага).

Почему то запись этого доклада пропала, но я для себя наскриншотил самое важное:

С помощью этого способа можно доказать удобство одного из вариантов, но этот метод имеет свои исключения: например огромную форму для заполнения лучше разбить на несколько экранов.

Как проводить UX исследования

Mon, 26 Aug 2019 10:22:13 +0100

Недавно я был на интенсиве в Британке. Необходимость проведения исследований над продуктом подчеркивал каждый лектор. И это правильно: наша модель мира, модель мира нашей команды может сильно отличаться от реальных пользователей. Материал интенсива и знания из опыта я попробую описать в этой статье.

Твой мир может сильно отличаться от мировоззрения других

Необходимо замерять показатели эффективности.

Когда я открыл магазин матрасов, было мало конкурентов. Покупатели находили пару сайтов, выбирали и шли ко мне. Покупатели были, прибыль была → магазин рос. Но все изменилось через пару лет. Когда конкурентов стало много → клиенты стали реже приходить. Как понять где причина, что стало меньше покупателей? Я стал измерять показатели: сколько людей заходят на сайт, сколько времени они тратят, сколько из них звонят, приходят в магазин и создают заказ.

Воронка продаж в моем представлении

Горькая правда: Даже 1 шаг, который людям придется сделать, чтобы воспользоваться вашим продуктом, может стоить вам бизнеса.

Пример про такси: таксисты 90% времени простаивали. В то время как клиенты искали их на остановках, звонили по телефону диспетчеру. Диспетчер искала водителей по рации. Водители соревновались у кого лучше рация и реакция. Когда появилось приложение для водителей, водители видели где клиент, а клиентам не нужно звонить диспетчерам. Все в выигрыше!

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

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

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

Я часто искал подтверждение своего решения

Исследования помогают:

— найти проблемы интерфейса;
— выявить и описать потребности пользователей;
— правильно сформулировать бизнес-требования;
— проверить эргономику решения.

Качественное или количественное исследование

Количественные — проверка решения на большом количестве респондентов. Например, сравнить два варианта дизайна и выбрать лучший. В этом помогает Яндекс Толока. Там много пользователей за копеечку сравнивают картинки. Для заказчиков — это возможность сравнить дизайн, опросить пользователей. Когда из 100 опрошенных, 70 выбирают вариант, который тебе казался хуже, это удивляет.

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

Виды качественных исследований:
— Интервью: узнаем боли и потребности
— Юзабилити-тестирование: замеряем удобство
— Карточная сортировка: говорим о структуре
— Наблюдение: изучаем контекст
— Опрос: узнаем мнение.
— Соц сети/звонки/поддержка: читаем обратную связь.

При проведении интервью следим, чтобы:

— у нас были открытые вопросы,
— мы молчим и слушаем, больше говорит респондент,
— не задаем вопросы с вариантами ответа,
— не поддакиваем пользователю, не говорим: «да нажимайте сюда...»
— не используем профессиональный лексикон,
— придерживаемся плана интервью, тратим не более 45 мин,
— исследовать опыт пользователя, без вопросов (а если бы... вы купили?),

Пользователи врут

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

Большая картинка

Большая часть материалов составлена на основе лекции Алины Ермаковой. А вот её курс.

Мой телеграмм канал
P.S: волшебные фразы при тестировании: «мы тестируем интерфейс, а не вас. Тут нет неправильных ответов или правильных», «А как вам кажется, что это?»,