Почему это важно?

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

Исследование. Собираем информацию о бизнесе клиента и его пользователях. Как зарабатывает бизнес? Откуда приходят клиенты? Какие боли клиентов этот бизнес закрывает? И самое важное: как это делают их конкуренты? Вот тебе простой инструментарий для решения этих задач:

  • Similar Web - хорошая тулза для поверхностного анализа сайта клиента и конкурентов. Узнаешь, откуда приходит трафик, какие публикации/ страницы работают лучше всего.
  • Google Analytics клиентского сайта. Не стесняйся, запрашивай информацию. Здесь ты сможешь отследить поведение клиентов, что их привлекает, а что отталкивает.
  • Google Trends - для понимания того, что сейчас происходит в индустрии. Например, ты имеешь дело с магазином одежды. Введи пару релевантных тегов в поиск, посмотри какие гео реагируют активнее, что люди ищут дополнительно. Это большое поле для новых инсайтов в твоей работе. Здесь мы пишем, как составить аватар пользователя.

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

Создание мудборда. Здесь создается «душа» проекта. Ты собираешь подходящие шрифты, цвета, изображения и формы. Их тоже лучше создавать несколько, затем сопоставлять с подходящей идеей.

Создание user story. На этом этапе строится логика сайта. Когда ты хорошо понимаешь, что именно ищет клиент, ты легко сможешь отразить это в своем прототипе.

User Story создается с помощью вот такой формулы:

Пользователь хочет <что-то получить> для того, чтобы <цель, мотив пользователя>.

Например, в магазине одежды девушка хочет найти спортивный костюм.

  1. Сначала она будет рассматривать разные варианты онлайн-магазинов.
  2. Девушка ищет подходящую модель спортивного костюма.
  3. Теперь ей нужна информация о конкретной модели.
  4. После этого она захочет сравнить различные модели по следующим факторам: цена/качество/ производитель.
  5. Девушка обязательно обратит внимание на отзывы, чтобы убедиться в своем выборе.
  6. Потом узнает условия заказа и доставки.
  7. Девушка совершает целевое действие: отправляет товар в корзину и оформляет покупку.

На основе примера, мы получаем следующую рубрикацию:
1 — Каталог магазина
2 — Раздел со спортивными костюмами
3 — Карточка товара
4 — О нас
5 — Отзывы
6 — Доставка и оплата
7 — Корзина

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

Прототип+мудборд. А теперь время объединить две составляющие. На выходе ты получаешь готовый дизайн-макет. Здесь важно подготовить все возможные версии интерфейса для передачи клиенту и разработчикам.

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

Презентация проекта и «упаковка« под портфолио. Конечно, если ты не подписал с клиентом NDA)

И еще немного:

  1. Исследование всегда начинается с опроса клиента. Бриф - это неплохо, личное интервью - намного лучше.
  2. Создавай аватары пользователей, чтобы понять, какие группы целевой аудитории будут взаимодействовать с твоим дизайном.
  3. User Story поможет тебе избежать ошибок в создании прототипа.
  4. Создавай текстовый прототип только в том случае, если ты получаешь проект « с нуля».
  5. Текстовый прототип также подлежит апруву со стороны клиента. Утвердили его, и можете двигаться дальше.
  6. Обращай внимание клиента на то, что текстовый прототип - это отдельный процесс и оплачивается он отдельно.
  7. Дай понять клиенту необходимость каждого процесса: исследование/ мудборд/ текстовый прототип. Все это - основа хорошего дизайна.

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

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

Зарегистрироваться