Как создать логотип: 3 примера

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

Есть полезный инструмент на старте карьеры, ведите дневник прогресса. Например, в группу Telegram добавьте коллег и друзей. Публикуйте работы в этой группе и других соцсетях. Это поможет получить обратную связь от людей, которые в большей или меньшей степени разбираются в дизайне. Посмотреть на проект глазами других людей, потенциальных пользователей вашим продуктом. Еще это отличная мотивация и стимул не останавливаться. И не расстраивайтесь при критике, все когда-то начинали с малого и помним, it's just a bad day, not a bad life.

В какой программе создать логотип самому бесплатно? 

Существуют много разного ПО, в нашем случае выбор сделаем в пользу Figma. Платформа строится на облачных технологиях, можно подключить дополнительных пользователей и работать совместно над одним проектом. Ресурс постоянно развивается, выходят новые дополнения и плагины. Если самостоятельно не хотите использовать графические редакторы, воспользуйтесь сервисами по созданию лого, например Brandmark. 

Перейдем к главному. С чего подойти и как придумать логотип? Идеи на пустом месте не рождаются. Прежде всего, нужно понять, с какой целью делаем logo. Проще подойти к задаче, если она четко изложена в ТЗ. Соберем информацию и зададим себе или заказчику правильные вопросы. Как это сделать?

Чек-лист из 10 шагов: какие вопросы задать заказчику/себе при создании логотипа?

1. Какие цели преследует кампания? Поднять продажи на 20% или же увеличить приток клиентов. Точные мотивы скрыты, поэтому собираем как можно больше информации.
2. Что подтолкнуло на создание лого? Здесь следует разобрать причины. Например, сделать корпорацию узнаваемой или с выходом новой продукции требуется ребрендинг. Распространенный вариант – дизайн устарел, нужно сделать более современный стиль.
3. Кто является целевой аудиторией? Здесь важны все аспекты: потребности в продукте, возражения, демографические данные. Подробнее про ЦА читайте тут. 
4. Под какие товары/услуги создается лого? Например, новая, малоизвестная продукция на рынке, требует разъяснений. Эстетичные, на первый взгляд, листик и каллиграфический Edwardian Script ITC не внесут ясности. 
5. История компании или продукта? Важно знать историю фирмы, это может стать основой логотипа.
6. В чем заключается уникальность продукта? Следует знать, чем товар фирмы отличается от товара конкурентов. 
7. Какие минусы в компании? При общении с заказчиком, следует убедить его рассказать о недостатках фирмы. Если, например, при создании logo, вы сделаете акцент на скорости обслуживания, а по факту окажется, что персонал работает медленно, клиенты разозлятся.  Кто главные конкуренты? Маленькие фирмы обычно привязаны к определенной геолокации, например к городу. Соответственно в каждом районе найдутся свои конкуренты. Кто они? Надо знать, для того чтобы проверить шрифты, дизайн, стиль logo и при рисовании не повторятся.

Как создать логотип в Figma

Прежде чем приступать к работе, определимся, что будем рисовать. Возьмем готовый пример на pinterest, например “зеленый логотип”. 

Чтобы создать логотип онлайн бесплатно потребуется всего три инструмента. 

1. Примитив окружность.
2. Rectangle.
3. Цветовая палитра “зеленый” (32BB95).

Зайдите в фигму и создайте новый документ. Добавьте в рабочую область Frame и нарисуйте на нем окружность (Ellipse). Высота и ширина: 200 пикселей. Сразу следует сделать примитив зеленым, если до этого он был другого цвета. Поверх основной окружности наложите еще один круг. Размер второго примитива поставьте 180 на 180 пикселей. Начинайте совмещать одну фигуру с другой, пока их центры не совпадут, это станет понятно, когда горизонтальные и вертикальные линии пересекутся.

Следующий шаг удаляем середину. Выделите два круга и нажмите “Subtract Selection”. В итоге мы получим круг без середины. 

Приступим к рисованию “листика”. Для этого выберите инструмент Rectangle и прочертите слева линию начиная с верхнего края до нижнего. Ширина 10 пикселей. Пример ниже.

Сделаем из нового объекта острый угол. Щелкните по нему дважды, появится маркер, захватите его и тащите. 

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

Сделаем округление. Дважды щелкнем на угол и перейдем в редактор, здесь есть инструмент Bend Tool. Делаем захват маркера и начинаем плавно двигать мышку вниз. Линия начнет принимать скругленный вид.

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

