**USER FLOW - ЧТО ЭТО И КАК СОЗДАТЬ + ПРИМЕРЫ — Transcript & Summary | SozAI** Source: https://sozai.app/transcript/user-flow-what-how-create-examples/ Видео объясняет, что такое User Flow, зачем он нужен и как его создавать для улучшения пользовательского опыта в IT-продуктах. ## Key Takeaways - User Flow — ключевой инструмент для понимания и оптимизации пользовательских сценариев. - Создавать User Flow нужно на ранних этапах разработки для минимизации проблем и лишних шагов. - Визуализация User Flow помогает улучшить UX и повысить конверсию на сайте или в приложении. - Использование User Flow способствует более эффективной коммуникации внутри команды и с внешними заинтересованными сторонами. - Применение User Flow ускоряет процесс разработки и снижает количество переделок. ## What the video covers - 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 полезен для презентаций проекта команде, партнёрам и инвесторам, показывая логику взаимодействия пользователя с продуктом. Answers ## Questions about this video Что такое User Flow и для чего он нужен? User Flow — это блок-схема, отображающая путь пользователя от входа в продукт до достижения конкретной цели. Он нужен для понимания и оптимизации пользовательского опыта, создания удобного интерфейса и повышения конверсии. Какие основные элементы включает User Flow? User Flow состоит из кругов (начало/конец), ромбов (принятие решения), прямоугольников (действия) и стрелок, указывающих направление движения пользователя по шагам. Когда лучше всего создавать User Flow в процессе разработки? User Flow следует создавать на самой ранней стадии разработки, сразу после определения идеи и исследования пользователей, до начала прототипирования и дизайна интерфейса, чтобы избежать лишних шагов и проблемных областей. ## Full Transcript — Download SRT & Markdown 00:00 Speaker A Привет, меня зовут Айрат, а тут мы говорим про IT-стартапы и в целом про разработку IT-продуктов. 00:06 Speaker A Успешность любого IT-проекта определяется не его дизайном, функционалом или быстродействием, а тем, получает ли пользователь решение своей задачи. 00:15 Speaker A User Flow помогает понять и оптимизировать путь пользователя для решения конкретной задачи. 00:25 Speaker A Разберём тему поподробнее. 00:26 Speaker A Поймём, для чего нужен User Flow и как его составить. 00:27 Speaker A Что такое User Flow? 00:31 Speaker A User Flow от англ. user - пользователь, flow - поток, это блок-схемы, отображающие пользовательский путь или порядок действий, который проходит пользователь при использовании продукта. 00:42 Speaker A User Flow визуально отображает каждый шаг, который проходит пользователь от точки входа до достижения конкретной цели. 00:47 Speaker A Блок-схема всегда начинается с точки входа в продукт, например, это главная страница сайта или карточка товара, и заканчивается действием или результатом этого действия. 00:58 Speaker A Например, регистрация на сайте или оформление заказа. 01:01 Speaker A А визуальное представление пользовательского сценария позволяет оценивать и оптимизировать пользовательский опыт, ну, то бишь UX. 01:10 Speaker A Уменьшать количество шагов для выполнения задачи и повышать конверсию достижения той или иной цели на данном сайте, на данном проекте. 01:18 Speaker A Итогом каждого User Flow является достижение конкретной цели. 01:24 Speaker A Схема помогает понять, насколько логично и корректно завершаются процессы. 01:31 Speaker A Например, поиск, там, или создание учётной записи, покупка, скачивание, там, загрузка файла и так далее. 01:37 Speaker A Каждый элемент блок-схемы в User Flow имеет свою форму, и каждая форма означает определённый процесс. 01:43 Speaker A Первый элемент - это круг, он обозначает всегда, ну, начало либо конец действия. 01:49 Speaker A Используется для указания, как бы, ну, начала и конца пользовательского сценария. 01:52 Speaker A Второй элемент - это ромб, то есть принятие решения. 01:55 Speaker A Ромб указывает на моменты принятия решения, где у пользователя есть выбор. 02:02 Speaker A Например, да или нет, зарегистрироваться или пройти без регистрации и так далее. 02:06 Speaker A И в зависимости от того, какое решение примет пользователь, определяется его следующий шаг. 02:10 Speaker A Третье - это прямоугольник, это действие или процесс. 02:13 Speaker A Прямоугольники указывают на действия, которые пользователь должен выполнить. 02:19 Speaker A Например, войти, открыть корзину или отправить сообщение. 02:22 Speaker A И завершающее - это стрелки или узел, то есть направление. 02:25 Speaker A Стрелки указывают направление пользователя от шага к шагу, стрелки могут переходить как последовательно, перескакивать или возвращаться назад на основе пользовательских решений. 02:34 Speaker A Зачем нужен User Flow? 02:36 Speaker A Изучение пользовательского сценария сайта или мобильного приложения будет полезно независимо от того, разрабатывается новый продукт или дорабатывается старый. 02:43 Speaker A А вот почему. 02:44 Speaker A Первое, User Flow помогает создать удобный интерфейс. 02:47 Speaker A Уже на стадии блок-схем команда видит, как тот или иной сценарий приводит к цели пользователя или наоборот, путает его. 02:53 Speaker A Разработчики оценивают эффективность создаваемого интерфейса с точки зрения простоты, удобства передвижения по продукту. 03:00 Speaker A И важным аспектом является то, что User Flow заставляет дизайнера, ну, и в целом всю команду разработчиков, разрабатывать, ну, создавать интерфейс продукта с точки зрения пользователя. 03:07 Speaker A Ну, соответственно, всё это приводит к более интуитивно понятному продукту, который в конечном счёте удовлетворяет клиентов. 03:13 Speaker A А второе - помогают улучшить существующие интерфейсы. 03:16 Speaker A Пользовательский сценарий позволяет оценить, как пользователь перемещается уже по какому-то существующему интерфейсу. 03:24 Speaker A Соответственно, выстроить воронку и замерять конверсию на каждом из шагов, ну, данного проекта. 03:30 Speaker A Это позволит сформировать гипотезы, там, где и почему происходит, например, просадка. 03:34 Speaker A И что нужно, чтобы это исправить. 03:36 Speaker A Ну, например, это уменьшить или увеличить количество информации на странице, изменить количество полей, там, на формах, которые есть на проекте. 03:43 Speaker A Изменить навигацию, сократить количество шагов и так далее. 03:46 Speaker A И вот уже на базе этих гипотез можно проводить АБ-тесты и вносить изменения в сам сценарий. 03:51 Speaker A Третье - позволяет продемонстрировать структуру проекта. 03:54 Speaker A User Flow даёт представление о продукте в наиболее простой и эффективной форме. 03:59 Speaker A Можно использовать User Flow в презентации проекта, там, команде, партнёрам, инвесторам, ну, как дополнительный способ объяснить пользу вашего продукта. 04:07 Speaker A Ну, с точки зрения пользователя. 04:10 Speaker A И пути этого пользователя, как он с ним будет взаимодействовать. 04:12 Speaker A Четвёртое - позволяет ускорить дальнейшую разработку. 04:15 Speaker A Когда разработчики начнут создание, визуальное, ну, отображение пути пользователя поможет в понимании вообще всего проекта и ускорит дальнейшее проектирование и разработку. 04:23 Speaker A А также снизит вероятность переделок и доработок. 04:26 Speaker A Как создать User Flow? 04:28 Speaker A Разберём шаги. 04:29 Speaker A Первое - нужно исследовать пользователей. 04:31 Speaker A Перед началом создания User Flow нужно, естественно, знать своих клиентов. 04:36 Speaker A Для этого проводятся исследования, там, которые дают понимание, откуда будут приходить клиенты. 04:43 Speaker A Какие у них цели, какие задачи, какую услугу, там, и какой уровень сервиса они хотят. 04:47 Speaker A Ну, и так далее. 04:48 Speaker A Всё это нужно для того, чтобы знать, какие действия будет предпринимать пользователь. 04:54 Speaker A Там, чтобы посетить именно вот этот сайт. 04:57 Speaker A Как он будет использовать сам этот продукт. 04:59 Speaker A Если это понимание уже есть, то можно сразу переходить к следующему шагу. 05:02 Speaker A Шаг номер два - расписать цели и пути достижения. 05:05 Speaker A То есть нужно сформировать цели, которые есть у пользователя. 05:09 Speaker A И шаги по достижению данных целей. 05:11 Speaker A Простой пример. 05:13 Speaker A Цель - купить товар в интернет-магазине. 05:15 Speaker A Соответственно, шаги - это вход на сайт, переход в каталог, переход в карточку товара, а добавление в корзину. 05:22 Speaker A Переход в корзину, оформление заказа, оплата и выход. 05:24 Speaker A И, соответственно, определив вот эти конечные цели для User Flow, можно подстраивать этот путь для создания лучшего пользовательского опыта. 05:31 Speaker A Убирать или добавлять новые шаги, какие-то новые условия. 05:33 Speaker A И шаг номер три по созданию - это визуализация целей и вот этих путей уже в User Flow. 05:37 Speaker A А закончив первый и второй шаг, можно приступить уже к непосредственно к проектированию. 05:40 Speaker A А для одной важной цели всегда создаётся одна вот эта блок-схема. 05:45 Speaker A Если целей несколько, то создаётся несколько блок-схем, просто каждая из них называется под конкретную цель. 05:50 Speaker A Например, регистрация на сайте, покупка товара или написание отзыва. 05:53 Speaker A Когда необходимо создавать User Flow? 05:55 Speaker A User Flow необходимо создавать на самой ранней стадии разработки проекта. 06:00 Speaker A Сразу после того, как вы определились с идеей и провели исследования рынка и пользователей. 06:05 Speaker A Очень важно разработать пользовательский сценарий до начала работ по прототипированию и дизайну интерфейсов. 06:12 Speaker A Иначе высок риск создать проблемные области, лишние шаги, лишние экраны, которые будут только усложнять путь пользователя. 06:18 Speaker A Разберём инструменты для создания User Flow. 06:20 Speaker A Ввиду того, что сам по себе User Flow - это достаточно простой инструмент, ну, то есть простая штука в создании. 06:26 Speaker A Выбор инструмента не является критичным вопросом. 06:29 Speaker A User Flow можно составить хоть на бумаге, там, на маркерной доске. 06:32 Speaker A Но, конечно, для удобства редактирования и доступа лучше использовать специализированные программы. 06:38 Speaker A К счастью, их огромное множество. 06:39 Speaker A Лично я предпочитаю FigJam, это внутренний инструмент Figma. 06:42 Speaker A Мне нравится работать сразу в одном окне с User Flow и с прототипом. 06:47 Speaker A Ну, вот так это выглядит. 06:48 Speaker A Стоит ещё упомянуть такие приложения, как Overflow, Axure, XMind и Miro. 06:52 Speaker A По ним есть куча туториалов в интернете, можно быстро понять, как работать в той или иной программе. 06:56 Speaker A Итак, разберём, давайте, пример конкретного User Flow. 06:59 Speaker A Вот пример пользовательского сценария нашего проекта Unicorn Base. 07:04 Speaker A Цель клиента - получить доступ к базе контактов. 07:07 Speaker A Путь состоит из вот таких шагов. 07:09 Speaker A Первое - это вход на сайт. 07:11 Speaker A Дальше - это подбор в каталоге, фильтрация. 07:13 Speaker A Дальше - выбор карточки. 07:15 Speaker A Далее мы проверяем авторизацию. 07:18 Speaker A Если не авторизован, он регистрируется. 07:20 Speaker A Точнее, если не зарегистрирован, он регистрируется. 07:22 Speaker A Дальше идёт проверка наличия доступа к контактам. 07:24 Speaker A Если нет, идёт описание тарифа. 07:26 Speaker A Дальше идёт оплата тарифа. 07:28 Speaker A Далее идёт выдача доступа и полный доступ к каталогу. 07:31 Speaker A Вот такой путь. 07:32 Speaker A Подведём итог. 07:34 Speaker A А, начиная создание нового проекта с момента идеи и исследования клиента, но ещё до момента начала разработки прототипа и дизайн-макетов, важно создать пользовательский путь. 07:44 Speaker A А User Flow является основой для требований к структуре, по контенту проекта, логике переходов между страницами и окнами. 07:52 Speaker A А, понимая потребности пользователей, команда гораздо вероятнее сделает успешный продукт, который будет удовлетворять этих самых пользователей. 07:59 Speaker A Если вы хотите создать пользовательский путь самостоятельно, следуйте вот руководству этому и пробуйте. 08:03 Speaker A А также я могу помочь вам с разработкой User Flow в рамках услуги прототипирования. 08:10 Speaker A А перейдите на сайт по ссылке в описании и ознакомьтесь с этой информацией более подробно. 08:14 Speaker A На этом всё. 08:16 Speaker A Тему мы подробно разобрали, если у вас остались вопросы, переходите в мой Telegram-канал. 08:20 Speaker A Там мы можем это обсудить более подробно. 08:22 Speaker A Подписывайтесь на YouTube-канал. 08:24 Speaker A Пока. Topics: User Flow пользовательский сценарий UX разработка IT-продуктов оптимизация интерфейса блок-схема конверсия прототипирование исследование пользователей инструменты для User Flow Учить по этому видео - [Карточки по этому видео](https://sozai.app/ru/tools/ai-flashcard-generator/?from=transcript&id=13923) - [Тест по этому видео](https://sozai.app/ru/tools/quiz-generator/?from=transcript&id=13923) Бесплатно, составлено ИИ по этой расшифровке. Без регистрации. --- This is the markdown twin of https://sozai.app/transcript/user-flow-what-how-create-examples/ — the same content, without the markup. Published by SozAI (https://sozai.app). Reuse and quotation are allowed with attribution and a link back. Machine-readable index: https://sozai.app/llms.txt · data API: https://sozai.app/api/