Найти тему

Дизайн-концепция: с чего начать и как сберечь нервы

Оглавление

Если дизайнер делает классный продукт, который никому не нужен, значит нет общей идеи для проекта.

Петя придумал дизайн приложения магазина палаток в Хабаровске. Пользователь скачивает его, выбирает товар, но есть проблема — купить палатки в этом магазине можно только оффлайн. Приложение бесполезно. Заказчик негодует, что нет продаж, а дизайнер переживает, что работа прошла впустую.

Чтобы избежать гнева клиентов и личного разочарования, мы расскажем, как составить дизайн-концепцию и создавать продукт, полезный пользователю.

1 — выяснить задачу проекта и потребности целевой аудитории

Для этого проведи интервью с заказчиком по методу 6 вопросов:

1.Кто? Что?

Любители активного отдыха. Интернет-магазин палаток.

2. Сколько?

1 магазин.

3. Где?

Склад в Хабаровске.

4. Когда?

Заказать палатку можно всегда. Упакуют с 10:00 до 19:00 по хабаровскому времени. Доставка от 3 дней в зависимости от расстояния.

5. Как?

Палатки изготавливают из полиэстера, который защитит тебя от дождя и ветра.

6. Зачем?

Чтобы во время путешествия не привязываться к постоянному месту жилья и при желании менять маршрут.

Спроси заказчика, что он хочет: увеличить средний чек или повысить охват аудитории.

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

Вывод: знаешь задачи и потребности ЦА — готов к следующему этапу.

2 — определить тип интерфейса

Когда поймешь потребности ЦА, определи тип интерфейса, которым удобно пользоваться:

1. Монопольные — для продуктов, которыми люди пользуются больше 5 минут. Занимают весь экран, нет ярких цветов, имеют логичную структуру. Примеры: карточки товаров в интернет-магазинах, графические редакторы, email.

-2
-3

2. Временные — используют для одного целевого действия, например, «найти» или «выбрать». Цель пользователя — обработать информацию в короткий срок. Фокус внимания на приоритетных функциях, информация упрощена.

Пример временного интерфейса — лаунчеры. Пользователь 5-10 секунд выбирает, какое приложение откроет на смартфоне.

-4

3. Фоновые — выдают результаты действий (пуш-уведомления о сообщениях, отчет об ошибках интернет-соединения). Пользователь видит информацию, которая появляется поверх основного интерфейса. Занимает только часть экрана. Например, отчет антивируса:

-5

Петя резюмирует интервью с заказчиком и покупателями:

— У палатки от 20 характеристик, которые пользователи хотят видеть в одном месте;
— В карточке товара обязательны видеообзор и фотографии (7 штук);
— Покупатель выбирает палатку 5-10 минут и больше.

Результат: Петя выбрал монопольный интерфейс.

Вывод: потребности ЦА определяют тип интерфейса: монопольный (для длительной работы), временный (для выполнения одного действия), фоновый (для отчета о результате).

3 — определить подход в визуальной стилистике

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

1. Информационный. Цель — показать смысл, донести контент. Красивые картинки и психология цвета второстепенны. Главное — заставить пользователя выполнить действие. Используется в компьютерных приложениях, интерфейсах, на лендингах:

-6

2. Эмоциональный. Цель — вызвать определенные чувства у пользователя. Логика может быть нарушена, акцент на цвет и форму, главное — получить эмоциональный контакт у пользователя.

Где применять: портфолио, наружная реклама, обложки для видеороликов.

-7

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

Вывод: если пользователь должен выполнить действие, выбирай информационный подход, если нужно вызвать чувства — эмоциональный.

4 — собрать мудборд

Выполнил 3 шага — вперед на behance или dribble за референсами.

Петя собрал образы, цвет, шрифты, геометрию формы, композицию и получил мудборд, с помощью которого создаст дизайн-макет интернет-магазина палаток.

Вывод: правильно соберешь мудборд — быстро создашь дизайн-макет с минимум правок.

Инструкция:

  • Выясни, для чего нужен продукт и кто будет им пользоваться
  • Определи тип интерфейса (монопольный или временный)
  • Выбери визуальный подход (информационный или эмоциональный)
  • Собери мудборд
  • Работай над макетом: дизайн-концепция готова

Школа веб-дизайна WDI