Проектирование сайта School of Visual Communication
В этой статье на примере реального кейса хочу рассказать как провести пользовательские исследования и что это дает дизайнеру
Постановка задачи, определение бизнес-требований
Несколько лет назад я сотрудничал со школой дизайна School of Visual Communication (далее Школа) при поддержке которой разработал курс “Проектирование опыта взаимодействия” и читал лекции по этому курсу. Кроме того я предложил свои услуги по разработке нового сайта для Школы. Собственно, в рамках этой задачи обтачивались инструменты и методы о которых я рассказывал на лекциях.
После обсуждения были определены основные цели и потребности Школы, то есть это те критерии по которым должен оцениваться конечный результат. Эти цели формируют набор бизнес-требований к будущему продукту и определяют основной функционал.
Первостепенные цели и потребности школы
- Продажа учебных курсов.
- Донесение информации о школе (общая информация о школе; контактная информация (телефоны, адрес, карта)).
- Получение обратной связи (письма; отзывы).
- Представление преподавателей школы.
- Информирование об услугах (курсы; мастер-классы; семинары).
- Информирование о событиях внутри школы (новости; анонсы событий и мероприятий; отчёты).
- Информирование о событиях в сфере дизайна (новости; анонсы событий и мероприятий).
- Рассылка новостей (материалов).
- Привлечение новых преподавателей.
- Установление партнерских связей.
- Автоматизация заявок на обучение и участие в мероприятиях.
Целевая аудитория, определение пользовательских требований
Школа так же предоставила следующую информацию об основной целевой аудитории: люди обоих полов от 18-ти до, примерно, 40-ка лет желающие получить профильное образование и работать в сфере дизайна. Кроме того была предоставлена презентация с чуть более подробной информацией о ЦА.
Как вы понимаете, этой информации мало для того что бы понять что нужно пользователям на сайте и в каком виде, то есть сформиовать пользовательские требования. Нам нужна более подробная информация непосредственно от представителей ЦА. Было принято решение провести онлайн-опрос разослав всем студентам (из базы данных Школы) письмо с сылкой на форму с вопросами. Создать и провести опрос достаточно легко с помощью простого инструмента Google Формы. Для начала я составил список вопросов, который должен был помочь мне лучше понять пользователей и их потребности, и разбил их по темам:
Цели, ожидания
- Каковы ваши цели обучения?
- Почему вы выбрали именно нашу школу?
- Что, по вашему мнению, даст вам обучение в нашей школе, чего вы ожидаете?
- Опишите кем вы видите себя через 5 лет.
Обучение
- Какова, по вашему мнению, должна быть оптимальная длительность одного курса?
- Какое время обучения наиболее оптимально для вас и почему (утро, день, вечер)?
- В каких дополнительных мероприятиях, в рамках обучения, вы заинтересованы?
- Какие дополнительные материалы и инструменты, в рамках обучения, вам нужны?
- Опишите идеальный для вас процесс обучения (коротко).
Информация, принятие решений
- Какими критериями вы руководствуетесь при выборе школы/курсов?
- Какая информация о школе/курсах наиболее важна?
- Какая информаци о курсе помогает при принятии решения о записи на курс?
- Какая информация о курсе наиболее важна?
Проблемы
- С какими проблемамы вы столкнулись при поиске информации о школе/курсе?
- С какими проблемами вы столкнулись при выборе школы?
- С какими проблемами вы столкнулись при выборе курса?
- С какими проблемами вы сталкиваетесь в процессе обучения?
Условия, контекст
- В каких условиях вы чаще всего ищите и читаете информацию (дома, на работе и т. д.)?
- Какие устройства используете (персональный компьютер, ноутбук, телефон и т. д.)?
- Опишите ваш обычный рабочий день (коротко).
Все ответы сохраняются в виде таблицы и с ними достаточно удобно работать. Кстати, благодаря грамотно составленным вопросам выплыло много интересной информации о том как можно сделать процесс обучения более удобным и продуктивным.
Письмо получили примерно 90 студентов но только 10 из них дали ответы (о причинах ниже). Но и этих даных хватило что бы полученную информацию осмыслить и оформить ее в более удобном для восприятия виде, то есть описать персонажи пользователей. Я выделил три основных типа пользователей и описал их проблемы, цели и потребности.
Позже я понял почему так мало студентов ответили: вопросов было слишком много и не все захотели тратить свое время. Нужно было разбить базу студентов на несколько групп и каждой группе задать 3–4 простых вопроса, таким образом мы бы получили больше ответов. (Этот опыт я учел при проведении исследований в рамках задания по разработке прототипа итерфейса для автоматов продажи жетонов в метро.)
Вообще, ходит много споров о том, нужно ли описывать будущих пользователей или нет. Как бы там ни было но в данном проекте персонажи сыграли ключевую роль в процессе определения основных требований к контенту и функционалу сайта. Мне лично информацию оформленную в таком виде воспринимать удобнее, да и клиенту она более понятна.
Технические требования, функционал и информационое наполнение
Теперь, когда у нас есть бизнес- и пользовательские требования, можно переходить к выяснению всех технических требований и детализации функционалного и информационного наполнения. Для этого хорошо подходят программа XMind и мой любимый Метод скоростной фиксации сценариев.
Первым делом на основе бизнес-требований и информации из профилей персонажей выписываем все действия которые должен совершать ползователь на сайте в виде микро-сценариев и группируем их в сценарии.
Основываясь на сценариях можно составить предварительную структуру сайта.
Детализируем структуру и описываем, что должно быть на каждой странице.
Мне удобнее разделять контент и действия. Иногда можно выделять ключевые действия что бы понимать во время прототипирования какой элемент должен быть главным на странице.
Ну вот теперь все понятно и можно приступать к прототипированию. Важно еще помнить, что в процессе прототипирования могут приходить новые идеи и стуктура, с описанием функционала и контента, может дорабатываться, это нормальный рабочий процесс.
Прототипирование
После всей проведенной работы работа над прототипом идет легко и просто, ты уже не тратишь энергию на выяснение того что должно быть на каждой странице а думаешь как сделать простой и удобной работу с контентом. Для отрисовки страниц использовался Adobe Illustrator. В данном случае я не прописывал пользовательские сценарии а продумывал их в процессе прототипирования.
Я проработал прототипы основных уникальных страниц а так же сделал наброски графического оформления сайта.
Заключение
В этой статье мне хотелось подчеркнуть важность исследования пользователей и сказать о том, что сделать это можно практически всегда не прилагая больших усилий. Удачи.
Хочешь изучить UX/UI Design и научиться проектировать сайты и приложения?
Приходи на онлайн-курс, который помогает изучить методику и прямо во время обучения сделать проект для портфолио. Зписывайся на курс по ссылке 👉 https://hyperschool-digital-product-design.webflow.io/