Speaker A
Привет, меня зовут Айрат, а тут мы говорим про IT-стартапы и в целом про разработку IT-продуктов.
Видео объясняет, что такое User Flow, зачем он нужен и как его создавать для улучшения пользовательского опыта в IT-продуктах.
Key Takeaways
- User Flow — ключевой инструмент для понимания и оптимизации пользовательских сценариев.
- Создавать User Flow нужно на ранних этапах разработки для минимизации проблем и лишних шагов.
- Визуализация User Flow помогает улучшить UX и повысить конверсию на сайте или в приложении.
- Использование User Flow способствует более эффективной коммуникации внутри команды и с внешними заинтересованными сторонами.
- Применение User Flow ускоряет процесс разработки и снижает количество переделок.
Summary
- User Flow — это блок-схема, отображающая путь пользователя от входа в продукт до достижения цели.
- Основные элементы User Flow: круг (начало/конец), ромб (принятие решения), прямоугольник (действие), стрелки (направление).
- User Flow помогает создавать удобный интерфейс, улучшать существующие, демонстрировать структуру проекта и ускорять разработку.
- Процесс создания User Flow включает исследование пользователей, определение целей и путей их достижения, визуализацию схемы.
- User Flow создаётся на ранних этапах разработки, до прототипирования и дизайна, чтобы избежать лишних шагов и экранов.
- Для создания User Flow можно использовать бумагу, доску или специализированные инструменты, например FigJam, Overflow, Axure, XMind, Miro.
- Пример User Flow для проекта Unicorn Base: вход на сайт, подбор, авторизация, проверка доступа, оплата и предоставление доступа.
- User Flow позволяет анализировать и оптимизировать пользовательский опыт, снижать количество шагов и повышать конверсию.
- Использование User Flow помогает команде смотреть на продукт с точки зрения пользователя и создавать более интуитивные решения.
- User Flow полезен для презентаций проекта команде, партнёрам и инвесторам, показывая логику взаимодействия пользователя с продуктом.
Full Transcript — Download SRT & Markdown
Speaker A
Успешность любого IT-проекта определяется не его дизайном, функционалом или быстродействием, а тем, получает ли пользователь решение своей задачи.
Speaker A
User Flow помогает понять и оптимизировать путь пользователя для решения конкретной задачи.
Speaker A
Разберём тему поподробнее.
Speaker A
Поймём, для чего нужен User Flow и как его составить.
Speaker A
Что такое User Flow?
Speaker A
User Flow от англ. user - пользователь, flow - поток, это блок-схемы, отображающие пользовательский путь или порядок действий, который проходит пользователь при использовании продукта.
Speaker A
User Flow визуально отображает каждый шаг, который проходит пользователь от точки входа до достижения конкретной цели.
Speaker A
Блок-схема всегда начинается с точки входа в продукт, например, это главная страница сайта или карточка товара, и заканчивается действием или результатом этого действия.
Speaker A
Например, регистрация на сайте или оформление заказа.
Speaker A
А визуальное представление пользовательского сценария позволяет оценивать и оптимизировать пользовательский опыт, ну, то бишь UX.
Speaker A
Уменьшать количество шагов для выполнения задачи и повышать конверсию достижения той или иной цели на данном сайте, на данном проекте.
Speaker A
Итогом каждого User Flow является достижение конкретной цели.
Speaker A
Схема помогает понять, насколько логично и корректно завершаются процессы.
Speaker A
Например, поиск, там, или создание учётной записи, покупка, скачивание, там, загрузка файла и так далее.
Speaker A
Каждый элемент блок-схемы в User Flow имеет свою форму, и каждая форма означает определённый процесс.
Speaker A
Первый элемент - это круг, он обозначает всегда, ну, начало либо конец действия.
Speaker A
Используется для указания, как бы, ну, начала и конца пользовательского сценария.
Speaker A
Второй элемент - это ромб, то есть принятие решения.
Speaker A
Ромб указывает на моменты принятия решения, где у пользователя есть выбор.
Speaker A
Например, да или нет, зарегистрироваться или пройти без регистрации и так далее.
Speaker A
И в зависимости от того, какое решение примет пользователь, определяется его следующий шаг.
Speaker A
Третье - это прямоугольник, это действие или процесс.
Speaker A
Прямоугольники указывают на действия, которые пользователь должен выполнить.
Speaker A
Например, войти, открыть корзину или отправить сообщение.
Speaker A
И завершающее - это стрелки или узел, то есть направление.
Speaker A
Стрелки указывают направление пользователя от шага к шагу, стрелки могут переходить как последовательно, перескакивать или возвращаться назад на основе пользовательских решений.
Speaker A
Зачем нужен User Flow?
Speaker A
Изучение пользовательского сценария сайта или мобильного приложения будет полезно независимо от того, разрабатывается новый продукт или дорабатывается старый.
Speaker A
А вот почему.
Speaker A
Первое, User Flow помогает создать удобный интерфейс.
Speaker A
Уже на стадии блок-схем команда видит, как тот или иной сценарий приводит к цели пользователя или наоборот, путает его.
Speaker A
Разработчики оценивают эффективность создаваемого интерфейса с точки зрения простоты, удобства передвижения по продукту.
Speaker A
И важным аспектом является то, что User Flow заставляет дизайнера, ну, и в целом всю команду разработчиков, разрабатывать, ну, создавать интерфейс продукта с точки зрения пользователя.
Speaker A
Ну, соответственно, всё это приводит к более интуитивно понятному продукту, который в конечном счёте удовлетворяет клиентов.
Speaker A
А второе - помогают улучшить существующие интерфейсы.
Speaker A
Пользовательский сценарий позволяет оценить, как пользователь перемещается уже по какому-то существующему интерфейсу.
Speaker A
Соответственно, выстроить воронку и замерять конверсию на каждом из шагов, ну, данного проекта.
Speaker A
Это позволит сформировать гипотезы, там, где и почему происходит, например, просадка.
Speaker A
И что нужно, чтобы это исправить.
Speaker A
Ну, например, это уменьшить или увеличить количество информации на странице, изменить количество полей, там, на формах, которые есть на проекте.
Speaker A
Изменить навигацию, сократить количество шагов и так далее.
Speaker A
И вот уже на базе этих гипотез можно проводить АБ-тесты и вносить изменения в сам сценарий.
Speaker A
Третье - позволяет продемонстрировать структуру проекта.
Speaker A
User Flow даёт представление о продукте в наиболее простой и эффективной форме.
Speaker A
Можно использовать User Flow в презентации проекта, там, команде, партнёрам, инвесторам, ну, как дополнительный способ объяснить пользу вашего продукта.
Speaker A
Ну, с точки зрения пользователя.
Speaker A
И пути этого пользователя, как он с ним будет взаимодействовать.
Speaker A
Четвёртое - позволяет ускорить дальнейшую разработку.
Speaker A
Когда разработчики начнут создание, визуальное, ну, отображение пути пользователя поможет в понимании вообще всего проекта и ускорит дальнейшее проектирование и разработку.
Speaker A
А также снизит вероятность переделок и доработок.
Speaker A
Как создать User Flow?
Speaker A
Разберём шаги.
Speaker A
Первое - нужно исследовать пользователей.
Speaker A
Перед началом создания User Flow нужно, естественно, знать своих клиентов.
Speaker A
Для этого проводятся исследования, там, которые дают понимание, откуда будут приходить клиенты.
Speaker A
Какие у них цели, какие задачи, какую услугу, там, и какой уровень сервиса они хотят.
Speaker A
Ну, и так далее.
Speaker A
Всё это нужно для того, чтобы знать, какие действия будет предпринимать пользователь.
Speaker A
Там, чтобы посетить именно вот этот сайт.
Speaker A
Как он будет использовать сам этот продукт.
Speaker A
Если это понимание уже есть, то можно сразу переходить к следующему шагу.
Speaker A
Шаг номер два - расписать цели и пути достижения.
Speaker A
То есть нужно сформировать цели, которые есть у пользователя.
Speaker A
И шаги по достижению данных целей.
Speaker A
Простой пример.
Speaker A
Цель - купить товар в интернет-магазине.
Speaker A
Соответственно, шаги - это вход на сайт, переход в каталог, переход в карточку товара, а добавление в корзину.
Speaker A
Переход в корзину, оформление заказа, оплата и выход.
Speaker A
И, соответственно, определив вот эти конечные цели для User Flow, можно подстраивать этот путь для создания лучшего пользовательского опыта.
Speaker A
Убирать или добавлять новые шаги, какие-то новые условия.
Speaker A
И шаг номер три по созданию - это визуализация целей и вот этих путей уже в User Flow.
Speaker A
А закончив первый и второй шаг, можно приступить уже к непосредственно к проектированию.
Speaker A
А для одной важной цели всегда создаётся одна вот эта блок-схема.
Speaker A
Если целей несколько, то создаётся несколько блок-схем, просто каждая из них называется под конкретную цель.
Speaker A
Например, регистрация на сайте, покупка товара или написание отзыва.
Speaker A
Когда необходимо создавать User Flow?
Speaker A
User Flow необходимо создавать на самой ранней стадии разработки проекта.
Speaker A
Сразу после того, как вы определились с идеей и провели исследования рынка и пользователей.
Speaker A
Очень важно разработать пользовательский сценарий до начала работ по прототипированию и дизайну интерфейсов.
Speaker A
Иначе высок риск создать проблемные области, лишние шаги, лишние экраны, которые будут только усложнять путь пользователя.
Speaker A
Разберём инструменты для создания User Flow.
Speaker A
Ввиду того, что сам по себе User Flow - это достаточно простой инструмент, ну, то есть простая штука в создании.
Speaker A
Выбор инструмента не является критичным вопросом.
Speaker A
User Flow можно составить хоть на бумаге, там, на маркерной доске.
Speaker A
Но, конечно, для удобства редактирования и доступа лучше использовать специализированные программы.
Speaker A
К счастью, их огромное множество.
Speaker A
Лично я предпочитаю FigJam, это внутренний инструмент Figma.
Speaker A
Мне нравится работать сразу в одном окне с User Flow и с прототипом.
Speaker A
Ну, вот так это выглядит.
Speaker A
Стоит ещё упомянуть такие приложения, как Overflow, Axure, XMind и Miro.
Speaker A
По ним есть куча туториалов в интернете, можно быстро понять, как работать в той или иной программе.
Speaker A
Итак, разберём, давайте, пример конкретного User Flow.
Speaker A
Вот пример пользовательского сценария нашего проекта Unicorn Base.
Speaker A
Цель клиента - получить доступ к базе контактов.
Speaker A
Путь состоит из вот таких шагов.
Speaker A
Первое - это вход на сайт.
Speaker A
Дальше - это подбор в каталоге, фильтрация.
Speaker A
Дальше - выбор карточки.
Speaker A
Далее мы проверяем авторизацию.
Speaker A
Если не авторизован, он регистрируется.
Speaker A
Точнее, если не зарегистрирован, он регистрируется.
Speaker A
Дальше идёт проверка наличия доступа к контактам.
Speaker A
Если нет, идёт описание тарифа.
Speaker A
Дальше идёт оплата тарифа.
Speaker A
Далее идёт выдача доступа и полный доступ к каталогу.
Speaker A
Вот такой путь.
Speaker A
Подведём итог.
Speaker A
А, начиная создание нового проекта с момента идеи и исследования клиента, но ещё до момента начала разработки прототипа и дизайн-макетов, важно создать пользовательский путь.
Speaker A
А User Flow является основой для требований к структуре, по контенту проекта, логике переходов между страницами и окнами.
Speaker A
А, понимая потребности пользователей, команда гораздо вероятнее сделает успешный продукт, который будет удовлетворять этих самых пользователей.
Speaker A
Если вы хотите создать пользовательский путь самостоятельно, следуйте вот руководству этому и пробуйте.
Speaker A
А также я могу помочь вам с разработкой User Flow в рамках услуги прототипирования.
Speaker A
А перейдите на сайт по ссылке в описании и ознакомьтесь с этой информацией более подробно.
Speaker A
На этом всё.
Speaker A
Тему мы подробно разобрали, если у вас остались вопросы, переходите в мой Telegram-канал.
Speaker A
Там мы можем это обсудить более подробно.
Speaker A
Подписывайтесь на YouTube-канал.
Speaker A
Пока.
Topics:User Flowпользовательский сценарийUXразработка IT-продуктовоптимизация интерфейсаблок-схемаконверсияпрототипированиеисследование пользователейинструменты для User Flow