Как показано на картинке выше у нас получилось два полукруга – зеленый и серый. По центру рисуем еще один Rectangle. Сделаем ширину 10 пикселей. Украсим холст дополнительными горизонтальными линиями, всего их будет шесть штук, справа и слева от вертикальной линии, чтобы не путаться, был использован вишневый цвет (890046). Результат ниже.

Подсказка: Каждая линия равна по ширине противоположной. Чтобы добиться этого, используйте “Копировать и вставить”. Нужно сделать наклон, в зависимости от главной линии. Справа на +25 градусов. Слева на -25 градусов. В итоге получиться что-то вроде листа. Позже перекрасим все элементы в зеленый цвет.

В примере взятого с фотостока, по которому мы делаем logo видно, что окружность нарисована не полностью, и присутствуют в некоторых местах разрывы. Сделаем то же самое. Воспользуемся снова инструментом Rectangle. Создадим брусок 10 (ширина) на 20 (высота) пикселей и размести под углом 30 градусов на линии. Выделим круг, брусок и в панели выберем “Subtract Selection”.

Удалить лишнее нужно и здесь, как показано на скриншоте (перекрывающая сторона).

Осталось дорисовать линию. Чтобы все было ровно, рекомендуется воспользоваться линейкой, “Главное меню->View->Rulers”. Нажимаем на вертикальную линейку и перетаскиваем на участок, где будет происходить дорисовка, если не удается мышкой подогнать ровно под каждый пиксель (такая проблема случается), воспользуйтесь стрелками на клавиатуре.

Делаем последний штрих, ниже на скриншоте видно, как Rectangle (100 на 7 пикселей) удачно расположился по отношению к центру и линейки.

Примитивы перекрашиваем в зеленый цвет (32BB95). Пользовательская палитра всегда сохраняется, если ее там нет, используйте цветовую панель. 

Переведем все примитивы в вектор. Выделите их и нажмите комбинацию клавиш, Ctrl+E.

Для использования нашего logo нужно его экспортировать. Лучше сохранить в SVG. 

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

Примечание: уникальные лого строятся из примитивов. Для работы следует использовать только Rectangle и Ellipse. При переводе в Vector толщина у Stroke не учитывается, поэтому инструмент Line здесь не подходит, так как основной параметр у Line это толщина.

Попытка сделать лого за счет Stroke (толщины линии) с вычетом Fill, чтобы получить окружность тоже плохая идея, так как при конвертации в Vector настройки вернуться в первоначальный вид, т.е. по умолчанию. Если нужно сделать окружность для векторной графики, то используйте инструмент “Subtract Selection” и два эллипса.  

Обойти ограничения все же можно делается это так, выбираем объект правой кнопкой, вызываем контекстное меню и “Outline Stroke”. После этого без проблем можно переводить в вектор. К теме создать свой логотип или эмблему бесплатно онлайн через инструмент “Outline Stroke” мы еще вернемся. 

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

• Зеленый цвет – это символ природы.
• Листочек внутри подтверждает, что организация специализируется в области природы, например, занимается продажей товаров для озеленения.
• Внешний вид напоминает “G”, это может означать название кампании. 

Другой вариант, где подойдет логотип. Это в общественной организации по защите природы, например гринпис по английский он звучит как “Greenpeace”, что подтверждает значение буквы в логотипе. 

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

В редакторе figma существует ряд инструментов, которые позволяют создать логотип онлайн бесплатно, к ним доступны дополнительные опции – это эффекты. В панели управления, во вкладке Design есть блок Effects. С помощью него можно настроить тени, что придаст фигуре более объемный вид.

Где черпать идеи?

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

• Pinterest.com самый обширный сайт для вдохновения, на главной странице прямым текстом указано “Найдите свежие идеи”. Данный ресурс предлагает не только логотипы, но и другие изображения по теме “домашний декор”, “стильный образ”, “gui интерфейса для компьютерных игр” и многое другое. Ресурс мультиязычный, русский язык включен по умолчании и запускается автоматически при посещении.
• Dribbble – платформа для дизайнеров, веб-дизанеров и иллюстраторов. Ресурс служит, как площадка портфолио для художников. Поэтому количество свежих идей достаточно и ежедневно публикуются новые художества. На главной странице есть поиск. Введите запрос для получения картинок по своей теме и выберите ключевое слово: Branding, Animation, Illustration. Пример ниже.

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

Как придумать логотип для себя с помощью плагина?

