Чтобы понять, какой визуал будет у будущего продукта, дизайнеру достаточно нескольких страниц и пары картинок. Такой набросок называют дизайн-концепцией и при ее разработке необходимо соблюдать определенные правила.
Что такое дизайн-концепция
Под дизайн-концепцией понимают обобщенный образ конкретного программного решения. Он должен соответствовать стилистическим и визуальным требованиям, обозначенным заказчиком в брифе. Проще говоря, визуальная концепция отражает вектор дальнейшего развития, согласно которому будет разрабатываться проект. Дизайн-концепция позволяет решить набор определенных задач:
- демонстрация ключевых визуальных особенностей;
- оперативное сопоставление и согласование направлений;
- формирование образа программного продукта в глазах пользователей;
- детализация ожидаемых результатов и исключение разночтений в процессе реализации проекта;
- экономия ресурсов, как со стороны заказчика, так и со стороны исполнителя.
Для чего нужна дизайн-концепция
Дизайн-концепция во многом похожа на демо-версию программного продукта. Набор определенных референсов и отдельных веб-страниц позволяет понять общую стилистику визуальной составляющей всего продукта. К примеру, дизайн-концепция для интернет-магазина подразумевает макет каталога, шаблон главной страницы и товарной карточки.
С помощью дизайн концепции можно визуализировать следующие элементы:
- типографика – все что связано со шрифтами, их размер, способ начертания и т.д.;
- цветовая схема – определяет главные и дополнительный цвета и оттенки;
- айдентика – элементы, характерные для конкретного бренда (логотип, цветовая палитра);
- стилистика иконок и изображений – могут быть плоскими, объемными или монохромными;
- тип сетки – определяет структуру расположения элементов на странице;
- референсы – примеры, задающие направление дальнейшего развития проекта;
- наиболее важные страницы – глядя на них, заказчик может сформировать целостное представление о будущем продукте.
Для некоторых продуктов не нужно разрабатывать дизайн-концепцию, например, если речь идет о лендинге, создаваемом в качестве дополнения к главному ресурсу. В этом случае, основной сайт должен обладать собственным брендбуком и UI-китом, откуда дизайнер будет брать всю необходимую для работы информацию.
При работе над проектом, дизайнер может руководствоваться готовыми схемами, или создавать собственные гайдлайны. Это зависит от специализации выбранного направления, а также уровня профессиональных компетенций.
Создание дизайн-концепции
На этапе разработки дизайн-концепции, в проекте принимают участие сами заказчики и команда специалистов, куда входят дизайнеры, маркетологи и продакт-менеджер. Создание проекта происходит в несколько этапов. Первый из них предполагает заполнение брифа, в котором собирается информация о заказчике, его требования и пожелания относительно будущего продукта. Кроме этого важно провести аудит уже существующего продукта, выявить его сильные и слабые стороны.
Если у компании есть готовый брендбук, его также необходимо проанализировать. При необходимости, это поможет скорректировать цели и задачи, сделав продукт более ориентированным на целевую аудиторию. Не стоит забывать про стилистику веб-ресурса и его архитектуру. Особенно это актуально в случае проведения редизайна. Заказчик решит, какие концепты можно оставить, а какие следует заменить.
На втором этапе происходит изучение контента. Специалисты исследуют рынок, анализируют решения конкурентов, изучают продукты из смежных сфер. Таким образом, отбираются визуальные приемы, актуальные для конкретной ниши. Чтобы оставаться в курсе последних тенденций, необходимо посещать тематические сайты, читать статьи в профильных изданиях и каналах в социальных сетях.
Перед тем как приступать к работе, необходимо собрать набор референсов и сформировать мудборд. Мудборд представляет собой визуальную основу проекта. Взглянув на нее, сразу становится понятно, как будет выглядеть конечный вариант приложения или сайта. На этом этапе подбираются иллюстрации, цвета и типографика, которые будут отражать ключевую идею будущего проекта. Собранный материал должен помогать дизайнеру, и не противоречить требованиям и пожеланиям клиента.
Референсы и мудборд необходимо согласовать с заказчиком, чтобы убедиться в правильности выбранного направления. При необходимости, вектор развития можно скорректировать. На данном этапе это сделать проще всего. Если у клиента нет замечаний, то начинается проработка структуры проекта. На основе собранных материалов дизайнеры разрабатывают визуальную составляющую программного продукта.
Как правило, для детальной проработки выбирается несколько основных страниц. Они создаются с учетом стилевых особенностей, колористики и типографики. К примеру, для приложения доставки еды, это будут страницы с каталогом, карточкой заведения и личным кабинетом. Самое главное не углубляться в излишнюю детализацию. Отразить нужно только ключевые моменты, которые помогают сформировать общее представление о продукте. Иногда для заказчика готовятся сразу несколько концепций. В этом случае они должны максимально отличаться друг от друга.
На завершающем этапе дизайн-концепция презентуется заказчику. Здесь специалистам важно получить обратную связь, чтобы внести необходимые правки и получить готовый вариант визуальной концепции. После того, как она будет готова и согласована, разработчики приступают к созданию самого продукта. Они разрабатывают пользовательские сценарии, создают прототипы и макеты, пишут программный код.
При создании дизайн-концепций пользуются графическими редакторами (Adobe Photoshop, Figma), онлайн-сервисами и платформами (Dribbble, Pinterest), а также досками для командной работы (FigJam или Miro).
Особенности, которые нужно учитывать при создании дизайн-концепции
Самое главное – мыслить широко. Не стоит заострять внимание на мелких деталях. Куда важнее – сосредоточиться на решении ключевой задачи, а именно на качественном визуальном представлении программного продукта. Детализация происходит уже после согласования концепции, а точнее на этапе постраничной проработки пользовательского интерфейса.
Именно об удобстве пользователей должны думать создатели проекта. Если сайт красивый, но им неудобно пользоваться, клиенты предпочтут более качественный аналог и уйдут к конкурентам. Чтобы этого не происходило, стоит отказаться от сложных и нагруженных графических решений.
Проект должен представлять собой качественный, сбалансированный продукт, в котором все элементы гармонично сочетаются между собой. Это касается всех основных элементов: кнопок, шрифтов, цветов и т.д. Чтобы достичь поставленного результата, рекомендуется собирать как можно больше разных по стилистике мудбордов. Для заказчика это возможность выбрать наиболее подходящий вариант.
Специалисты рекомендуют создавать сразу несколько разных идей. Останавливаться только на одной – нерациональный подход. Гораздо лучше равномерно развивать несколько направлений. Имея несколько концептов, намного проще создать один, который будет отвечать всем заявленным требованиям.
Отдельное внимание стоит уделить взаимодействию с заказчиком. Исполнитель – это, прежде всего, союзник, который также нацелен на получение максимально качественного результата. Решить поставленную задачу – общая цель заказчика и дизайн-команды. Чем более согласованными будут их действия, тем лучше будет итоговый результат.