Закончил МИФИ по инфобезу, аналитике
и СУБД с факультативом по менеджменту
бизнес-процессов
Пробовал в бизнес-аналитику
А потом прокачался в продуктовом подходе, UX-райтинге, граф. дизайне, UX/UI, анимациях и нейросетях
и СУБД с факультативом по менеджменту
бизнес-процессов
Пробовал в бизнес-аналитику
А потом прокачался в продуктовом подходе, UX-райтинге, граф. дизайне, UX/UI, анимациях и нейросетях
Product Designer с 6-летним уникальным опытом, который объединяет экспертизы в B2B, FinTech и e-com
✦ Аналитика финансовых данных
и бизнес-процессов (МИФИ, Кибербез)
✦ Исследования (UX-лаборатория ФНС)
✦ Data-driven подход, бизнес-метрики, исследования, анализ юзабилити (агентство)
✦ Гибкость, предприимчивость и логика
(от фриланса до проектирования с нуля сложных продуктов)
✦ Системный продуктовый дизайн
для сложных интерфейсов: дэшбордов, ЛК, таблиц (Альфа-Банк и SOLAR)
✦ Аналитика финансовых данных
и бизнес-процессов (МИФИ, Кибербез)
✦ Исследования (UX-лаборатория ФНС)
✦ Data-driven подход, бизнес-метрики, исследования, анализ юзабилити (агентство)
✦ Гибкость, предприимчивость и логика
(от фриланса до проектирования с нуля сложных продуктов)
✦ Системный продуктовый дизайн
для сложных интерфейсов: дэшбордов, ЛК, таблиц (Альфа-Банк и SOLAR)
[00]
ОБО МНЕ
Закончил МИФИ по инфобезу
и аналитике с факультативом
по менеджменту бизнес-процессов
Пробовал в бизнес-аналитику
А потом прокачался в продуктовом подходе, граф. дизайне и UX/UI
и аналитике с факультативом
по менеджменту бизнес-процессов
Пробовал в бизнес-аналитику
А потом прокачался в продуктовом подходе, граф. дизайне и UX/UI
Вижу продукт целостно: от бизнес-целей и данных до визуала и юзабилити. Быстро вникаю в сложные предметные области. Есть опыт эффективного взаимодействия как с топ-менеджментом, так и с пользователями и другими участниками команды (разработчики, маркетинг, редакция)
Широкий набор скиллов для воплощения идей бизнеса, работы в команде
и дизайна качественных продуктов
и дизайна качественных продуктов
Product Designer с 6-летним уникальным опытом,
который объединяет экспертизы в B2B, FinTech
и e-com:
✦ Аналитика финансовых данных и бизнес-процессов (МИФИ, Кибербез)
✦ Исследования (UX-лаборатория ФНС)
✦ Data-driven подход, бизнес-метрики, исследования, анализ юзабилити (агентство)
✦ Гибкость и предпринимательский склад
(от фриланса до проектирования с нуля сложных продуктов)
✦ Системный продуктовый дизайн для сложных интерфейсов (дэшборды, ЛК, таблицы) в Альфа-Банке и SOLAR
который объединяет экспертизы в B2B, FinTech
и e-com:
✦ Аналитика финансовых данных и бизнес-процессов (МИФИ, Кибербез)
✦ Исследования (UX-лаборатория ФНС)
✦ Data-driven подход, бизнес-метрики, исследования, анализ юзабилити (агентство)
✦ Гибкость и предпринимательский склад
(от фриланса до проектирования с нуля сложных продуктов)
✦ Системный продуктовый дизайн для сложных интерфейсов (дэшборды, ЛК, таблицы) в Альфа-Банке и SOLAR
Product Designer с 6-летним уникальным опытом, который объединяет экспертизы в B2B, FinTech и e-com
и комплексный взгляд на задачи от визуала до метрик
✦ Аналитика финансовых данных и бизнес-процессов (МИФИ, Кибербез)
✦ Исследования (UX-лаборатория ФНС)
✦ Data-driven подход, бизнес-метрики, исследования, анализ юзабилити и большая насмотренность (агентство)
✦ Решение нестандартных задач на основе логики, гибкости и коммуникабельности (от фриланса
до проектирования с нуля сложных продуктов)
✦ Системный продуктовый дизайн для сложных флоу
и интерфейсов: дэшбордов, ЛК, таблиц
(Альфа-Банк и SOLAR)
и комплексный взгляд на задачи от визуала до метрик
✦ Аналитика финансовых данных и бизнес-процессов (МИФИ, Кибербез)
✦ Исследования (UX-лаборатория ФНС)
✦ Data-driven подход, бизнес-метрики, исследования, анализ юзабилити и большая насмотренность (агентство)
✦ Решение нестандартных задач на основе логики, гибкости и коммуникабельности (от фриланса
до проектирования с нуля сложных продуктов)
✦ Системный продуктовый дизайн для сложных флоу
и интерфейсов: дэшбордов, ЛК, таблиц
(Альфа-Банк и SOLAR)
заголовок
There is no design without discipline. There is no discipline without intelligence.
шаги процесса
Продукт для систематизации и аналитики с возможностью создавать схемы
заголовок
инструменты
REVIEW №2
The Bauhaus movement had a profound influence upon subsequent developments in art, architecture, graphic design, interior design, industrial design, and typography.
[01]
ДЕМО СКИЛЛОВ
There is no design without discipline. There is no discipline without intelligence.
заголовок
заголовок
There is no design without discipline. There is no discipline without intelligence.
шаги процесса
Продукт для систематизации и аналитики с возможностью создавать схемы
заголовок
инструменты
REVIEW №2
The Bauhaus movement had a profound influence upon subsequent developments in art, architecture, graphic design, interior design, industrial design, and typography.
[02]
FIGMA
There is no design without discipline. There is no discipline without intelligence.
заголовок
ЗАДАЧА
✦ Слева: пример работы с иконками в 1 из 2 созданных стилистически абсолютно разных наборах иконок
✦ Сверху: пример передачи макетов
в разработку в виде User Flow
для улучшения восприятия
в разработку в виде User Flow
для улучшения восприятия
✦ Сверху: пример передачи макетов
в разработку в виде User Flow
для улучшения восприятия
в разработку в виде User Flow
для улучшения восприятия
✦ Сверху: пример передачи макетов в разработку в виде User Flow для улучшения восприятия
Ключевая ценность
Реализация настроек в момент подписания повышает сразу несколько ключевых метрик продукта:
✦ Повышает количество успешных завершений
✦ Способствует использованию клиентами различных способов
✦ Конкурентное преимущество по дизайну и юзабилити
✦ Повышает количество успешных завершений
✦ Способствует использованию клиентами различных способов
✦ Конкурентное преимущество по дизайну и юзабилити
PRODUCT OWNER
Титаническая работа. Выглядит хорошо, мне нравится. Спасибо, Миша!
PRODUCT OWNER
Титаническая работа! Выглядит хорошо, мне нравится. Спасибо, Миша!
Ключевая ценность
Реализация настроек в момент подписания повышает сразу несколько ключевых метрик продукта:
✦ Повышает количество успешных завершений
✦ Способствует использованию клиентами различных способов
✦ Конкурентное преимущество по дизайну и юзабилити
✦ Повышает количество успешных завершений
✦ Способствует использованию клиентами различных способов
✦ Конкурентное преимущество по дизайну и юзабилити
Челлендж
Формирование модалки – технически сложный процесс. Для достижения поставленной цели сделать модалку компактной, формулировки и композиция были тщательно проработаны с учётом технических, законодательных
и этических нюансов. Полный флоу описывают 200 экранов
Параллельно создавалось две концепции чтобы сейчас освежить и улучшить, а в будущем все проблемы полностью ещё лучшим дизайном
и этических нюансов. Полный флоу описывают 200 экранов
Параллельно создавалось две концепции чтобы сейчас освежить и улучшить, а в будущем все проблемы полностью ещё лучшим дизайном
Челлендж
Формирование модалки – технически сложный процесс. Для достижения поставленной цели сделать модалку компактной, формулировки и композиция были тщательно проработаны с учётом технических, законодательных
и этических нюансов. Полный флоу описывают 200 экранов
Параллельно создавалось две концепции чтобы сейчас освежить и улучшить, а в будущем все проблемы полностью ещё лучшим дизайном
и этических нюансов. Полный флоу описывают 200 экранов
Параллельно создавалось две концепции чтобы сейчас освежить и улучшить, а в будущем все проблемы полностью ещё лучшим дизайном
[03]
шаги процесса
шаги процесса
шаги процесса
инструменты
инструменты
ТОТАЛЬНЫЙ РЕДИЗАЙН ТОЧКИ КОНТАКТА
Задача
Сделать яркую и необычную модалку выбора способа подписания
Задачу разделили на две части:
Первый редизайн должен был затрагивать только вёрстку, без масштабных доработок на фронте
Второй – воплотить все лучшие наработки и фидбэк клиентов
Задачу разделили на две части:
Первый редизайн должен был затрагивать только вёрстку, без масштабных доработок на фронте
Второй – воплотить все лучшие наработки и фидбэк клиентов
Задача
Сделать яркую и необычную модалку выбора способа подписания
Задачу разделили на две части:
Первый редизайн должен был затрагивать только вёрстку, без масштабных доработок на фронте
Второй – воплотить все лучшие наработки и фидбэк клиентов
Задачу разделили на две части:
Первый редизайн должен был затрагивать только вёрстку, без масштабных доработок на фронте
Второй – воплотить все лучшие наработки и фидбэк клиентов
[03]
шаги процесса
инструменты
✦ Спроектировал унифицированный паттерн просмотра дэшбордов
✦ Провёл и обработал 14 глубинных интервью за месяц работы
✦ 5 KILLER FEATURE с подтвержденной полезностью и возможностью технической реализации
✦ Провёл и обработал 14 глубинных интервью за месяц работы
✦ 5 KILLER FEATURE с подтвержденной полезностью и возможностью технической реализации
Достижения
Челлендж
Требовалось исправить негативное восприятие продукта целевой аудиторией. Цель удалось достичь
DESIGN LEAD
Это огонь! Красиво и удобно. Крышесносная работа
АНАЛИТИЧЕСКИЙ ПРОДУКТ С КАРТАМИ
✦ В правом верхнем углу виджет с датой и временем, символизирующий Кремль или высотки
✦ Символ в центре означает ключевое действие продукта – создание предлложения (см. далее)
✦ Красивые московские закаты вдохновили на скринсейверы
Дизайн инструмента для аналитиков Департамента Транспорта Москвы
Хотелось сделать эмоциональный продукт, чтобы работалось с удовольствием. Чтобы люди не закапывались в данных и отчётах, а сохраняли фокус на том, что они делают для города предложения по улучшению – и это их ключевой полезный вклад в жизнь города
Позволяет фильтровать данные, загружать их, просматривать подробную информацию, редактировать, добавлять в папки, формировать отчёты
Есть горячие клавиши и жесты
Эффективный инструмент, на мой взгляд, тот, в котором удобнее и быстрее получать стабильно качественный результат, чем без него. Основной флоу выкристаллизовался такой:
Открывает карту
Выбирает место города, которое требует внимания в первую очередь
Собирает материалы
Формирует отчёт
Теперь подробнее о каждом этапе:
Хотелось сделать эмоциональный продукт, чтобы работалось с удовольствием. Чтобы люди не закапывались в данных и отчётах, а сохраняли фокус на том, что они делают для города предложения по улучшению – и это их ключевой полезный вклад в жизнь города
Позволяет фильтровать данные, загружать их, просматривать подробную информацию, редактировать, добавлять в папки, формировать отчёты
Есть горячие клавиши и жесты
Эффективный инструмент, на мой взгляд, тот, в котором удобнее и быстрее получать стабильно качественный результат, чем без него. Основной флоу выкристаллизовался такой:
Открывает карту
Выбирает место города, которое требует внимания в первую очередь
Собирает материалы
Формирует отчёт
Теперь подробнее о каждом этапе:
- Карта в первую очередь, т. к. главный объект работы – это город. Поэтому на карту надо приземлять все данные. Чтобы не потеряться на карте предусмотрены фильтры и бесшовный переход между картой и представлением в виде списка или карточек. Анимация подсвечивает соответствие сущности на карте и в списке (строки или карточки)
- Таким образом, есть две точки входа в процесс выбора: через карту и через список оповещений. Оповещения настраиваются через правила срабатывания опытным сотрудником, как в продуктах по информационной безопасности. Качество событий (срабатываний) оценивается в процессе работы и корректируется по необходимости. Чтобы выбрать приоритетный объект было проще, сортировка по умолчанию помещает на первое место в списке объект, который требует наибольшего внимания сотрудника на текущий момент. Есть возможность применить фильтр даты. Также, есть возможность сравнить два объекта, если нужно дать обоснованный ответ, к примеру, когда произошла ситуация, получившая резонанс в СМИ, и нужно понять, стоит ли туда направить ресурсы в первую очередь, или же это случайность и решать стоит в обычном порядке. Набор инструментов широк. Как продуманные стандартные фильтры (дата, район, тип объекта, критичность), сортировка, поиск с подсказками и историей. Так и специализированные: фильтр по области на карте, возможность добавления окрестностей выбранной области по радиусу удаления и фигурных (для кейсов: "в радиусе 5 км от Кремля не должно быть проблем", "в окрестностях парка Х не должно быть проблем")
- Сбор материалов максимально автоматизирован, чтобы сократить ручной труд, не требующий квалификации сотрудника. Т. к. инструмент экспертный, а также, потому что не все типы данных сразу возможно загружать автоматически, предусмотрена возможность ручного добавления данных. Тремя способами: ручное заполнение (на столе лежит газетная вырезка об инциденте или пост в соц.сетях), дрэг-энд-дроп и старый добрый "обзор". Добавленные материалы делятся на привязанные к карте и не привязанные по тем или иным причинам. В идеале, чтобы все были привязаны. Данные бывают разных типов, для которых предусмотрен удобный формат просмотра. Для видео сделан видеоплеер с возможностью делать скрины (потому что в отчёт нельзя прикрепить видос) и комментить (для того, чтобы коллеги, смотря архивы, могли быстрее понять, зачем это видео прикреплено к кейсу предложения улучшения для города). Для действий предусмотрены горячие клавиши и красивый интерфейс (чтобы удобно и красиво). Например, для включения/выключения громкости использую клавишу V, потому что на английском это Volume, а на русском Вкл/Выкл, поэтому легко запомнить (а не M - mute). Скриншот – S. Документы можно собирать в папки для последующего формирования предложений. На папках отражён статус. И да, есть красивые анимации и возможность открыть рядом список файлов и папку предложения и удобным жестом перетаскивания накидать нужные файлы.
- Формирование предложения (отчёта) – это специальный экран, который позволяет получать консистентные по качеству отчёты. Он содержит типовую структуру, кликабельное содержание для удобной навигации, лучшие практики в виде чек-листа предложения, которое с большей вероятностью будет принято курирующей организацией-исполнителем и другие функции. Этот флоу нацелен на быстрое создание качественных предложений, получающих одобрение на реализацию
Левый и правый углы активны и позволяют открыть два окна для удобства работы
Для открытия меню переместите курсор в угол. По UX-закону Фиттса, углы – наиболее лёгкие места наведения курсора на экранах
Повторное заведение в угол скрывает окно
В тёмной теме им на замену – другой яркий гость московского неба: северное сияние
Я считаю, что красота – это функция, которая позволяет удобному интерфейсу стать ещё лучше :)
Открытое окно можно перемещать влево-вправо для удобства работы с картой
ЖЕСТЫ
ЕЩЁ немного ЭКРАНОВ
КРАСОТА-А-А
✦ Красивые московские закаты вдохновили на скринсейверы
✦ Символ в центре означает ключевое действие продукта – создание предлложения (см. далее)
✦ В правом верхнем углу виджет с датой и временем, символизирующий Кремль или высотки
✦ Символ в центре означает ключевое действие продукта – создание предлложения (см. далее)
✦ В правом верхнем углу виджет с датой и временем, символизирующий Кремль или высотки
✦ Красивые московские закаты вдохновили на скринсейверы
✦ Символ в центре означает ключевое действие продукта – создание предлложения (см. далее)
✦ В правом верхнем углу виджет с датой и временем, символизирующий Кремль или высотки
✦ Красивые московские закаты вдохновили на скринсейверы
✦ Символ в центре означает ключевое действие продукта – создание предлложения (см. далее)
✦ В правом верхнем углу виджет с датой и временем, символизирующий Кремль или высотки
✦ Символ в центре означает ключевое действие продукта – создание предлложения (см. далее)
✦ В правом верхнем углу виджет с датой и временем, символизирующий Кремль или высотки
Кратко о работе
До / после:
Цели редизайна:
✦ Бизнес: улучшение значений ключевых метрик
✦ UI: отстройка от конкурентов
✦ UX: устранение болей
Ключевые метрики
✦ ↑ информированность пользователей о различных способах
✦ ↑ использование различных способов
✦ ↑ количество успешных завершений сценариев (конверсия)
✦ Вложенность ↓
✦ ↑ использование различных способов
✦ ↑ количество успешных завершений сценариев (конверсия)
✦ Вложенность ↓
UI: сделать скучное — интересным и необычным
✦ Абсолютно обычная и неинтересна модалка в начале
✦ Более смелые версии руководство мотивировало сделать ещё более смелыми
✦ Эскиз стал основой графической идеи
✦ Планшет и деск удалось сэкономить
✦ Мобилку так сделать было нельзя, сделал в таком же духе (своё было-стало, зелёная линия)
✦ Следующая версия – ещё более. Оригинальная, компактная, геймифицированная
✦ Более смелые версии руководство мотивировало сделать ещё более смелыми
✦ Эскиз стал основой графической идеи
✦ Планшет и деск удалось сэкономить
✦ Мобилку так сделать было нельзя, сделал в таком же духе (своё было-стало, зелёная линия)
✦ Следующая версия – ещё более. Оригинальная, компактная, геймифицированная
UX: анализ болей
✦ Анализ VOC (Voice of Clients) – систематизированная качественная обратная связь. Несёт инсайты о конкретных болях, сгруппированные по темам. Ранжировал по частоте упоминания и вникал в суть проблем для понимания болей
✦ Анализ метрик – количественные данные о действиях юзеров. Выбрал релевантные воронке и дополнительные, косвенно характеризующие привычки пользователей
✦ Анализ воронки – дал представление о ключевых проблемах процесса и идеи его перестроения
✦ Я описал процесс подписания единообразно, разбив его на фазы, присутствующие в каждом способе подписания. Это сделало работу удобнее и прозрачнее благодаря тому,
✦ Сопоставление данных дало важные инсайты о поведении пользователей на каждом этапе воронки. Для болей выдвигались гипотезы решений. Решения оценивались с точки зрения:
• Юридеческой правомерности
• Технической возможности
• Стоимости разработки
• Пользы для бизнеса
• Пользы для юзеров
✦ Анализ метрик – количественные данные о действиях юзеров. Выбрал релевантные воронке и дополнительные, косвенно характеризующие привычки пользователей
✦ Анализ воронки – дал представление о ключевых проблемах процесса и идеи его перестроения
✦ Я описал процесс подписания единообразно, разбив его на фазы, присутствующие в каждом способе подписания. Это сделало работу удобнее и прозрачнее благодаря тому,
✦ Сопоставление данных дало важные инсайты о поведении пользователей на каждом этапе воронки. Для болей выдвигались гипотезы решений. Решения оценивались с точки зрения:
• Юридеческой правомерности
• Технической возможности
• Стоимости разработки
• Пользы для бизнеса
• Пользы для юзеров
UX writing
✦ Для того, чтобы уместить в компактном виджете всю значимую информацию, совместно c UX-редакцией провели множество итераций в поисках удачных формулировок, объединяющих:
• Ракурс подачи фактов с учётом бизнес-целей
• Важные для пользователя нюансы
• Ключевые преимущества
• Достоверность
• Тон голоса
• Краткость
Эта непростая цель была достигнута благодаря очень профессиональной UX-редакции и моим хорошим речевым навыкам, развитым со школьных сочинений и усиленным трудами Максима Ильяхова и его вдохновительницы Норы Галь
• Ракурс подачи фактов с учётом бизнес-целей
• Важные для пользователя нюансы
• Ключевые преимущества
• Достоверность
• Тон голоса
• Краткость
Эта непростая цель была достигнута благодаря очень профессиональной UX-редакции и моим хорошим речевым навыкам, развитым со школьных сочинений и усиленным трудами Максима Ильяхова и его вдохновительницы Норы Галь
Процесс и результат: от первых набросков до финальных макетов
✦ Раньше выглядело вот так:
• Ни преимуществ с деталями
• Ни возможности подключить другие
• Утилитарный UI и скучный UX
• Ни преимуществ с деталями
• Ни возможности подключить другие
• Утилитарный UI и скучный UX
✦ В таком исполнении ключевая метрика с большим количеством вариантов также красивым способом не могла была быть достигнута
✦ Так выглядел виджет при использовании стандартных паттернов дизайн-системы
Руководство дало добро на более решительный редизайн
Руководство дало добро на более решительный редизайн
✦ Я провёл совместную сессию с двумя лидами, и в результате показали руководству такую версию. Нестандартный паттерн, яркий необычный вид
✦ На встрече получили наброски. "Всё круто, но надо переделать" (с)
Сделать компактнее и ещё проще
Сделать компактнее и ещё проще
✦ Пришёл с вот такой концепцией. Повернул, как просили, вынес зону управления и сделал компактно
Постепенными итерациями удалось выгнать весь воздух и оставить оптимальное количество, благодаря чему удалось сделать одинаковые версии в планшете и десктопе, сэкономив ресурс
✦ Удалось реализовать все требования и собрать единообразный компактный виджет для планшета и десктопа
✦ В мобильной версии так было сделать нельзя.
Поэтому визуально сохранив единообразие, сделал другую версию
Кнопки всегда в нижней половине
✦ Приоритезация элементов управления для более удобного расположения на экране
✦ Было / стало
Скорость сканирования увеличена за счёт:
• Визуальной группировки абзацев по темам с выделением типографикой
• Трансформации текста в иконки для передачи смысла
• Начала строк вдоль левого края
Также:
• Визуальная преемственность с десктопной версией
• Кнопка визуально "держит" макет
• Крестик убран, чтобы случайно не прервать по ошибке процесс
Скорость сканирования увеличена за счёт:
• Визуальной группировки абзацев по темам с выделением типографикой
• Трансформации текста в иконки для передачи смысла
• Начала строк вдоль левого края
Также:
• Визуальная преемственность с десктопной версией
• Кнопка визуально "держит" макет
• Крестик убран, чтобы случайно не прервать по ошибке процесс
✦ Следующей итерацией декстопной версии стала ещё более миниаютюрная
Пользователь привык к промежуточной
От неё оставил только квадрат, всё поместив туда, переиспользовав тексты и иллюстрации
В той же логике, ещё компактнее и проще
Пользователь привык к промежуточной
От неё оставил только квадрат, всё поместив туда, переиспользовав тексты и иллюстрации
В той же логике, ещё компактнее и проще
✦ Размер пейджы в Фигме по этой задаче: краткое описание и 200 макетов для десктопа и адаптива, соединённые во флоу с аннотациями
✦Миро
✦ Прототипы
✦Миро
✦ Прототипы
[04]
шаги процесса
инструменты
✦ Управление жестами
✦ Максимизация полезного пространства экрана
✦ Различные механизмы взаимодействия собраны для эффективного выполнения задач целевой аудитории
✦ Максимизация полезного пространства экрана
✦ Различные механизмы взаимодействия собраны для эффективного выполнения задач целевой аудитории
КЛЮЧЕВЫЕ идеи
Челлендж
Отсутствие референсов аналогичных продуктов
DESIGN LEAD
Это огонь! Красиво и удобно. Крышесносная работа
АНАЛИТИЧЕСКИЙ ПРОДУКТ С КАРТАМИ
Дизайн инструмента для аналитиков Департамента Транспорта Москвы
Хотелось сделать эмоциональный продукт, чтобы работалось с удовольствием. Чтобы люди делали город лучше и чувствовали себя полезными
Позволяет фильтровать данные, загружать их, просматривать подробную информацию, редактировать, добавлять в папки, формировать отчёты
Есть горячие клавиши и жесты
Хотелось сделать эмоциональный продукт, чтобы работалось с удовольствием. Чтобы люди делали город лучше и чувствовали себя полезными
Позволяет фильтровать данные, загружать их, просматривать подробную информацию, редактировать, добавлять в папки, формировать отчёты
Есть горячие клавиши и жесты
Задача
[03]
шаги процесса
инструменты
✦ Спроектировал унифицированный паттерн просмотра дэшбордов
✦ Провёл и обработал 14 глубинных интервью за месяц работы
✦ 5 KILLER FEATURE с подтвержденной полезностью и возможностью технической реализации
✦ Провёл и обработал 14 глубинных интервью за месяц работы
✦ 5 KILLER FEATURE с подтвержденной полезностью и возможностью технической реализации
Достижения
Челлендж
Требовалось исправить негативное восприятие продукта целевой аудиторией. Цель удалось достичь
DESIGN LEAD
Это огонь! Красиво и удобно. Крышесносная работа
АНАЛИТИЧЕСКИЙ ПРОДУКТ С КАРТАМИ
✦ В правом верхнем углу виджет с датой и временем, символизирующий Кремль или высотки
✦ Символ в центре означает ключевое действие продукта – создание предлложения (см. далее)
✦ Красивые московские закаты вдохновили на скринсейверы
Дизайн инструмента для аналитиков Департамента Транспорта Москвы
Хотелось сделать эмоциональный продукт, чтобы работалось с удовольствием. Чтобы люди не закапывались в данных и отчётах, а сохраняли фокус на том, что они делают для города предложения по улучшению – и это их ключевой полезный вклад в жизнь города
Позволяет фильтровать данные, загружать их, просматривать подробную информацию, редактировать, добавлять в папки, формировать отчёты
Есть горячие клавиши и жесты
Эффективный инструмент, на мой взгляд, тот, в котором удобнее и быстрее получать стабильно качественный результат, чем без него. Основной флоу выкристаллизовался такой:
Открывает карту
Выбирает место города, которое требует внимания в первую очередь
Собирает материалы
Формирует отчёт
Теперь подробнее о каждом этапе:
Хотелось сделать эмоциональный продукт, чтобы работалось с удовольствием. Чтобы люди не закапывались в данных и отчётах, а сохраняли фокус на том, что они делают для города предложения по улучшению – и это их ключевой полезный вклад в жизнь города
Позволяет фильтровать данные, загружать их, просматривать подробную информацию, редактировать, добавлять в папки, формировать отчёты
Есть горячие клавиши и жесты
Эффективный инструмент, на мой взгляд, тот, в котором удобнее и быстрее получать стабильно качественный результат, чем без него. Основной флоу выкристаллизовался такой:
Открывает карту
Выбирает место города, которое требует внимания в первую очередь
Собирает материалы
Формирует отчёт
Теперь подробнее о каждом этапе:
- Карта в первую очередь, т. к. главный объект работы – это город. Поэтому на карту надо приземлять все данные. Чтобы не потеряться на карте предусмотрены фильтры и бесшовный переход между картой и представлением в виде списка или карточек. Анимация подсвечивает соответствие сущности на карте и в списке (строки или карточки)
- Таким образом, есть две точки входа в процесс выбора: через карту и через список оповещений. Оповещения настраиваются через правила срабатывания опытным сотрудником, как в продуктах по информационной безопасности. Качество событий (срабатываний) оценивается в процессе работы и корректируется по необходимости. Чтобы выбрать приоритетный объект было проще, сортировка по умолчанию помещает на первое место в списке объект, который требует наибольшего внимания сотрудника на текущий момент. Есть возможность применить фильтр даты. Также, есть возможность сравнить два объекта, если нужно дать обоснованный ответ, к примеру, когда произошла ситуация, получившая резонанс в СМИ, и нужно понять, стоит ли туда направить ресурсы в первую очередь, или же это случайность и решать стоит в обычном порядке. Набор инструментов широк. Как продуманные стандартные фильтры (дата, район, тип объекта, критичность), сортировка, поиск с подсказками и историей. Так и специализированные: фильтр по области на карте, возможность добавления окрестностей выбранной области по радиусу удаления и фигурных (для кейсов: "в радиусе 5 км от Кремля не должно быть проблем", "в окрестностях парка Х не должно быть проблем")
- Сбор материалов максимально автоматизирован, чтобы сократить ручной труд, не требующий квалификации сотрудника. Т. к. инструмент экспертный, а также, потому что не все типы данных сразу возможно загружать автоматически, предусмотрена возможность ручного добавления данных. Тремя способами: ручное заполнение (на столе лежит газетная вырезка об инциденте или пост в соц.сетях), дрэг-энд-дроп и старый добрый "обзор". Добавленные материалы делятся на привязанные к карте и не привязанные по тем или иным причинам. В идеале, чтобы все были привязаны. Данные бывают разных типов, для которых предусмотрен удобный формат просмотра. Для видео сделан видеоплеер с возможностью делать скрины (потому что в отчёт нельзя прикрепить видос) и комментить (для того, чтобы коллеги, смотря архивы, могли быстрее понять, зачем это видео прикреплено к кейсу предложения улучшения для города). Для действий предусмотрены горячие клавиши и красивый интерфейс (чтобы удобно и красиво). Например, для включения/выключения громкости использую клавишу V, потому что на английском это Volume, а на русском Вкл/Выкл, поэтому легко запомнить (а не M - mute). Скриншот – S. Документы можно собирать в папки для последующего формирования предложений. На папках отражён статус. И да, есть красивые анимации и возможность открыть рядом список файлов и папку предложения и удобным жестом перетаскивания накидать нужные файлы.
- Формирование предложения (отчёта) – это специальный экран, который позволяет получать консистентные по качеству отчёты. Он содержит типовую структуру, кликабельное содержание для удобной навигации, лучшие практики в виде чек-листа предложения, которое с большей вероятностью будет принято курирующей организацией-исполнителем и другие функции. Этот флоу нацелен на быстрое создание качественных предложений, получающих одобрение на реализацию
Левый и правый углы активны и позволяют открыть два окна для удобства работы
Для открытия меню переместите курсор в угол. По UX-закону Фиттса, углы – наиболее лёгкие места наведения курсора на экранах
Повторное заведение в угол скрывает окно
В тёмной теме им на замену – другой яркий гость московского неба: северное сияние
Я считаю, что красота – это функция, которая позволяет удобному интерфейсу стать ещё лучше :)
Открытое окно можно перемещать влево-вправо для удобства работы с картой
ЖЕСТЫ
ЕЩЁ немного ЭКРАНОВ
КРАСОТА-А-А
✦ Красивые московские закаты вдохновили на скринсейверы
✦ Символ в центре означает ключевое действие продукта – создание предлложения (см. далее)
✦ В правом верхнем углу виджет с датой и временем, символизирующий Кремль или высотки
✦ Символ в центре означает ключевое действие продукта – создание предлложения (см. далее)
✦ В правом верхнем углу виджет с датой и временем, символизирующий Кремль или высотки
✦ Красивые московские закаты вдохновили на скринсейверы
✦ Символ в центре означает ключевое действие продукта – создание предлложения (см. далее)
✦ В правом верхнем углу виджет с датой и временем, символизирующий Кремль или высотки
✦ Красивые московские закаты вдохновили на скринсейверы
✦ Символ в центре означает ключевое действие продукта – создание предлложения (см. далее)
✦ В правом верхнем углу виджет с датой и временем, символизирующий Кремль или высотки
✦ Символ в центре означает ключевое действие продукта – создание предлложения (см. далее)
✦ В правом верхнем углу виджет с датой и временем, символизирующий Кремль или высотки
Кратко о работе
Продукт ценен тем, что позволяет сразу обращать внимание на первостепенное, объективно сравнивать все данные, наглядно приземлять инфу в контекст города и старается дарить позитивные эмоции пользователям, оставаясь экспертным
Ключевые метрики:
✦ Процент автоматически добавляемых материалов (Это скриншоты с камер видеонаблюдения, тексты жалоб, описания ДТП, скрины графиков, скрины резонансных материалов в СМИ и другие)
✦ Время работы над одним предложением (есть возможность выработать норматив и улучшать его благодаря чек-листам, помогающим также быстрее онбордить и подтягивать новичков до уровня опытных)
✦ Процент принятых предложений
✦ Процент предложений, оказавшихся полезными
✦ Процент автоматически добавляемых материалов (Это скриншоты с камер видеонаблюдения, тексты жалоб, описания ДТП, скрины графиков, скрины резонансных материалов в СМИ и другие)
✦ Время работы над одним предложением (есть возможность выработать норматив и улучшать его благодаря чек-листам, помогающим также быстрее онбордить и подтягивать новичков до уровня опытных)
✦ Процент принятых предложений
✦ Процент предложений, оказавшихся полезными
Эмоциональный дизайн
Хотелось сделать эмоциональный продукт, чтобы работалось с удовольствием. Чтобы люди не закапывались в данных и отчётах, а сохраняли фокус на том, что они делают для города предложения по улучшению – и это их ключевой полезный вклад в жизнь города
✦ Создал уникальную иконку (не видел в других приложениях), которая символизирует улучшение. Она встречает при входе в приложение и на скринсейвере, живёт на кнопке создания предложения и появляется, когда предложение создано, чтобы усилить удовольствие от выполненной задачи и потом напоминать об этом при встрече (скринсейвер и логин) и при новых начинаниях (создание предложения начинается с кнопки с этим символом). По аналогии с символом для ИИ в интерфейсе, я подумал: "А почему бы не сделать свою иконку для своей функции?". Внутри этого продукта она будет понятна аудитории
✦ Скринсейвер вдохновлён красивыми градиентами московского неба. В основе лежит игра слов, что сотрудники работают над городом, создавая улучшения – эта уникальная перспектива отражена в графической идее
✦ Скринсейвер вдохновлён красивыми градиентами московского неба. В основе лежит игра слов, что сотрудники работают над городом, создавая улучшения – эта уникальная перспектива отражена в графической идее
✦ В тёмной теме небо украшает другой яркий гость: северное сияние. Коллеги рано или поздно заметят разницу скринсейверов тёмной и светлой темы и дополнительный повод для обсуждения усилит эмоциональную связь и положительный пользовательский опыт. Люди, которые чувствуют, что о них позаботились, на мой взгляд, с большей вероятностью позаботятся о жителях города)) Считаю, что хорошие интерфейсы нужно делать так))
✦ В правом верхнем углу живёт виджет с временем и датой, образующими силуэт московских высоток или Кремля. В нём скрыт небольшой ребус – как раз будет повод поразглядывать между делом
✦ В правом верхнем углу живёт виджет с временем и датой, образующими силуэт московских высоток или Кремля. В нём скрыт небольшой ребус – как раз будет повод поразглядывать между делом
Жесты, горячие клавиши и интуитивное взаимодействие
Чтобы опытные пользователи могли совершать действия быстрее, я добавил в интерфейс такие возможности
✦ В интерфейсе синей анимации не будет – это для наглядности активной области на скринах
✦ В интерфейсе синей анимации не будет – это для наглядности активной области на скринах
Следуя UX-закону Фиттса, чем крупнее элемент, тем удобнее наводить курсор. Углы – самые удобные для наведения области экрана, поэтому я выбрал их для вызова меню управления
Можно открыть слева и справа (позже покажу, чем это удобно). Открытая область занимает ровно половину экрана (2 из 4 колонок), чтобы было красиво и ровненько
Можно перемещать слева-направо
✦ Скрыть можно и развёрнутое меню
✦ Зум=колесо+CTRL. Колесо = вертикальный скролл. Колесо+Shift = горизонтальный. ЛКМ (зажатая) = перемещение карты в свободном направлении. ПКМ – меню в месте клика
✦ Зум=колесо+CTRL. Колесо = вертикальный скролл. Колесо+Shift = горизонтальный. ЛКМ (зажатая) = перемещение карты в свободном направлении. ПКМ – меню в месте клика
Перетаскивание слева-направо и другие элементы управления
✦ Интуитивно понятный тактильный принцип позволяет открыть два меню и перетаскивать файлы в папки проектов
Также здесь можно увидеть:
✦ Анимацию наведения на папку (слева) и на карточки с коротким и длинным названиями (справа) и действия с карточками
✦ Представление изображений и видео в списке файлов
✦ Различные элементы управления: (слева) сортировку в дропдауне, быстрый фильтр с одним значением, фильтр с дропдауном, фильтр диапазона дат (выбран). И иконки действий при наведении курсора на карточки (справа): массовый выбор, редактирование, удаление, добавление в папку
✦ Переключение вида представления (карточки-табличный список)
✦ Сводку количества с указанием типа ("Предложения", "Все файлы")
Также здесь можно увидеть:
✦ Анимацию наведения на папку (слева) и на карточки с коротким и длинным названиями (справа) и действия с карточками
✦ Представление изображений и видео в списке файлов
✦ Различные элементы управления: (слева) сортировку в дропдауне, быстрый фильтр с одним значением, фильтр с дропдауном, фильтр диапазона дат (выбран). И иконки действий при наведении курсора на карточки (справа): массовый выбор, редактирование, удаление, добавление в папку
✦ Переключение вида представления (карточки-табличный список)
✦ Сводку количества с указанием типа ("Предложения", "Все файлы")
Красивые детали
✦ Элементы интерфейса скруглены, и радиусы вписаны один в другой ровненько (подложки, обводки, заливки)
✦ Теньки, микроанимации и необычные элементы добавлены, чтобы было приятнее )
✦ Небольшой отступ от края экрана добавляет красоты и лёгкости, сохраняет контекст и использует карту как дополнительный декоративный элемент (пользуясь уникальным случаем). При этом, я учёл опыт Figma и их UI2, когда большой отступ вызвал волну хейта, потому что отнимал слишком много пространство экрана, не добавляя никакой ценности кроме эстетики. Поэтому я сохранил эстетику и минимизировал использованное пространство
Просмотр медиа
Для работы нужен просмотр различных файлов: изображения, видео, текст, тепловые карты
Просмотр видео нужен для записей с городских камер видеонаблюдения. В отчёте-предложении нельзя разместить видео, и для использования материалов предназначен данный интерфейс
✦ Слева-направо функции: плей/пауза, скорость, звук, таймлайн, скриншот, коммент, закрыть
✦ Функции распределены в 2 группы по 3 элемента слева и справа от таймлайна. Причём, функции сгруппированы по смыслу: настройки воспроизведения слева, тайлмайн для наглядности, справа работа и закрытие
✦ Управление горячими клавишами:
V для управления звуком выбран потому, что имеет смысл как в русском (вкл/выкл), так и в английском (volume)
S – скриншот
✦ Есть возможность добавлять комментарии, чтобы сэкономить время коллегам и в будущем в архиве быстрее находить главное
✦ Слева-направо функции: плей/пауза, скорость, звук, таймлайн, скриншот, коммент, закрыть
✦ Функции распределены в 2 группы по 3 элемента слева и справа от таймлайна. Причём, функции сгруппированы по смыслу: настройки воспроизведения слева, тайлмайн для наглядности, справа работа и закрытие
✦ Управление горячими клавишами:
V для управления звуком выбран потому, что имеет смысл как в русском (вкл/выкл), так и в английском (volume)
S – скриншот
✦ Есть возможность добавлять комментарии, чтобы сэкономить время коллегам и в будущем в архиве быстрее находить главное
Главный флоу
Пользователь:
→ Открывает карту
→ Выбирает место города, которое требует внимания в первую очередь
→ Собирает материалы
→ Формирует отчёт
→ Открывает карту
→ Выбирает место города, которое требует внимания в первую очередь
→ Собирает материалы
→ Формирует отчёт
✦ Точки входа 2: это карта или список оповещений, а-а-автоматически отсортированный по приоритету – чтобы не пропустить самое главное в потоке новостей
✦ Хавер на элемент списка подсвечивает соответствующую ему область на карте и выводит краткий виджет, чтобы не пришлось делать ни одного лишнего клика
✦ Хавер на элемент списка подсвечивает соответствующую ему область на карте и выводит краткий виджет, чтобы не пришлось делать ни одного лишнего клика
✦ Фильтры, поиск, сортировка для выбора нужной инфы
✦ Каждый атрибут фильтрации отделён дивайдером и любой можно скрыть – для удобства
✦ Фильтры разных видов (сверху вниз): быстрые (чипсы, тэги), дата в виде диапазона, с коротким списком значений, с большим списком по алфавиту, с очень большим списком с поиском и разбиением по алфавиту побуквенно
✦ Кнопки внизу всегда на виду и отделены маленькой тенюшкой над списком для наглядной визуальной логики
✦ Закрываются по клику вне области. Потому что пользователи уже понимают, как работают фильтры, поэтому крестик можно упразднить
✦ При выходе без применения появится предупреждение
✦ Каждый атрибут фильтрации отделён дивайдером и любой можно скрыть – для удобства
✦ Фильтры разных видов (сверху вниз): быстрые (чипсы, тэги), дата в виде диапазона, с коротким списком значений, с большим списком по алфавиту, с очень большим списком с поиском и разбиением по алфавиту побуквенно
✦ Кнопки внизу всегда на виду и отделены маленькой тенюшкой над списком для наглядной визуальной логики
✦ Закрываются по клику вне области. Потому что пользователи уже понимают, как работают фильтры, поэтому крестик можно упразднить
✦ При выходе без применения появится предупреждение
✦ При наведении на область на карте также появляется краткий виджет
✦ При клике открывается подробная инфа
✦ Пороговые значения настраиваются опытными сотрудниками
✦ Единицы измерения соответствуют типам объектов
✦ Вес критериев в правилах срабатывания нормализован для корректной приоритезации
✦ На графике есть возможность переключать период. При этом, критичность для периодов может быть разная
✦ Каждый раздел подробностей можно свернуть
✦ В сводке также отображена причина срабатывания, значение показателя и тренд
✦ Файлы открываются для предпросмотра (показано выше)
✦ Пороговые значения настраиваются опытными сотрудниками
✦ Единицы измерения соответствуют типам объектов
✦ Вес критериев в правилах срабатывания нормализован для корректной приоритезации
✦ На графике есть возможность переключать период. При этом, критичность для периодов может быть разная
✦ Каждый раздел подробностей можно свернуть
✦ В сводке также отображена причина срабатывания, значение показателя и тренд
✦ Файлы открываются для предпросмотра (показано выше)
✦ Наведение на графике позволяет посмотреть подробности без клика (для месяца – по неделям, для недели – по дням)
✦ Пользователь изучает информацию и в случае наличия оснований принимает решения о создании предложения по улучшению города в этом месте
✦ Пользователь изучает информацию и в случае наличия оснований принимает решения о создании предложения по улучшению города в этом месте
✦ Создаётся папка предложения, в которую можно накидать материалы (скриншоты с камер видеонаблюдения, тексты жалоб, описания ДТП, скрины графиков, скрины резонансных материалов в СМИ и другие)
✦ Материалы появляются 4-мя способами: автоматически (преимущественно), дрэг-энд-дропом, старым добрым обзором и ручным вводом. Потому что продукт для экспертов
✦ Материалы появляются 4-мя способами: автоматически (преимущественно), дрэг-энд-дропом, старым добрым обзором и ручным вводом. Потому что продукт для экспертов
✦ На экране создания предложения появляется символ улучшения. Карта, чтобы не отвлекала, блюрится. Оверлей красится в красивый, для антуража
✦ Номер предложения присваевается автоматически для учёта и отображается наверху
✦ У предложения появляется статус
✦ Название формируется автоматически по шаблону и доступно для редактирования. Эмоджи добавляют позитивных эмоций на ответственном шаге чтобы результат получился лучше
✦ Ниже идёт кликабельное оглавление с возможностью добавлять разделы прямо оттуда: структура документа наглядна
✦ Сводка заполняется автоматически и вручную, где это нужно (дропдауны тип объекта и приоритета)
✦ Автор присвоен автоматически и неизменен. Исполнителей может быть несколько и могут меняться
✦ В описании проблемы подсказка направляет мысль. Под полем ввода счётчик символов в дефолтном состоянии
✦ Для аргументации выбранного решения можно приложить сравнение вариантов
✦ Описание решения также предзаполнено. Поле и счётчик символов показы в активном состоянии
✦ К тексту предложения приложены материалы (скриншоты с камер видеонаблюдения, тексты жалоб, описания ДТП, скрины графиков, скрины резонансных материалов в СМИ и другие)
✦ Можно открыть чек-лист хорошего предложения, собирающий лучшие практики, для повышения метрики количества принятых к исполнению предложений (куратора, за это отвечающего, надо убедить. Чек-лист формируется опытными сотрудниками, как PlayBook в информационной безопасности)
✦ Черновик сохраняется автоматически. Статус тоже меняется автоматически
✦ В финале предложение экспортируется в виде документа Word или PDF, чтобы прислать куратору, отвечающему за принятие решения
✦ В оповещениях автоматически появится напоминание уточнить статус предложения, если в течение установленного периода пользователь не поменяет статус с "Согласование"
✦ Далее будет доработка предложения или строительство. После строительства идёт проверка реализации проекта. И, если всё хорошо, то через установленный период придёт оповещение о том, удалось ли предложению положительно повлиять на эту часть города
✦ На карте объекты меняют цвет с сигнального на соответствующий статусу
✦ Номер предложения присваевается автоматически для учёта и отображается наверху
✦ У предложения появляется статус
✦ Название формируется автоматически по шаблону и доступно для редактирования. Эмоджи добавляют позитивных эмоций на ответственном шаге чтобы результат получился лучше
✦ Ниже идёт кликабельное оглавление с возможностью добавлять разделы прямо оттуда: структура документа наглядна
✦ Сводка заполняется автоматически и вручную, где это нужно (дропдауны тип объекта и приоритета)
✦ Автор присвоен автоматически и неизменен. Исполнителей может быть несколько и могут меняться
✦ В описании проблемы подсказка направляет мысль. Под полем ввода счётчик символов в дефолтном состоянии
✦ Для аргументации выбранного решения можно приложить сравнение вариантов
✦ Описание решения также предзаполнено. Поле и счётчик символов показы в активном состоянии
✦ К тексту предложения приложены материалы (скриншоты с камер видеонаблюдения, тексты жалоб, описания ДТП, скрины графиков, скрины резонансных материалов в СМИ и другие)
✦ Можно открыть чек-лист хорошего предложения, собирающий лучшие практики, для повышения метрики количества принятых к исполнению предложений (куратора, за это отвечающего, надо убедить. Чек-лист формируется опытными сотрудниками, как PlayBook в информационной безопасности)
✦ Черновик сохраняется автоматически. Статус тоже меняется автоматически
✦ В финале предложение экспортируется в виде документа Word или PDF, чтобы прислать куратору, отвечающему за принятие решения
✦ В оповещениях автоматически появится напоминание уточнить статус предложения, если в течение установленного периода пользователь не поменяет статус с "Согласование"
✦ Далее будет доработка предложения или строительство. После строительства идёт проверка реализации проекта. И, если всё хорошо, то через установленный период придёт оповещение о том, удалось ли предложению положительно повлиять на эту часть города
✦ На карте объекты меняют цвет с сигнального на соответствующий статусу
Красивые детали
✦ Концентрические
Тенюшки
Отпступ как у фигмы в ЮЙ2, но лучше
Аватарки с милыми формами
Тенюшки
Отпступ как у фигмы в ЮЙ2, но лучше
Аватарки с милыми формами
шаги процесса
инструменты
✦ Спроектировал унифицированный паттерн просмотра дэшбордов
✦ Провёл и обработал 14 глубинных интервью за месяц работы
✦ 5 KILLER FEATURE с подтвержденной полезностью и возможностью технической реализации
✦ Провёл и обработал 14 глубинных интервью за месяц работы
✦ 5 KILLER FEATURE с подтвержденной полезностью и возможностью технической реализации
Достижения
АНИМАЦИИ
[05]
Челлендж
Требовалось исправить негативное восприятие продукта целевой аудиторией. Цель удалось достичь
Масштабный редизайн UX и UI всего продукта
ДИРЕКТОР SOLAR
Теперь это совсем другой продукт! Отличная работа, Михаил!
Задача
шаги процесса
инструменты
✦ Спроектировал унифицированный паттерн просмотра дэшбордов
✦ Провёл и обработал 14 глубинных интервью за месяц работы
✦ 5 KILLER FEATURE с подтвержденной полезностью и возможностью технической реализации
✦ Провёл и обработал 14 глубинных интервью за месяц работы
✦ 5 KILLER FEATURE с подтвержденной полезностью и возможностью технической реализации
Достижения
[06]
ДЭШБОРД ДЛЯ РУКОВОДИТЕЛЕЙ
Челлендж
Требовалось исправить негативное восприятие продукта целевой аудиторией. Цель удалось достичь
Масштабный редизайн UX и UI всего продукта по результатам нескольких лет его существования. Провёл полный аудит, ранжировал гипотезы решений, сопоставили с РО с релизным планом и старались решать в каждой задаче наибольшее количество проблем. Например, дэшборд был не просто добавлен, а весь продукт пересобран на его основе, обеспечив единый механизм доступа к показателям, устранив большую вложенность и повысив гибкость персонализации. Многое было улучшено в UX-райтинге и информационной структуре, а часть ресурсов удалось сэкономить благодаря своевременным инициированным мной пользовательским исследованиям
ДИРЕКТОР SOLAR
Теперь это совсем другой продукт! Отличная работа, Михаил!
Задача
Трудности
Для высоких темпов разработки необходимо было использовать компоненты из UI-библиотеки
с минимальной кастомизацией
с минимальной кастомизацией
Табличный интерфейс для аналитики
в сфере информационной безопасности
На компонентах системы ANT Design
в сфере информационной безопасности
На компонентах системы ANT Design
Задача
Директор портфеля продуктов EDR / NTA
Спасибо Михаилу Сенцову за работу с обратной связью – вот так надо общаться с заказчиком
Добавлена удобная фича управления составом и порядком полей таблицы
Данные в боковом окне сгруппированы по смыслу и упорядочены по приоритету
Данные в боковом окне сгруппированы по смыслу и упорядочены по приоритету
ДОстижения
[07]
ВЫСОКОНАГРУЖЕННЫЙ ИНТЕРФЕЙС
шаги процесса
инструменты
Трудности
Для некоторых продуктов были трудности с доступом к релевантным респондентам. Максимум пользы удалось получить благодаря хорошей предварительной подготовке к интервью, чтобы от встречи нужно было только подтвердить гипотезы и добавить деталей
✦ Сверху: глубинное интервью, анализ, фиксирование болей, инсайтов etc.
✦ Справа: учёт гипотез, планирование исследований для проверки, учёт результатов: в бэклог, в архив
✦ Справа: учёт гипотез, планирование исследований для проверки, учёт результатов: в бэклог, в архив
Задача
UX-архитектор
Благодаря бережному отношению к интервью, Михаилу удаётся вовремя влиять на функционал, проверять гипотезы стейкхолдеров и избегать ненужной работы команды
Благодаря тщательному анализу, удалось использовать интервью не только для целевой фичи, но и для других фич: часть инсайтов пригодились + удалось придумать удачные способы сочетать решения болей и запросы аудитории
ДОстижения
[08]
ПРИМЕРЫ АРТЕФАКТОВ
✦ Сверху: глубинное интервью, анализ, фиксирование болей, инсайтов etc.
✦ Снизу: учёт гипотез, планирование исследований для проверки, учёт результатов: в бэклог, в архив
✦ Снизу: учёт гипотез, планирование исследований для проверки, учёт результатов: в бэклог, в архив
НЕЙРОСЕТИ (MIDJOURNEY + CHATGPT)
[09]
АЛЕКСАНДР ВАСИН, АРТ ДИР TYPOMANIA FESTIVAL
Боже, это прекрасно
[11]
УМЕЮ В ГРАФДИЗАЙН