Перечисленные выше ресурсы это не единственный источник вдохновения. Специально для Figma разработали плагины, которые содержат большое количество эмблем и иконок. Вот где можно найти вдохновение. По-хорошему, желательно собрать свой мудборд (набор фотографий, иллюстраций) которые станут вдохновением при рисовании логотипов.

Список плагинов:

• Vector Logo – хорош тем, что содержит все популярные бренды. Достаточно в поиске прописать название бренда и получить результат. Пример на картинке.

• Iconify – огромная коллекция иконок собранных в одном месте. Отличаются они простым дизайном, что может послужить для создания будущего логотипа.  
• Brandfetch – библиотека популярных брендов. 

Как создать свой логотип или эмблему бесплатно онлайн, инструмент перо

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

Создадим следующее лого. Для начала добавим Frame и сделаем заливку черным цветом. Нарисуем произвольную фигуру, для этого будем использовать перо. Пример на картинке. 

Добавим круг, который будет накладываться поверх фигуры. Удалим параметр Fill и сделаем толщину Stroke 30-35 пикселей. В меню выберем Outline Stroke. Это обязательное требование, чтобы при конвертации в вектор настройки не сбились, об этом мы писали выше. Пример выбора опции на картинке.

Переходим в режим редактирования и удаляем точки.

При удалении точек контур станет невидимым, чтобы убедиться, что он на месте посмотрите левую панель Layers->Ellipse1 (Stroke). После редактирования остались две изогнутые линии и четыре точки. Эти линии нужно объединить и сделать заливку Fill белого цвета, а Stroke серого, результат ниже на скриншоте.

Последний штрих это зададим тень, в панели Design добавляем Effects->Drop Shadow, Blur устанавливаем 50 и видимость тоже 50% (по умолчанию стоит 25%, настройка производиться там, где цвет). Готовый результат.

Как придумать свой логотип из имени и фамилии?

Нередко в логотип добавляют название города, страны или имя владельца фирмы. Если взять пример из реальной жизни, то пусть это будет книжный магазин “Питер”, который занимается изданием и переводом книг. Создание креативного logo состоит из трех шагов.

1. Нарисовать часть logo. Для вдохновения можно воспользоваться сервисами и плагинами, про которые мы писали выше.
2. Написать текст, имя владельца компании.
3. Объединить logotype и text.

Создадим третий лого, в котором будем использовать текстовое поле. В данном случае мы будем использовать два инструмента Pen и Text. Рисование произвольное, поэтому сами установите размеры. Делать образец будем на темном фоне фрейма. Нарисуем такой значок.

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

Если нужно переместить точки используйте “курсор”, эта кнопка в виде стрелки, находится в панели инструментов. После всех настроек нажимаем Done и переходим к написанию текста. Допустим, руководителя компании зовут Петров. Содержание текста будет “Петров и партнеры”. Используйте опции форматирования, для размещения текста по центру.  

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

Как создать логотип – 5 советов

В каждой работе есть свои тонкости. Приведем 5 советов который пригодятся для разработки уникального лого.

1. Как должен выглядеть логотип – правила. Соответствие бренду, следует подобрать подходящие цвета, шрифт, отстроится от конкурентов. Узнаваемость – придется хорошо проработать дизайн, чтобы сделать логотип легко узнаваемым и запоминающимся. Простой – если посмотреть популярные бренды, то можно заметить что зарисовка, выполнена в обычном стиле без сложных форм и т.д. Это сделано так для того, чтобы данная эмблема хорошо смотрелась на всех цифровых устройствах и сайтах, а так же чтобы без проблем можно было распечатать.
2. Пропускайте тренды через призму адекватности и расчета на долговечность логотипа. Тренд держится максимум год, дальше про него все забудут, идея перестанет быть свежей и интересной. 
3. Зеркальный просмотр дизайна – если хотите узнать, насколько удачен ваш бренд, просто сделайте зеркальное отображение лого. Если оно потеряло свою узнаваемость, то нужно переделать.
4. Геометрические правильные формы. Рекомендуется использовать примитивы: круги, прямоугольники, треугольники. Выше мы показали, как создать логотип с помощью примитив. Еще существует правила золотого сечения, вы создаете перечень кругов определенных размеров и уже из них собираете форму.
5. Наброски. Прежде чем приступить к работе в figma посмотрите фотостоки для поиска идей, потом возьмите карандаш и сделайте наброски. Почему следует взять паузу и заняться рисованием эскизов? Дело в том, что 90% первых идей  примитивны, и скорее всего они давно уже были использованы в других проектах.

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

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