Пошаговое создание логотипа для сайта: идеи, инструменты и размеры
Неправильно подготовленный логотип теряет читабельность и не масштабируется для сайта - часто ошибаются с форматом и размерами. Разбираем генерацию идеи, работу в Adobe Photoshop, экспорт в вектор/растровые форматы и онлайн‑сервисы для быстрых вариантов.
Вы освоите выбор формата и правила экспорта под сайт. В результате получите набор экспортируемых файлов (SVG/PNG) и базовую вариативность логотипа, готовую к размещению на сайте.
Для чего необходим логотип?
Профессионально выполненный логотип может разрушить бизнес или поднять его на другой уровень, он — сердце узнаваемости компании. В ряде случаев плохо выполненный логотип может являться разницей между систематическим привлечением клиентов и полным их отсутствием.
Различают три основных типа логотипов:
- Текстовый. Суть бренда, сайта или компании выражена с помощью некого текста, шрифта и цвета, в котором используется название бренда;
- Знаковый. Зачастую выражен определённым абстрактным графическим элементом, аббревиатурой или одной заглавной буквой;
- Комбинированный. Данный тип логотипа является самым распространённым, универсальным и запоминающимся. Представляет собой комбинацию текста, символа или знака.
Каждый логотип должен соответствовать следующим базовым требованиям:
- Креативность и оригинальность. Уникальный знак будет являться визитной карточкой вашего сайта;
- Ассоциативность. Если логотип отражает тематику вашей деятельности, это будет являться большим плюсом;
- Лаконичность. «Всё гениальное — просто». Сложные для восприятия фигуры запоминаются гораздо труднее.
Как показывает практика для получения качественной и оригинальной символики требуется как грамотная реализация, так и креативный подход.
Самостоятельная генерация идеи логотипа
Ответ на вопрос «как разработать логотип?» в первую очередь предполагает создание концепции и содержания финального продукта: адрес сайта, картинка, слоган, символ и т. д. Также, необходимо выбрать подходящее изображение для примера или основы и определиться с характеристиками.
Чаще всего размер логотипа не слишком большой — 250 пикселей в ширину и 100 в высоту, однако если вы желаете использовать другой размер — всё в ваших руках. Можно нарисовать логотип самостоятельно, купить готовый вариант в интернете или заказать у дизайнера.
Важно, чтобы основа для логотипа не была «засвечена» на просторах всемирной сети:
- Добиваться реалистичности брендовой символики совершенно необязательно: абстрактные элементы в ряде случаев выглядят дороже и эффектней;
- Если у вас возникли сложности с идеей, никто не запрещает заглянуть на сайты конкурентов и проанализировать успешность их символики;
- В интернете существует множество бесплатных сервисов для шаблонной разработки логотипа, однако, об этом чуть позже.
Программы для самостоятельного создания логотипа
Если создание простого логотипа из шаблона вас по какой-то причине не устраивает, стоит задуматься о более профессиональном подходе к делу.
Для этого понадобится готовый, утверждённый в качестве основы или примера рисунок и графический редактор:
- Adobe Photoshop. Данное средство для создания и обработки растровой графики является лидером среди подобных программ за счёт высокой скорости работы, эффективности и широких возможностей и мульти функциональности. Реализована возможность работы с контурами и слоями;
- Adobe Illustrator. Достаточно популярная программа для редактирования и создания векторной графики. Все желающие могут скачать демонстрационную версию с официального сайта и бесплатно пользоваться ей на протяжении 30 дней;
- CorelDRAW. Популярный программный пакет для работы с векторной графикой, поддерживающий огромное количество всевозможных форматов и обладающий богатыми функциональными возможностями.
Преимущество работы в редакторе перед использованием интернет сервисов состоит в том, что он не требует доступа в интернет и обладает гораздо более широким спектром возможностей. Итак, как создать логотип с помощью программы?
Создание логотипа в Adobe Photoshop
Рассмотрим создание простого логотипа для веб-сайта в программе Adobe Photoshop по шагам. Наш логотип может менять цвет в зависимости от фона, а в том случае, если возникнет необходимость что-либо изменить или доработать, обязательно сохраните копию конечного файла в формате .psd:
- Откройте Photoshop и создайте новый документ с разрешением 250 пикселей на 100 пикселей. Содержимое фона — прозрачное:
- Создайте новый слой и инструментом «заливка» закрасьте его белым цветом. Зажав на линейке левую клавишу мыши, поставьте горизонтальные направляющие в 15 пикселях от низа и верха и вертикальные направляющие в 20 пикселях от левой и правой стороны рисунка:
- Необходимо получить круг, размером 70 на 70 пикселей:
- Кликните по цвету, и в настройках укажите код #2d2d2d;
- Выберите инструмент с названием «эллипс»;
- Нарисуйте круг, поставив для точности ещё одну направляющую.
- Нарисуйте в круге букву F c помощью шрифта Avant Quelombre, который предварительно придётся скачать и установить.Эффект логотипа достигается как раз благодаря удачно выбранному шрифту:
- Напишите слово «Famous» (используется лишь в качестве примера) с помощью цвета #2d2d2d и следующих характеристик:
- Напишите слово «website» цветом #767676 и c параметрами, изображенными на рисунке:
- Удалите белый фон, сохраните картинку и сам проект.Итогом простейших действий с использованием только текста и круга стал данный логотип:
Результат работы — мультифункциональное изображение, которое, благодаря использованию всего двух цветов, можно разместить на любом фоне. К тому же, буква F будет превосходно смотреться в качестве фавикона сайта.
Интернет-сервисы для создания логотипа
На просторах интернета располагаются сотни дизайнеров и веб-студий, предлагающих свои услуги по профессиональной разработке графической атрибутики любой сложности. Однако, зачастую у начинающих веб-разработчиков не имеется средств для заказа логотипа у квалифицированных специалистов, а навыков работы с компьютерной графикой не хватает.
Как сделать логотип для сайта в таком случае?
Выходом из ситуации являются онлайн-сервисы для создания логотипов и баннеров. Стоит отметить, что большинство подобных сайтов не поддерживает русский язык, но кириллицу в готовый шаблон добавить все-таки можно.
Попробуем разобраться в подобных сервисах
- Cool Text. Выберите заинтересовавший вас стиль среди предлагаемых вариантов. Затем перейдите на страницу настроек и напечатайте свой текст. В этом же разделе есть возможность выбрать размер шрифта, его текстуру и цвет. Сохраните логотип, предварительно выбрав подходящий формат файла:
- Logo Maker. В первую очередь выберите из предоставленной коллекции визуальный символ для логотипа, затем напишите текст, выберите шрифт и настройте его расположение. Обратите внимание, что данный сервис требует регистрации на этапе сохранения файла, однако ознакомиться с его работой можно и без авторизации:
- Logo Yes. Сверху главной страницы этого сайта располагается ссылка «Logo Creator», нажав на которую, вы в полной мере получите ответ на вопрос «как создать логотип для сайта?». Настроив все предлагаемые параметры, на последнем шаге вам будет предложено купить полученный логотип:
- Logo Ease. Работает данный сервис по стандартному принципу и имеет большое количество настроек, однако требует авторизацию. Шаблоны логотипов представлены в избытке.
- Simwebsol. Довольно простой сайт без лишних «наворотов». Напишите текст, выберите шрифты, цвета, изображение, формат файла, нажмите «Create Logo» и сохраните готовый логотип:
- Logo Design Engine. Данный сервис позволяет создать не только логотип, но и кнопки для сайта. В зависимости от того, что вам необходимо, выберите в меню «Free Web Buttons» или «Free Logo Design»:
- Logo Snap. Данный сайт требует регистрацию. После нажатия на «Create a logo» работает по стандартному принципу:
- Logotype Creator. После нажатия на кнопку «Generate Logo Now!» работает по уже описанной схеме:
В заключении стоит сказать, что каким бы способом не был логотип разработан, главное, чтобы он был запоминающимся и индивидуальным.
Надеемся, что наше руководство стало для вас полезным. Желаем успехов!
Комментарии