—

Как работать дизайнеру, если в задаче нет конкретики

Бизнес и эффективность

Дизайн

31 августа 2020

Содержание

***
Вызов: отсутствие ограничений в задаче 
Разбираюсь в задаче
Шаг 1. Если нет ограничений, придумай их
Шаг 2. Разрабатываю стилистическую концепцию
Шаг 3. Разрабатываю основных персонажей
Шаг 4. Приземляю задачу на конкретные кейсы 
Шаг 5. А что, если конструктор автоматизировать?
Итого

Можно поспорить о том, в каком случае работать легче — когда заказчик выдвигает жесткие требования к дизайнерским решениям или когда полностью полагается на решения и вкус дизайнера. В обеих ситуациях все может пойти хорошо или не очень. И дизайнер должен уметь справляться с обеими из этих задач.

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

***

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

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

Мне нравится прием с иллюстрациями в вебе.

Хотя иллюстрации хороши только в тех проектах, где они уместны, и в целом веб-иллюстрации не самый частый кейс. Зато они добавляют душевности и всегда позволяет сделать индивидуальный дизайн даже при максимально типичной структуре сайта. А еще повышает идентичность, узнаваемость бренда и помогает развивать экосистему IT-сервисов компании, если обернуть иллюстрации в дизайн-систему.

Например, использовали иллюстрации на сайте Областной детской клинической больницы

Еще один пример — лендинг для Детского онлайн-лагеря

Вызов: отсутствие ограничений в задаче

При получении задания с большим количеством ограничений, бывает действительно нелегко найти решение, подходящее под все требования. Я воспринимаю это как челлендж и проверку своих профессиональных навыков: «А как сделать классную вещь даже в таких условиях?».

Но иногда сложнее обратная ситуация: когда ограничений вообще нет, как в случае с задачей на иллюстрации.

Итак, что именно должно быть в наборе иллюстраций, как это должно выглядеть — все было отдано на моё решение.

На первый взгляд кажется, это идеальные условия, дающие дизайнеру полную свободу в выборе и действиях. А на деле такие задачи потребуют в разы больше усилий на этапе концепции, ведь возникает слишком много путей решения. Кроме того есть риск попасть в ситуацию, когда дизайнер раз за разом получает от заказчика комментарии в духе «Сделайте мне что-нибудь. Но не это».

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

Разбираюсь в задаче

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

На первом этапе создания веб-дизайна выделили такие ключевые принципы:

Стилистика и цветовое решение должны перекликаться с логотипом компании
Нужно заложить возможность масштабировать пак иллюстраций и дополнять его без потери стилистики
Нужна возможность менять компоновку изображений из существующих элементов

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

Шаг 1. Если нет ограничений, придумай их

Цель и задачи проекта я понимала. И все-таки этого было недостаточно, чтобы придумать концепцию: слишком много вариантов для решения задачи.

Казалось бы, зачем самой себе ставить какие-либо ограничения в работе над проектом? Но на деле такие ограничения могут ускорить работу, позволив сосредоточиться и отсечь огромное количество вариантов исполнения. Кроме того, стоит выяснить как можно больше «подсказок» до начала работы, задав несколько вопросов заказчику.

Итак, какие ограничения и подсказки у меня есть.

Размер иллюстраций — неясно, в каком размере они будут использоваться.

Решение: делаю в векторной графике для простоты масштабирования.

Количество не ограничивается.

Решение: создаю не законченные сюжеты, а отдельных персонажей и объекты, которые можно будет комбинировать друг с другом.

Содержание: что именно рисовать

По статистике, людям более интересны люди, а не статичные объекты. Значит, нужны персонажи. Так как иллюстрации для блога — тематика должна быть связана с агентством.

Решение: Персонажами иллюстраций будут специалисты агентства: дизайнеры, разработчики, менеджеры. С них и начну.

Цвета.

Берем из логотипа. Готово.

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

Решаю «добавить» их себе сама и выбираю линейную стилистику с небольшим количеством пятен в духе современных трендов. Это позволит изображениям не так перетягивать на себя внимание от текста, как это могло бы быть с залитыми иллюстрациями, да и в целом сделает их менее грузными.

Учитывая, что в основном иллюстрации будут использоваться в вебе, это показалось мне верным стилистическим решением.

Шаг 2. Разрабатываю стилистическую концепцию

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

Отрисовываю один из эскизных вариантов с персонажем. Начать решила, конечно, с персонажа-дизайнера.

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

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

Эту стилизацию и исполнение утвердила с коллегами из отдела маркетинга. И далее перешла к отрисовке остальных персонажей и обязательных элементов.

Шаг 3. Разрабатываю основных персонажей

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

Я задала стандарты в пропорциях и расположении элементов целого, чтобы потом легче было дорисовывать новые и новые элементы. Так появились менеджер, заказчик, разработчик.

Когда все персонажи из придуманного мной «необходимого списка» были отрисованы, нужно было делать еще какие-то элементы, но.. Но какие?

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

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

Шаг 4. Приземляю задачу на конкретные кейсы

Раз иллюстрации будут использовать в нашем блоге, то за конкретными ситуациями использования отправилась туда.

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

После этого этапа кроме персонажей появились объекты вроде интерфейсов и офисных предметов. А также примеры использования элементов.

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

Уже на этом этапе отдел маркетинга смог самостоятельно использовать конструктор иллюстраций для оформления статей и постов.

Но выявились некоторые проблемы:

Собирать иллюстрации вручную все еще было долго и сложно.
Элементов было недостаточно, очень быстро готовые иллюстрации стали походить одна на другую. Хотелось большей вариативности.
Добавление новых элементов все равно требуовало привлечения дизайнеров.

Казалось, что ходим по кругу.

Шаг 5. А что, если конструктор автоматизировать?

Я работаю в Figma, а в этом редакторе есть возможность настроить автоматическую подмену элементов с помощью компонентов. Отсюда родилась идея сделать конструктор, в котором можно не просто собрать иллюстрацию из персонажей и объектов, а конструировать самих персонажей. Причем сделать это в несколько кликов.

Задав определенные константы в положении головы или ног, я заложила возможность выбирать из общей базы различные детали персонажа начиная с бровей и заканчивая ботинками.

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

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

Итого

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

В случае с иллюстрациями я в итоге пришла к тому, что формировала задачу и ограничения себе сама.

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

Получается, неважно, есть ли жесткие требования к дизайну или ограничений нет. В любом случае нужно обсуждать с заказчиком, что он хочет.

Если ограничений нет, то дизайнеру нужно самостоятельно позадавать вопросы, уловить подводные камни, выяснить максимум информации и сформировать полное представление о проекте.
Если заказчик сразу сообщает требования, обсудить их, узнать, что за ними стоит. Возможно, некоторые ограничения не обязательны или эту задачу можно решить более эффективно.