Как отрисовать логотип в иллюстраторе: Отрисовка логотипа в Иллюстратор. Создание векторного значка по фото. Видео урок

Содержание

Отрисовка логотипа в Иллюстратор. Создание векторного значка по фото. Видео урок

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

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

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

Анализ логотипа.

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

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

Прорисовка элементов логотипа.

Для начала, заблокируйте вашу картинку на отдельном слое, чтобы она не перемещалась. Так удобнее будет рисовать по ней.

Для прорисовки одного дома потребуется пять прямоугольников:

  1. Сам дом.
  2. Труба.
  3. Крыша, чтобы получилась ровной, нарисуйте один прямоугольник под углом и отразите его зеркально.
  4. Дверь.
  5. Окно.

С помощью панели «Обработка контуров» склейте все прямоугольники в одну фигуру, за исключением дверей и окна. Задайте основному контуру дома обводку необходимой толщины. Поскольку все дома абсолютно одинаковые, полученный рисунок скопируйте на другие места.

Основание для домов, тоже прямоугольник. Дорожку к дому удобнее рисовать инструментом «Перо». А затем, с помощью панели «Обработка контуров» вычесть один из другого.

Теперь, когда логотип готов, нужно преобразовать все обводки в объекты, нажмите — Объект/Разобрать оформление… Логотип готов!

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

В видео показана пошаговая прорисовка логотипа с домиками.

Напишите в комментариях, как эта статья помогла вам в отрисовке вашего логотипа.

(Visited 8 015 times, 1 visits today)

Как отрисовать текстовый логотип? 3 способа сделать лого векторным

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

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

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

Для удобства заблокируйте логотип нажав — Object/lock/Selection. Теперь логотип не будет случайно смещаться при рисовании. А также можете уменьшить прозрачность картинки для того, чтобы было лучше видно линию.

Трассировка из растрового изображения в векторное

Трассировка изображения — это самый простой и быстрый способ превратить растровый логотип в векторный. Этот инструмент выполняет всю работу автоматически. Компьютер сам распознаёт очертание букв и рисует векторные объекты.

Выделите изображение и нажмите кнопку «Image Trace».

Главный недостаток этого способа заключается в том, что не всегда он корректно работает. Мелкие детали могут получится кривыми, а острые углы сглаженными.

Попробуем применить трассировку к логотипу «Subway». Некоторые острые углы получились кривыми. В таком случае, можно их поправить вручную или полностью нарисовать.

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

Подбор шрифта по картинке

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

Попробуем найти шрифт для нашего логотипа «Audiomania» по картинке. 

В сервисе поиска шрифта по картинке вы можете кадрировать изображение, убрать лишнее. Шрифт нашёлся, теперь необходимо его скачать, установить и набрать слово «Audiomania» этим шрифтом.

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

Рисование пером и фигурами

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

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

Например, букву U можно нарисовать тремя прямоугольниками со скругленными краями.

С помощью панели «Pathfinder» вырежьте прямоугольники один из другого, чтобы получилась буква U.

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

В моём случае, одну нарисованную букву U можно использовать ещё на букве W и букве A.

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

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

Поэтому применим инструмент рисования перо.

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

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

Если где-то линия получилось немножко угловатая, её можно сгладить инструментом карандаш. Проведите карандашом по краю линии удерживая клавишу ALT.

Видео: 3 способа нарисовать лого

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

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

(Visited 1 130 times, 1 visits today)

Как перевести растровое изображение в векторное быстрым способом в Adobe Illustrator.

Скачать материалы урока

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

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

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

1. Подготавливаем изображение в фотошопе

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

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

Берем слой с надписью (названием логотипа), выбираем в верхнем меню «Изображение» — «Коррекция» — «Уровни», либо нажимаем комбинацию клавишь «Ctrl + L» и в появившемся окне настроек выставляем ползунок выходных значений в крайнее левое положение.

Данное действие перекрасит изображение в черный цвет. После этого просто сохраняем получившуюся картинку в формате jpg («Файл» — «Экспортировать» — «Сохранить для web»). Таким образом необходимо поступить со всеми слоями логотипа, кроме надписи под логотипом. В итоге получаем набор изображений в формате jpg, как на картинке ниже, только каждый элемент должен быть отдельной картинкой.

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

2. Переводим изображения в вектор и собираем логотип

Открываем Adobe Illustrator и создаем холст размером, соответствующим сохраненным изображениям, в данном случае у меня получился размер 500×229 пикселей.

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

Далее в верхнем меню выбираем «Объект» — «Растрировать», при этом слой изображения должен быть выделен.

Затем в верхнем меню выбираем «Объект» — «Трассировка изображения» — «Создать» и кликаем на значок настройки трассировки в верхней панели меню. В открывшемся окне настроек выставляем нужные значения, лини делаем ровные и плавные, после чего закрываем окно настроек.

Теперь в верхнем меню выбираем «Объект» — «Разобрать» и в открывшемся окне ставим обе галочки, после чего нажимаем «Ок».

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

Таким образом мы получили каждую букву в векторном формате на отдельном слое, что и требовалось. Далее такми же образом поступаем со всеми изображениями, получив логотип из группы слоев в векторном формате. Остается только раскрасить каждый объект в нужные цвета или наложить градиент и логотип в векторном формате готов. Надпись под логотипом «все для мамочек» — таким образом сделать не получится, так как буквы слишком тонкие и при трассировке они немного искозятся, поэтому данный шрифт придется подобрать или сделать похожим. Вообще, надпись «BEaM M» — было бы тоже, в лучшем случае, сделать шрифтом, после чего буквы приобразовать в кривые, но шрифт не всегда удается найти, поэтому мы поступили иначе.

Переводим обычную картинку в вектор

Во втором случае требуется перевести какое-то обычное растровое изображение в векторное. Для этого нам уже не понадобиться фотошоп, просто открываем изображение программой Adobe Illustrator и выделив слой данной картинки выбираем в верхнем меню «Объект» — «Растрировать» и в открывшемся окне нажимаем «Ок».

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

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

После всех действий разбираем изображение, как и в первом случае «Объект» — «Разобрать», ставим обе галочки, нажимаем «Ок» и получаем векторное изображение, состоящее из множества слоев.

Как видите, на скриншоте выше, по направляющим видно наличие слоев. Вот таким образом быстро и просто можно превратить растровое изображение в векторное.

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

КАК: Повторно создать логотип из плохого качества сканирования с помощью Illustrator

Вы можете воссоздать логотип из сканирования низкого качества несколькими способами с помощью Adobe Illustrator CS4 или более поздней версии. Вы можете автоматически отслеживать логотип с помощью Live Trace или вручную отслеживать логотип с использованием слоя шаблона. Каждый метод имеет свои плюсы и минусы, но любой метод создает редактируемые векторы в Illustrator.

01 из 10

Отрегулируйте размер панели

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

Хорошо, Чтобы выйти из режима редактирования монтажной области, щелкните другой инструмент на панели «Инструменты» или нажмите Esc.

выберите файл > Сохранить как, и назовите файл live_trace, Это сохраняет исходное сканирование для последующего использования.

02 из 10

Использовать Live Trace

Прежде чем вы сможете использовать Live Trace, вам нужно установить параметры трассировки.

  1. Выберите отсканированный логотип.
  2. выберите объект > Живая трасса > Параметры трассировки.
  3. Установить Предустановленная в По умолчанию, Режим в Черное и белое, и порог в 128 или используйте настройки, которые лучше работают при сканировании вашего логотипа.
  4. Нажмите след
    .
  5. выберите объект > расширять, убедившись, что объект а также заполнить выбираются в диалоговом окне.
  6. Нажмите Хорошо.

Как использовать функцию Live Trace в Illustrator в более поздних версиях Illustrator.

Метод Live Trace немного отличается в версиях CC Illustrator.

  1. Выбрав выбранное сканирование, нажмите Трассировка изображения выпадающее меню в панели управления Illustrator.
  2. Выберите либо Черный и белый логотип или же Оттенки серого в раскрывающемся меню. Могут также работать и другие варианты, в том числе Линейное искусство а также Технический чертеж.

Экспериментируйте с параметрами до тех пор, пока у вас не будет набора векторных контуров, которые точно совпадают с проверкой.

03 из 10

Изменить цвет

Чтобы изменить цвет или добавить цвет к логотипу:

  1. Нажми на Живой коврик для рисования инструмента в панели инструментов
  2. выберите Окно > цвет.
  3. Нажмите панель значок меню в верхнем правом углу цвет для выбора цветовой опции.
  4. С использованием Живой коврик для рисования инструмент, щелкните по нескольким частям логотипа, по одной секции за раз, пока весь логотип не станет выбранным вами цветом.

Вы только что создали логотип с помощью Live Trace. Преимущество использования Live Trace в том, что он быстрый. Недостатком является то, что он не идеален.

04 из 10

Просмотр и сохранение прямых трасс

Чтобы внимательно посмотреть на логотип и его контуры, нажмите на него с помощью Увеличить инструмент и выберите Посмотреть > контуры, Обратите внимание, что линии несколько волнистые.

выберите Посмотреть > предварительный просмотр чтобы вернуться к просмотру логотипа в цвете. Тогда выбирай Посмотреть > Фактический размер, с последующимфайл > Сохранить а также файл > близко.

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

05 из 10

Создание слоя шаблона

Откройте исходное сканирование еще раз и переименуйте его manual_trace, Затем создайте слой шаблона. Шаблонный слой содержит изображение, которое затемнено, поэтому вы можете легко увидеть пути, которые вы рисуете перед ним. Чтобы создать шаблонный слой:

  1. Дважды щелкните слой в Слои панель.
  2. в Параметры слоя
    диалоговое окно, выберите шаблон.
  3. Уменьшите изображение до 30 процентов и нажмите Хорошо.

В любое время вы можете выбрать Посмотреть > Спрятать скрыть шаблон и Посмотреть > Показать шаблон чтобы увидеть его снова.

06 из 10

Логотип ручной трассировки

в Слои панели, нажмите Создать новый слой значок. С выбранным новым слоем выберитеПосмотреть > Приблизить.

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

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

07 из 10

Укажите интенсивность обводки и нанесите цвет

Если новый слой не находится в верхней части панели «Слои», щелкните и перетащите его над слоем шаблона. Чтобы применить ширину и цвет хода к ручной трассировке:

  1. выберите Посмотреть > Фактический размер.
  2. С выбор инструмент, сдвиньте мышью две строки, которые представляют страницы книги, и выберите Окно > Инсульт.
  3. в Инсульт панели, измените вес штриха на 3 pt или все, что вам нравится.
  4. Чтобы покрасить линии, дважды щелкните Инсульт значок в инструменты и введите значения цвета.
08 из 10

Применить цвет заполнения

Чтобы применить цвет заливки к форме:

  1. Выберите фигуру.
  2. Дважды щелкните заполнить в панели инструментов.
  3. в Выбор цвета, выберите цвет.

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

09 из 10

Упорядочить фигуры

С помощью инструмента «Выделение» сдвиньте сегменты пути, которые составляют фигуры, которые вы хотите вырезать или выглядите белыми, и выберите Упорядочить объект > На передний план.

10 из 10

Вырезанные фигуры

Вырежьте фигуры, которые хотите выглядеть белыми, из цветных форм. Для этого:

  1. Нажмите Shift на пару фигур.
  2. выберите Окно > следопыт.
  3. В панели Pathfinder нажмите Вычесть из области формы кнопка. Делайте это с каждой парой фигур, пока это не будет сделано.

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

10 уроков рисования крутых логотипов в Adobe Illustrator | Публикации

Начинающим и профессиональным веб-дизайнерам необходимо постоянно практиковаться. Существует множество ресурсов, рассказывающих «что и как» делать настоящему (!) дизайнеру. В них легко заблудится

Но одна вещь, которую важно, на наш взгляд, уметь делать хорошему дизайнеру, – это создание логотипа.
Почему? Логотип – это ключевой элемент бренда. Он выступает своеобразным гарантом качества продукции или сервиса, предоставляемого компанией. Неудивительно, что дизайнеры столько времени посвящают его отрисовке. Покопавшись в Сети, мы подготовили 10 высококлассных уроков для тех, кто хочет создавать лого в Adobe Illustrator.
Здесь вы найдете новые идеи и сможете улучшить имеющиеся навыки:

1. Хотите научиться создавать логотипы с 3D-персонажами? Тогда вам сюда!

2. Интересуетесь процессом создания логотипа? Автор этого обучающего материала поэтапно (поиск идеи, наброски и дизайн) рассказал о процессе создания лого для английской компании LTD.

3. Мечтаете создавать винтажные логотипы. Не теряйте время – переходите по ссылке.

4. Мечтаете работать дизайнером в пивоваренной компании? Автор следующей статьи расскажет, как создать логотип, который увеличит продажи пенного напитка.

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

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

7. Эффект создания «зеленого текста». Если вы работаете с компанией, вовлеченной в защиту окружающей среды или просто сотрудничаете с любой «зеленой» организацией, вам следует срочно научиться создавать «зеленые лого».

8. Создание логотипов для фешн-брендов. Кира Пластинина или Cosmopolitan – вот ваш будущий работодатель? Тогда быстро переходите по ссылке.

9. Здесь вы узнаете, как создавался логотип Vivid Ways.

10. Круглые ретро-логотипы. Как, например, эта очаровательная графика спортивного зала.

Как перевести растровое изображение в векторное быстрым способом в Adobe Illustrator.

  • Главная
  • Дизайн
  • Adobe Illustrator
  • Как перевести картинку, логотип в вектор

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

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

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

Создание документа и рисование объекта

Сначала создадим новый документ любого размера и слой.

Теперь нарисуем любое изображение. Возьмите инструмент кисть (Brush) с неразмытыми краями и с полной непрозрачностью. Давайте нарисуем какую-нибудь несложную геометрическую фигуру, например, как показано на изображении.

Приёмы работы с пером при создании линий

  1. Не отпуская кнопку мышки при создании новой точки можно добиваться сглаживания линии.
  2. Точки лучше ставить в местах, где у линии должен быть изгиб.
  3. Зажав клавишу Ctrl на клавиатуре можно перемещать контрольные точки линий.
  4. Зажав клавишу Alt можно регулировать степень закругления линии возле точки и её искажение
    Векторные девушки в стиле аниме меня вдохновили испытать фотошоп на его пригодность в плане рисования линий. Рисовать линии в фотошопе сложней, чем в его векторных аналогах и некоторых растровых редакторах – такое впечатление у меня сложилось после ознакомления с инструментами в Paint Tool Sai, Illustrator, Inkscape и других, которые имеют более удобные и гибкие инструменты создания красивых линейных форм.

    https://macroart.ru/wp-content/uploads/2011/08/lines.swf,600,490

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

    Что интересно, видео идёт полторы минуты и весит 2 кб – это очень удивительно Видео записано на BB FlashBack Pro

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

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

  7. Зажав клавишу Ctrl на клавиатуре можно перемещать контрольные точки линий.
  8. Зажав клавишу Alt можно регулировать степень закругления линии возле точки и её искажение .

Первые два правила знают многие, а вот 3 и 4 для меня стали открытием.

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

Изменять можно как саму точку, так и положение направляющих “усов”, которые задают форму угла возле точки.



Преобразование выделенного объекта в векторный путь (Path)

При помощи любого инструмента типа Select вызовем контекстное меню. Для этого нужно навести инструмент на выделенный объект, и нажать правую кнопку мыши. В появившемся меню выбрать «Make Work Path…» .

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

Подготавливаем изображение в фотошопе

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

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

Берем слой с надписью (названием логотипа), выбираем в верхнем меню «Изображение» — «Коррекция» — «Уровни», либо нажимаем комбинацию клавишь «Ctrl + L» и в появившемся окне настроек выставляем ползунок выходных значений в крайнее левое положение.

Данное действие перекрасит изображение в черный цвет. После этого просто сохраняем получившуюся картинку в формате jpg («Файл» — «Экспортировать» — «Сохранить для web»). Таким образом необходимо поступить со всеми слоями логотипа, кроме надписи под логотипом. В итоге получаем набор изображений в формате jpg, как на картинке ниже, только каждый элемент должен быть отдельной картинкой.

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

Создание векторной маски для слоя из векторного пути

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

Два раза нажмите на него, чтобы дать имя.

Затем в главном меню выберите «Layer -> New Fill Layer -> Solid Color…» . Можете как-нибудь назвать новый слой, затем нажать «ok» . Выберите цвет для будущей формы в диалоге выбора цвета.

Теперь во вкладке Layers должен появиться новый слой с векторной маской.

Переводим обычную картинку в вектор

Во втором случае требуется перевести какое-то обычное растровое изображение в векторное. Для этого нам уже не понадобиться фотошоп, просто открываем изображение программой Adobe Illustrator и выделив слой данной картинки выбираем в верхнем меню «Объект» — «Растрировать» и в открывшемся окне нажимаем «Ок».

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

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

После всех действий разбираем изображение, как и в первом случае «Объект» — «Разобрать», ставим обе галочки, нажимаем «Ок» и получаем векторное изображение, состоящее из множества слоев.

Как видите, на скриншоте выше, по направляющим видно наличие слоев. Вот таким образом быстро и просто можно превратить растровое изображение в векторное.

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

Комментарии ()

Полное объединение компонентов фигур

И в списке осталась ещё одна команда — «Объединить компоненты фигур» (Merge Shape Components). Команда не зря отстоит особняком от других, т.к. она приводит к необратимым действиям — объединению образующих контуров. Если ранее мы просто переключались между командами, то после применения этой команды, переключиться уже будет нельзя.

Если мы нажмём на эту строку, то появится сообщение с предупреждением «Эта операция превратит фигуру в обычный контур. Продолжить?» (This operation will turn a live shape into a regular path. Continue?), после нажатия ОК контуры будут объединены, все внутренние линии пересекающихся контуров будут удалены, и две или несколько векторных фигур будут преобразованы в один контур, это показано на рисунке, объединение компонентов фигур при: 1. Объединить фигуры (Add to Shape Area) 2. Вычесть переднюю фигуру (Subtract from Shape Area) 3. Область пересечения фигур (Intersect Shape Areas)


Объединение компонентов фигур при различных состояниях операций с контурами

Растровые и векторные изображения

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

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

Автоматическая трассировка

Хоть большинством ручная трассировка почему-то считается удобной, — на практике то же большинство пользуется автоматической. И это понятно: одно дело — рассуждать о работе, а другое дело — её выполнять. Для этого есть несколько приложений.

CorelTrace

Сначала растровый рисунок выделяется, на панели свойств выбирается команда Trace Bitmap. Тогда отдельно запущенное окно приложения CorelTrace предоставит возможность для дальнейшей обработки указанного рисунка.

Трассировка запускается командой To Trace из средств верхнего меню. Если видимый результат в рабочей области (справа) не удовлетворяет ожиданиям, можно попробовать его качественно улучшить.

Поиграйтесь величиной значения в ячейке Accuracy, передвигая ползунок. Этой величиной определяется чёткость трассировки. Учтите, что увеличение её приведёт к созданию большего количества векторных объектов (иногда до нескольких тысяч). А это потребует дополнительной мощности процессора, памяти (и/или времени).

Есть возможность выбора методов трассировки кнопками в левой секции меню рабочего листа:

  • Например, при нажатии Scetch и последующей активации Outline (вверху) будет создан набросок из обилия перекрещивающихся линий.
  • При выборе Advansed Outline вы попадёте в расширенные настройки трассирования. Тогда вверху отразятся дополнительные поля для совершенствования регулировок.

После окончания работы с векторным рисунком для возврата в CorelDraw нужно выйти из CorelTrace по команде File/Exit. Работа трассировщика будет завершена, а векторный результат будет передан в Корел и размещён над растровым. Чтобы снова его (растровый) увидеть, нужно сдвинуть в сторонку вновь созданный рисунок.

PowerTrace

Если утилита CorelTrace существовала как отдельное приложение, то PowerTrace уже встроена в CorelDraw X5.

Здесь уже результат автотрассировки получается вполне приличного качества.

В ней представлены такие виды (выбор в наборе Type of image):

  • для чёрно-белых набросков — Line art;
  • эмблемы, знаки с минимумом деталей и цветов — Logo;
  • эмблемы, знаки с глубокой детализацией — Detailed logo;
  • наброски с переменной детализацией — Clipart;
  • для фото с незначительными деталями — Low quality image;
  • фото с важными деталями — High quality image.

Список выбора Предварительного просмотра (Preview) позволяет избрать наиболее удобный вариант рабочего окна. Вариант До и после (Before anf After) покажет одновременно оба рисунка для оценки различий. Численность точек (узлов) и смягчение изогнутых линий управляется ползунком Smoothing, детализация — Detail. Цветовая гамма для рисунка определяется вкладкой Colors и набором Color Mode, а их численность в ячейке Numbers of colors.

Теперь вы знаете, как отрисовать вектор по картинке в CorelDraw. С помощью этой технологии получаются профессиональные композиции, которые можно использовать не только в личных целях.

Оставляйте свои комментарии, задавайте вопросы, делитесь своими успехами.

Создаем ретро логотип в Adobe Illustrator

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

Работа с идеями и клиентами

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

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

Создание скетча

Сегодня мы создаем логотип для бренда кофе, с названием «Vector Coffee». Предпочтение заказчика – современный или ретро стиль оформления логотипа.
Очень важно перед началом работы запросить максимальное количество существующих брендовых элементом. В идеале это брендбук. Но если есть фирменные цвета, шрифты тоже не плохо. Также нужно учитывать то, как будет смотреться логотип в печати и на экране. Отличия должны быть минимальны. Подбирайте такие цвета, чтобы обеспечить максимальную удобочитаемость текста и гармоничное их сочетание. Текст, который хорошо смотрится на сайте, может потерять читабельность на бумаге, или наоборот. Если дизайн, при уменьшении масштаба теряет детали или эффектность – это не удачный дизайн.

Идея дизайна, заключается в том, чтобы объединить слова «вектор» и «кофе». Мы предлагали различные варианты сочетания капель воды и зерен, и инструмента Pen Tool, и опорными точками. Сошлись мы на варианте формы с волнистыми краями в тексте. Также мы пришли к выводу о том, что нужно придумать знак или эмблему, которая будет напоминать о кофе. В итоге таким знаком стала капля кофе, которая символизирует перо авторучки. Главным цветом был выбран красный, который хорошо ассоциируется с теплотой. Помимо красного мы выбрали золотисто-желтый, который придает ощущение счастья и радости, и насыщенный коричневый — цвет кофе.

1. Создаем новый документ

Наконец эскиз готов. Теперь необходимо отрисовать его в векторе. Если вы предоставите макет в растровом варианте – это укажет на вашу некомпетентность.

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

2. Рисуем волнистую форму

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

Шаг 1

Выберите инструмент Star Tool (звезда) на панели инструментов. Нажмите на пиктограмму инструмента, чтобы он активировался. Далее кликните на рабочей области. Появится диалоговое окно Star Option (Настройки звезды). Установите значения, как на изображении ниже. После этого, отрегулируйте размеры звезды с помощью Window> Transform: размеры 448 на 448px. Поверните звезду на 90 градусов против часовой стрелки, чтобы идеально ровно была размещена верхняя ее точка.

Шаг 2

Выбираем форму звезды на панели Align (Выравнивание)  ( Window > Align ) и выбираем Align to Artboard, потом  Vertical Align Centre и Horizontal Align Centre.

Шаг 3

Открываем панель Appearance  ( Window > Appearance ) и выбираем коричневый цвет. Кроме того, нажимаем кнопку Effects из нижней части панели Appearance, выбираем  Stylize > Round Corners  и вводим значения, указанные ниже.

Шаг 4

Выберите Ellipse Tool (L) и нажмите кнопку на рабочей области и создайте круг 06*406, и центрируйте его, как показано ниже.

Шаг 5

Переключитесь на Selection Tool (V) и удерживаем Shift, выбираем одновременно круг и волнистую звезду. Затем открываем панель Pathfinder ( Window> Pathfinder ) и выберете второй значок слева, который называется Minus Front, чтобы завершить форму звезды.

3. Рисуем внешнее кольцо

Шаг 1

С  помощью инструмента Ellipse (L) снова создайте круг размерами  400*400px, и размещаем его в центре артборда.

Шаг 2

Затем открываем панель Appearance ( Window > Appearance ), удаляем заливку и добавляем обводку желтого цвета размером 5px (цифра взята из информации, предоставленной клиентом).

Шаг 3

Переходим к Object> Expand Appearance (Разобрать оформление).  Выбираем эту команду с той целью, чтобы не изменился размер, в зависимости от настроек.

Шаг 4

Создаем еще одно кольцо в центре, чтобы сбалансировать текст. Нажимаем инструмент Ellipse Tool (L) и задаем размер круга 190*190.

Шаг 5

Открываем панель Appearance ( Внешний вид Window> ), удаляем заливку и добавляем обводку 6px, для выравнивания снаружи Outside. Это придаст кольцу красный цвет (взято из информации о брендинге клиента).

Шаг 6

И, наконец, снова переходим к  Object> Expand Appearance .

4. Создаем форму и виде кофе

Шаг 1

На панели Слои (  Window> Layers  ) отключаем видимость слоя с объектами, нажав на значок глаза рядом со слоем. По умолчанию это слой «Layer 1». Далее создаем новый слой. В итоге у вас должно получиться два слоя, последний должен располагаться сверху и быть видимым.

Шаг 2

Повторяем процедуру с инструментом Ellipse Tool (L), в этом случае круг будет размером 300*300px, по старинке размещаем его в центре.

Шаг 3

С помощью Ellipse Tool (L), который еще выбран, создаем следующий круг, тем же инструментом, с размерами 70*70px. Заливаем его другим цветом, чтобы было удобней работать.

Шаг 4

Далее кликаем правой кнопкой мыши по маленькому кругу и выбираем Transform> Move … ( Shift-Command-M ), введите параметры, как показано ниже.

Шаг 5

Переключитесь на Selection Tool (V) и нажмите Shift, выделив одновременно два круга. Перейдите в  Object> Blend>   Blend Options … и убедиться, что опция «Smooth Color» включена и нажмите Ок. Теперь создайте бленд, выбрав  Object> Blend> Make  ( команда-Alt-B ).

Шаг 6

Переходим  к  Object> Expand Appearance.   Это позволит создать много-много кругов, которые будут размещаться один поверх другого.

Шаг 7

Открываем панель  Pathfinder (  Window> Pathfinder  ) и выберите первый значок слева, который называется Unite и объединяем формы.

Шаг 8

К большому сожалению, у нас будем много узловых точек, которые сейчас нужно удалить. Чтобы сделать это, увеличиваем форму, затем выбираем Direct Selection Tool (A) и перетаскиваем выделенную область на нежелательные опорные точки. Нужно помнить, что верхние и нижние опорные точки должны быть нетронутыми. После того, как вы их выбрали, нужно удалить их, нажав Backspace. Переходим в  Path > Join (Command-J) и закрываем открытые пути. Нужно будет сделать это дважды.

Шаг 9

Давайте украсим новую форму капли. С помощью Ellipse Tool (L), создаем круг размерами 60*60px. Цвет не имеет значения, но чтобы он был заметным.

Шаг 10

Выберите Rectangle Tool (L) и создайте вытянутый прямоугольник, шириной 10px, а высота должна быть больше, чем самая верхняя часть капли.

Шаг 11

Выберите Selection Tool (V) и нажмите Shift, чтобы выбрать одновременно круг и прямоугольник. Теперь откройте панель Pathfinder (  Window> Pathfinder  ) и выберите первый значок слева, который называется  Unite, чтобы объединить эти формы вместе.

Шаг 12

Удерживая Shift, одновременно выберите каплю и  круг с прямоугольником, затем в панели Pathfinder (  Window> Pathfinder  ) выберите второй значок слева, который называется  Minus Front, чтобы вычесть форму пера с капли.

Шаг 13

Перейдите в панель  Transform (  Window> Transform  ) и щелкните на значок звена цепи справа от диалогового окна ширины и высоты, чтобы ограничить изменения ширины и высоты. В окне Width указываем размер  90px и  выравниваем объект по центру рабочей области.

Шаг 14

Выберите Ellipse Tool (L) и создайте круг размерами 182 на 182px, как показано ниже. Выберите его и, кликните правой кнопкой мыши и выберите  Arrange > Send to Back (Shift+Option+[).  Теперь переключаемся на Selection Tool (V) и удерживая Shift, выбираем обе фигуры одновременно. Открываем панель Pathfinder (  Window> Pathfinder  ) и выбираем второй значок слева, который называется Minus Front, а также изменяем цвет на коричневый.

5. Красная часть

Шаг 1

Переходим на наш первый слой с другими объектами. Выбираем Ellipse Tool (L) и создаем круг размерами 460 х 460px, заливаем его красным цветом и выравниваем по центру.

Шаг 2

Включаем Rectangle Tool (L) и создаем вытянутый прямоугольник высотой 125px достаточной шириной, чтобы перекрыть круг.

Шаг 3

Теперь удерживая Shift, одновременно выделите круг и прямоугольник. Откройте Pathfinder панель (  Window> Pathfinder  ) и выберите третий значок слева, который называется Intersect.

Шаг 4

Откройте панель Appearance (  Window>    Appearance  ) и выберите кнопку  Effects  в нижней части панели, а затем  Stylize> Round Corners …  Введите информацию, указанную ниже. Теперь выберите кнопку Effects и  Warp > Bulge… Введите параметры, как на скриншоте ниже. Теперь переходим в  Object> Expand Appearance.

Шаг 5

Выберите Ellipse Tool (L) и создать круг, размерами 195 х 195px.

Шаг 6

Переключитесь на Selection Tool (V) и, удерживая Shift, одновременно выделите круг и деформированный прямоугольник. Теперь открываем панель Pathfinder ( Window> Pathfinder  ) и выберите второй значок слева, который называется Minus Front.

Шаг 7

Выбираем инструмент Magic Wand Tool (V) и кликаем по красной форме. Открываем панель Pathfinder ( Window > Pathfinder ) и  выбираем первый значок слева, который называется Unite, чтобы объединить формы.

6. Добавляем текст

Шаг 1

Выберите Ellipse Tool (L) и создайте круг размерами 295 х 295px. Удаляем заливку и обводку.

Шаг 2

При выбранном круге нажимаем Type Tool (T) и, удерживая Alt на клавиатуре выбираем самую верхнюю опорную точку. Изменяем цвет шрифта на коричневый и вводим текст «ВЕКТОР», используя выбранный клиентом шрифт.  В этом случае мы используем «Lubalin Граф». Убедитесь, что текст выровнен по центру с помощью панели  Paragraph ( Window > Type > Paragraph ).

Шаг 3

Дважды щелкните  на Type Tool в панели инструментов  и настройте Effect и Align в соответствии скриншотам. Затем переключитесь на Selection Tool (V) и захватите угол рамки поверните текст, чтобы он размещался в центре.

Шаг 4

С выбранным  Selection Tool (V) скопируйте (Ctrl-C)  путь и разместите на переднем плане (Ctrl-F). Вернитесь к Type Tool (T) и измените текст на «КОФЕ». Переверните текст, чтобы он отображался вверх ногами. Дважды щелкните Type Tool и в появившемся окне выберите вариант «Flip», нажмите OK.

Шаг 5

Давайте настроим кернинг между некоторыми буквами. Выберите две буквы F и установите кернинг на 90. Затем установите его между  F и E, а затем между двумя E.

Шаг 6

С помощью Selection Tool (V) выберите текстовые формы и перейдите к  Object> Expand.

Шаг 7

Теперь добавляем другие элементы.  С помощью Type Tool (T) введите «TUTS». И настройте размеры:

Шаг 8

Нужно увеличить ​​текст и с помощью Rectangle Tool (L) нарисуйте прямоугольники выше и ниже текста. Ширина прямоугольников будет совпадать с шириной текста, высота — 3 пикселя. Прямоугольники размещены на расстоянии 4 пикселя от текста.

Шаг 9

Переключитесь на Selection Tool (V) и выберите оба прямоугольника и текст затем, удерживая Option на клавиатуре нажмите и перетащите выделенную область в любом направлении, чтобы быстро дублировать его. Затем выравниваем текст читается «плюс» и при необходимости отрегулируйте ширину прямоугольника, чтобы так же, как текст.

Шаг 10

Выделите текст и нажмите Expand ( Object > Expand ), затем сгруппируйте Group (Command-G)  текст и границы. Не группируйте  объекты и текст вместе. Когда вы закончите, должно быть две группы —  «TUTS»,  и «PLUS».

Шаг 11

Выберите группу «TUTS», разместите ее в центре рабочей области и выберите  Transform> Move …  ( Shift-Command-M ), введите параметры, как показано ниже.

Шаг 12

Теперь выберите группу «PLUS» и также разместите в центре рабочей области, затем кликните правой кнопкой мыши и выберите  Transform> Move …  ( Shift-Command-M ). Введите следующие параметры:

Шаг 13

При включенном  Selection Tool (V)  выберите группы и красную форму, а далее перейдите к панели Pathfinder (  Window> Pathfinder  ) и выберите вторую иконку слева, которая называется Minus Front.

Логотип готов. Сохраняем его в низком качестве, для утверждения заказчиком. Если его успешно утвердили предоставляем файл AI (PNG и JPEG).

Команда онлайн школы WebDesGuru прилагает все усилия для того, чтобы отойти от стандартных методов обучения, которые годами вырабатывались в системе образования. Мы ежедневно делаем шаг вперед и идём навстречу новым знаниям, которыми готовы поделиться с нашими клиентами. Оцените наши старания! Записывайтесь на курсы web-дизайна для начинающих, и учиться Вам теперь станет в удовольствие!

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

Используйте векторные фигуры в Adobe Illustrator, чтобы создать логотип, который будет хорошо смотреться на экране и в печати. Самое лучшее в векторной графике — это то, что она масштабируется до любого размера — от визиток до рекламных щитов — без потери качества.

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

Узнайте, как создать новый документ, сбросить рабочее пространство, разместить эталонное изображение и открыть панель «Слои».

Используйте базовые формы для создания сложных произведений искусства

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

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

Применяйте цвета ко всем компонентам вашего логотипа с помощью интуитивно понятных элементов управления, которые позволяют легко вносить изменения. Чтобы цвета и формы вашего логотипа всегда были под рукой, просто добавьте их в свои библиотеки Adobe Creative Cloud.

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

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

Узнайте, как повернуть фигуру и повторно использовать цвет из библиотеки.

Завершите свой логотип, добавив название компании, используя мощные функции набора в Illustrator. Члены Creative Cloud могут выбирать из обширной библиотеки высококачественных шрифтов от Adobe Typekit.

Узнайте, как добавлять текст, изменять шрифт, добавлять шрифты из Typekit и добавлять интервалы между буквами.

Предварительный просмотр и сохранение вашего логотипа

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

Узнайте, как сохранить готовый логотип в библиотеке, сохранить его в формате PDF и выбрать другие параметры для общего использования в Интернете.

Создайте потрясающий логотип в Illustrator

Дизайн логотипа Killer каждый раз будет разным, в зависимости от общей идентичности бренда.Каждый айдентичный проект уникален. У всех есть свои проблемы, которые нужно преодолеть, и проблемы, которые нужно преодолеть. Но вы все равно должны подходить к каждому брифу одинаково: разработать рабочий процесс, который позволяет максимально творчески и продуктивно.

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

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

Если вы находитесь в зоне и хотите узнать больше о процессе разработки отличного логотипа, мы рассмотрели все, что вам нужно знать, в нашем подробном руководстве по дизайну логотипа.А если у вас нет Illustrator, вы можете узнать, как создать логотип в Photoshop.

Или вы можете расширить свои навыки работы с Illustrator с помощью нашего выбора лучших руководств по Illustrator.

01. Всегда начинайте с бумаги

Набросок вашей концепции на бумаге — важный этап

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

02. Мобильный сканер

Сканер поможет вам быть точным

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

03.Практика ведет к совершенству

Перо — очень мощный инструмент

Инструмент «Перо», вероятно, используется чаще всего, но остается одним из самых сложных в освоении. Это очень мощный инструмент, и его изучение не только улучшит вашу способность создавать изображения в Illustrator, но и навыки, которые вы приобретаете, также улучшат вашу работу с Photoshop Pen.

04. Использование панели «Фигуры»

Панель «Форма» обеспечивает более высокую точность

Создайте этот логотип, комбинируя прямоугольники с помощью инструмента «Прямоугольник».При построении векторов попробуйте использовать панель «Форма» для большей точности. Удерживайте Shift, чтобы рисовать фигуры с одинаковыми пропорциями. Выберите любой элемент, и его ширина и высота отобразятся на панели управления. Здесь вы также можете ввести размеры.

05. Дублируйте элементы и комбинируйте

Инструмент Pathfinder объединяет формы и добавляет новые

Для сравнения вариантов продублируйте мастер-копию для редактирования (удерживайте Alt и перетащите). Создавайте формы для выравнивания объектов и используйте быстрые направляющие («Просмотр»> «Быстрые направляющие»).Используйте инструмент Pathfinder, чтобы комбинировать формы и создавать новые. Вы можете комбинировать прямоугольники, чтобы получился элемент «H»: выберите оба элемента и нажмите «Объединить».

06. Настройте тип

Добавить символ к типу

Измените трекинг и кернинг слов, чтобы изменить тон логотипа. Добавьте характер к логотипу, открыв формы в исходные пути, которые составляют буквы, непосредственно изменяя пути каждой буквы, чтобы сделать ваш тип уникальным. Чтобы быстро преобразовать шрифт в контуры (контуры), нажмите Cmd / Ctrl + Shift O .

07. Сохраняйте незаметные изменения

Будьте осторожны и оставайтесь незаметными

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

08. Пора добавить цвет

Просматривайте цветовые палитры и избегайте градиентов

В версии CS4 и выше вы можете интегрировать приложение Adobe Kuler в свое рабочее пространство для просмотра цветовых палитр.Перейдите в Window> Extensions> Kuler. Старайтесь избегать градиентов в логотипах, но не принимайте это как абсолютное правило. Нажмите Cmd / Ctrl + F9 , чтобы открыть диалоговое окно «Градиент». Попробуйте использовать логотип на разных цветах и ​​формах фона.

09. Создание шаблонов доставки

При выборе шрифтов учитывайте свой бренд.

Выберите «Файл»> «Сохранить как»> «Шаблон Illustrator». Выбирайте шрифты, которые хорошо сочетаются с брендом. Создавайте руководства по стилю для дизайна: добавляйте разбивку цветов CMYK, шестнадцатеричные коды или коды Pantone и названия шрифтов — это полезно для дизайнеров и обеспечивает единообразие бренда.Также приведите образцы бренда на различных материалах.

Эта статья впервые появилась в журнале Computer Arts. Подписаться на Computer Arts .

Статьи по теме:

Вот как сделать логотип в Illustrator

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

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

5 шагов к созданию логотипа в Illustrator

Шаг 1. Настройте документ

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

Вначале о главном: начните работу с Adobe Illustrator.

Чтобы начать, нажмите кнопку « Создать новый » в левой части экрана. Затем выберите предустановки Letter . Большинство предустановок идеально подходят для базового логотипа, но быстро дважды проверьте, что ваши предустановки следующие:

  • Ориентация: портретный режим
  • Цветовой режим: CMYK Color
  • Растровые эффекты: высокий

Теперь, когда мы разобрались с этим, давайте продолжим и нажмем синюю кнопку « Create » и приступим к работе. .

Шаг 2. Настройте рабочее пространство

В Illustrator есть повторяющаяся тема: иногда первый шаг к пониманию того, как создать логотип, — это выбор правильных настроек.

Но когда вы думаете о том, как создать логотип в Illustrator, мы будем упрощать работу и использовать рабочее пространство Painting . Для этого щелкните значок Workspaces в правом верхнем углу экрана и выберите Painting.

Ознакомьтесь со всеми инструментами Adobe Illustrator.

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

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

Ах да, ваш логотип. Давайте сделаем настоящий рисунок.

Шаг 3. Начало работы с фигурами

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

Посмотрите скриншот ниже.Вы увидите, что мы начинаем с простой формы , , которую можно найти, щелкнув четвертый значок сверху, имеющий форму прямоугольника. Нажмите и удерживайте значок, чтобы просмотреть все параметры, включая инструмент «Прямоугольник» , инструмент «Эллипс», инструмент «Многоугольник», инструмент «Звезда» и инструмент «Отрезок линии».

У инструмента «Эллипс» в Illustrator есть несколько вариантов на выбор.

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

Это пример живой формы в Illustrator, которой можно управлять с помощью виджетов радиуса угла.

Для этого выберите инструмент Direct Selection Tool и перетащите его по углам, которые нужно отредактировать. Как только вы это сделаете, вы увидите виджет радиуса угла в каждом углу. Перетащите их к центру прямоугольника, чтобы изменить угол и размер всей формы.

Конечно, это только начало того, что (мы надеемся) станет более удобным логотипом. Теперь, когда у нас есть фигура, с которой можно работать, мы начнем добавлять линии, текст и другие элементы, чтобы наш логотип выделялся.

Шаг 4. Добавление линий, цвета и дополнительных объектов

Белый — отличный цвет, и когда вы думаете о том, как создать логотип, это может быть правильный цвет . Но давайте поиграем с несколькими другими цветами с помощью Swatches.

Чтобы добавить больше цвета к нашей фигуре ниже, щелкните инструмент выделения в верхней части главного меню.Затем щелкните в центре своей формы. Чтобы добавить цвет, выберите его в меню «Образцы». Чувствовать себя потерянным? Не волнуйтесь: мы сделали вам гифку.

Выбор доступных образцов в Adobe Illustrator

Теперь давайте добавим несколько линий, для которых нам нужно будет создать новый слой. Чтобы создать новый слой, перейдите в меню Layers и щелкните значок + . Это поместит ваш новый слой в верхнюю часть меню, что нам и нужно.

Большинство логотипов, которые вы видите в Интернете, были созданы с использованием нескольких слоев в Illustrator.

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

Чтобы добавить линию, выберите инструмент Pen Tool в главном меню. Затем наведите указатель мыши на центр изображения, пока не увидите слово «центр» маленьким фиолетовым текстом. Как только вы найдете центр значка, , удерживая клавишу Shift, щелкните .Чтобы создать линию, просто выберите край значка, который вы хотите провести, и щелкните край значка. Когда вы нарисовали линию, нажмите V, чтобы закончить. Повторите это столько раз, сколько хотите.

Рисовать линии в Adobe Illustrator проще, чем кажется.

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

Сделайте ваши линии более четкими в меню «Внешний вид». Сделайте ваши линии более четкими в меню «Внешний вид».

Хотите верьте, хотите нет, но это на самом деле дает вам хорошую основу для начала изучения того, как создать логотип в Illustrator. На скриншоте ниже вы увидите, что мы сделали именно это — только шаги, которые мы здесь рассмотрели. (Примечание: мы думали, что исходный цвет в слое 1 выглядел странно, поэтому мы изменили его на сплошной оранжевый цвет).

Вот пример логотипа, созданного с помощью Adobe Illustrator

Шаг 5: Добавьте текст

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

Для начала выберите инструмент Type Tool в главном меню. Затем перетащите его через раздел документа, чтобы открыть редактор.

Добавление текста к логотипу в Adobe Illustrator — обманчиво сложная задача.

Конечно, мы никогда не будем использовать стандартный текст lorem ipsum, который генерирует Illustrator. В только что созданном поле введите текст, который вы хотите включить в свой логотип. Затем выберите шрифт и размер шрифта в меню «Символ» в верхней части экрана.

Вот пример того, как мы можем изменить шрифты и размеры в Illustrator.

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

Добавление текста к логотипу выполняется перетаскиванием.

Так как мы использовали сплошной цвет для большей части нашего изображения, мы также сделаем текст белым. Для этого выделите текст и вернитесь в меню «Внешний вид». Теперь измените цвета Stroke и Fill на белый.

Используйте меню «Внешний вид», чтобы изменить цвет текста.

Важно отметить, что мы рассмотрели лишь несколько основ и лишь прикоснулись к тому, как создать логотип в Illustrator. Но, как видите, освоение основ — это первый шаг.Оттуда? Посмотрите, куда вас приведет ваше творчество.

Изучение каллиграфии в Adobe Illustrator

Дизайн логотипа Brushpen: разработайте свой фирменный стиль .

Дизайн логотипа

для новичков: как создать простой логотип в Adobe Illustrator

Разработка логотипа предполагает глубокий анализ компании, ее продуктов и ценностей. Один из лучших способов чему-то научиться — это сделать самому! В сегодняшнем уроке я покажу вам, как создать простой, профессионально выглядящий логотип в Adobe Illustrator.Фактически, я собираюсь создать две версии логотипа, чтобы вы могли выбрать тот, который вам больше всего нравится. Название компании, которое я собираюсь использовать в качестве примера, — Design Cats. Это небольшая команда молодых и увлеченных креативщиков, увлеченных свежим, несколько необычным, но все же элегантным дизайном. Я буду помнить об этом во время работы, чтобы убедиться, что логотип отражает дух и идентичность компании. Я воспользуюсь несколькими простыми действиями, которые помогут вам улучшить свои навыки работы с Illustrator. Поехали!

Круглый винтажный логотип

Идите вперед, откройте Adobe Illustrator и создайте новый файл.Я решил создать две монтажные области со следующими размерами: 1000 x 1000 пикселей. Первая версия логотипа имеет модный винтажный вид. Я воспользуюсь двумя элементами из этого набора значков. Скопируйте следующие рисунки в свой файл. Здесь вам не понадобятся все элементы, поэтому разгруппируйте их, выделив их и выбрав параметр «Разгруппировать» в меню «Объект». Теперь удалите текст и иллюстрации. Мне очень нравится лента на белом значке, поэтому я возьму ее и накрою на черный. Что касается шрифтов, я решил смешать их, используя три разных.Если вы хотите использовать свои собственные комбинации, вот несколько полезных инструментов, которые помогут вам комбинировать гарнитуры: fontpair.co, font-combinator.com, typegenius.com и typ.io http://typ.io/. Вам также следует ознакомиться с этими супер полезными практическими советами от Аарона Драплина. Для слова «КОШКИ» я использую шрифт Seaside Resort, а для слова «ДИЗАЙН» я использую шрифт Silverfake. Для мелких деталей я использую минималистичный Caviar Dreams. Выделите текст и преобразуйте его из шрифта в контуры.Вы можете сделать это, нажав «Тип»> «Создать контуры». Теперь вашим текстом можно легко манипулировать. Чтобы добавить теплые, но винтажные цвета, я решил использовать желтый, оранжевый и коричневый, но, конечно, вы можете их изменить. Я выбрал желтый цвет # EDB21E для основной части ленты; оранжевый # D95926 для задней части и коричневый # 592B1D для основного дизайна. Чтобы добавить немного искры и веселья в логотип, я хотел бы добавить несколько элементов в виде кошек. Я воспользуюсь одним из дизайнов из этого векторного набора. Скопируйте кота и сделайте его белым.Также поместите ленту немного ниже, только убедитесь, что ее углы соответствуют значку. Теперь вы можете начать размещать элементы на значке. Сначала переместите слово «ДИЗАЙН» поверх ленты и убедитесь, что угол ее совпадает с углом наклона ленты. Я немного изменил высоту текста, чтобы сделать его немного выше, и переместил его над лентой. Теперь переместите главное слово «КОШКИ» и поместите его слева от желтой ленты. Убедитесь, что его угол выровнен. С правой стороны есть место, куда можно поставить кошку.Вам не нужно трансформировать его, просто измените его размер, чтобы он соответствовал дизайну. Выделите слова «EST.» И «2015», уменьшите их и выровняйте угол наклона. Поставьте «EST.» Вверху значка по центру и «2015» внизу, также по центру. Вы можете выровнять их на глаз, но вы также можете провести линию от верхнего угла к низу и выровнять все элементы вокруг нее. Вуаля, первая версия логотипа готова!

Текстовый логотип

Второй вариант намного проще, но может отлично подойти для веб-сайта компании.Я воспользуюсь одним из моих любимых шрифтов под названием Coolvetica, чтобы набрать слово «дизайнерские коты». 160 pt — хороший размер для этого дизайна, учитывая, что вы использовали размеры, с которых мы начали. Выделите текст с помощью инструмента «Текст» и выберите только слово «кошки». Я изменю его цвет на приятный желтый, который будет контрастировать с черными частями рисунка. Используйте следующий цвет: # F9A21A. Теперь выберите инструмент «Перо» и, начиная с верхней части последней буквы, нарисуйте линию в виде хвоста. Обязательно выберите профиль ширины 2 на панели ширины и используйте обводку 18pt.Увеличьте масштаб до буквы «C» и снова с помощью инструмента «Перо» нарисуйте стилизованное кошачье ухо поверх нее. После того, как вы создали форму, которая вам нравится, выберите ее и в меню «Объект» выберите «Преобразовать»> «Отразить». Используйте параметр «Вертикально» и нажмите «Копировать». Теперь у вас есть 2 кошачьих уха. Поместите их поверх буквы «C», чтобы он выглядел симпатично и индивидуально. Вот и все!

Готово!

Поздравляю! Теперь у вас есть два разных логотипа для одной компании, и на основе того, что вы узнали сегодня, вы можете создать гораздо больше.Вот несколько моих любимых творческих ресурсов, которые помогут вам создавать потрясающие, профессионально выглядящие логотипы: Надеюсь, вам понравился урок. Пожалуйста, поделитесь своими мыслями и комментариями ниже. И никогда не переставай учиться! 🙂 Хотите узнать больше о дизайне логотипов? Ознакомьтесь с 5 характеристиками эффектного дизайна логотипа, основами дизайна логотипа для блоггеров и неожиданной историей, скрывающейся за четырьмя знаковыми логотипами.
Товаров показано в этом сообщении:

Приступая к работе с надписью от руки?

Рабочие листы для бесплатных надписей

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

Скачать сейчас!

20 руководств по созданию профессионального логотипа в Adobe Illustrator

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

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

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

Логотипы

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

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

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

Вот быстрое и простое руководство по созданию логотипа для очков. Этот логотип идеально подходит для оптометристов или магазинов очков. Он создан с использованием основных форм и инструмента «Перо».

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

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

Если вы готовы заняться дизайном своего винтажного логотипа, это руководство поможет вам.Примерно через 10 минут вы узнаете, как использовать различные эффекты шрифта в Illustrator для создания винтажного эффекта.

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

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

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

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

Как создать логотип плоской чашки

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

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

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

Это еще один урок по винтажному логотипу в видеоформате. Дизайн занимает менее 10 минут и использует широкий спектр инструментов и эффектов Illustrator для создания потрясающего винтажного логотипа.

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

Посмотрите эту коллекцию из 10 красивых логотипов от Envato Elements, разработанных в винтажном и ретро-стиле.Шаблоны — отличный выбор, когда вам в крайнем случае нужен дизайн логотипа.

Логотипы Monogram сложны и элегантны. Из этого видеоурока вы узнаете, как создать успешный логотип с монограммой и как сделать это самостоятельно с помощью Illustrator. Узнайте, как использовать инструмент для создания фигур и как добавить глубины и текстуры вашему логотипу с монограммой.

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

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

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

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

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

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

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

Все, что вам нужно знать о создании логотипов в Illustrator

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

Прежде чем мы зайдем слишком далеко, давайте поговорим о том, что именно вас просили сделать. Для начала, что такое логотип?

Элементы логотипа

Логотип — это графический элемент, который представляет что-то о компании и ассоциированном бренде.Большинство логотипов состоит из двух элементов: логотипа и логотипа .

Логотип представляет собой иллюстрацию или графику.

Логотип — это типографская обработка слова или фразы. Большинство логотипов каким-то образом стилизованы, но есть и такие, которые созданы с использованием оригинального шрифта или даже созданы вручную. Качества, отображаемые в логотипе, также говорят о бренде и его послании.

В качестве примера возьмем логотип Nike:

Логотип Nike состоит из двух отдельных элементов: галочки и слова «Nike». Галочка является логотипом, а «Nike» — логотипом.

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

Стилизованный логотип «NIKE». Логотип Nike не оставляет сомнений в том, что бренд — это уверенность и смелость.

Некоторые бренды выбирают только одно или другое. Например, Apple и Twitter выбрали логотип, а Canon — только логотип. FedEx пошла с логотипом, но таким способом, который создает дополнительную форму, создавая стрелку из отрицательного пространства между буквами E и x.

Создание сильного логотипа

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

1. Независимость от логотипа и логотипа. Важно, чтобы логотип и логотип работали вместе, чтобы поддержать бренд, но не менее важно — если не больше — чтобы каждый из них мог стоять самостоятельно.

Думаю об этом; вам не нужно ничего видеть, кроме этой галочки, чтобы знать, на какую марку снаряжения вы смотрите. А сколько раз вы видели толстовки с надписью «Nike»?

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

Вот еще несколько примеров логотипов, которые вы все равно узнаете без текста:

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

3.Ожидайте его использования. Подумайте о том, как ваш логотип может быть использован. Будет ли он крошечным, на стене здания, на шляпе, на торте, на экране или еще где-нибудь? Чем проще ваша оценка, тем легче ему будет справиться со всеми этими проблемами, не развалившись, или, что еще хуже, стоить вашему клиенту руки и ноги для воспроизведения.

Например, логотип Starbucks появляется на вывесках, упаковке и многом другом.

Кредит изображения: Алан Сунг / Flickr

Зачем создавать свой логотип с помощью Illustrator?

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

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

Когда вы работаете в Illustrator, вы работаете с векторами.

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

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

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

Шаги по созданию логотипа

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

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

Мы предлагаем следующий метод:

1. Проведите исследование

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

2.Понять миссию

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

Ожидает ли клиент нескольких форматов файлов? Ожидают ли они разных размеров для использования в социальных сетях? Сколько изменений вы хотите внести? Какой крайний срок? Все это следует продумать заранее.

Помимо логистики, для бесперебойной и успешной работы вам необходимо понимать их бренд: какой продукт или услугу предлагает компания? Кто их целевая аудитория? Кто их конкуренты?

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

3. Начало работы с бумагой

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

4. Перейти в Illustrator

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

5. Представить, исправить, доставить

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

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

У дизайнера Аарона Драплина есть отличное видео о процессе создания логотипа, которое вы можете просмотреть ниже:

Создание логотипа в Illustrator

Поначалу Adobe Illustrator может немного ошеломить своим множеством панелей и многим другим, но как только вы научитесь использовать программу, вы сможете многое с ней сделать.

Посмотрите видео ниже, чтобы узнать, как настроить Illustrator для создания логотипа:

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

Инструмент «Форма»

Используя сочетание клавиш M или щелкнув инструмент формы в меню инструментов, вы можете создавать прямоугольники, прямоугольники с закругленными углами, круги, многоугольники и звезды.

Видео ниже — отличное введение в инструмент Фигура для начинающих:

Инструмент «Перо»

Инструмент «Перо» (сочетание клавиш P) — один из наиболее сложных инструментов для использования в Illustrator, который отлично подходит для создания фигур произвольной формы.

Вы можете использовать игру Безье, чтобы точно понять, как работает инструмент «Перо».

Инструмент «Линия»

Добавьте тонкие или толстые линии в свой дизайн с помощью инструмента «Отрезок линии» (горячая клавиша \), отрегулировав размер штриха.

Инструмент Type

Добавьте свой логотип с помощью инструмента «Текст» (сочетание клавиш T).

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

С помощью инструмента «Текст» вы можете не только выбрать шрифт, но и отрегулировать интервал между буквами (кернинг) и интервал между строками (интерлиньяж).

Инструмент создания контуров

Помните, как я упоминал, что Illustrator отлично подходит для логотипов, потому что позволяет создавать векторы? Если вы хотите векторизовать свой текст, вы можете сделать это, щелкнув текст правой кнопкой мыши и выбрав Create Outlines .

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

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

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

Инструмент для создания фигур

Если вы хотите создать свой логотип полностью вне форм, инструмент Shape Builder Tool ( Shift + N ) — ваш новый лучший друг.Вы можете использовать это, чтобы эффективно комбинировать формы.

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

Вы можете увидеть, как именно конструктор фигур можно использовать в дизайне логотипа, в видео ниже:

Следопыт

Если вы находите инструмент Shaper Tool сбивающим с толку, панель Pathfinder ( Windows> Pathfinder ) предлагает более простой, но менее надежный метод объединения и вычитания объектов.

Инструмент цвета

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

Управление версиями вашего логотипа в Illustrator

У Аарона Драплина также есть несколько отличных советов для вашего процесса в Illustrator.Он рекомендует создать форму, продублировать ее, отработать вторую форму и продолжать делать это на протяжении всего процесса проектирования.

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

Увидеть все вместе

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

Что делать, если у вас нет иллюстратора?

Продукты Adobe дорогие.Если вы хотите начать карьеру в дизайне, вы, вероятно, захотите инвестировать в учетную запись Creative Cloud. Но если вы просто хотите создать одноразовый логотип, есть альтернативы, которые стоит рассмотреть.

Вы можете создать логотип с помощью Microsoft Word или с помощью бесплатных онлайн-генераторов логотипов. Несколько онлайн и настольных альтернатив Illustrator предложат вам аналогичные возможности.

Кроме того, вы можете получить Photoshop и Lightroom намного дешевле, чем весь пакет Adobe CC, поэтому вместо этого вы можете использовать Photoshop для создания логотипа.Только не забывайте, что Photoshop использует пиксели, поэтому ваш дизайн не будет масштабируемым.

Хотите быстро создавать другие типы визуальных эффектов? Попробуйте PicMonkey, чтобы получить мощные инструменты для дизайна и редактирования фотографий.

15 команд командной строки Windows (CMD), которые вы должны знать

Командная строка по-прежнему остается мощным инструментом Windows.Вот самые полезные команды CMD, которые должен знать каждый пользователь Windows.

Читать далее

Об авторе Нэнси Месси (Опубликовано 889 статей)

Нэнси — писательница и редактор, живущая в Вашингтоне.Ранее она работала редактором по Ближнему Востоку в The Next Web, а в настоящее время работает в аналитическом центре по коммуникациям и социальным сетям в Вашингтоне.

Более От Нэнси Месси
Подпишитесь на нашу рассылку новостей

Подпишитесь на нашу рассылку, чтобы получать технические советы, обзоры, бесплатные электронные книги и эксклюзивные предложения!

Нажмите здесь, чтобы подписаться

Как сделать логотип в Illustrator или без него в Интернете? -Начальный + Урок

Вступительное слово: Как сделать логотип в Illustrator для начинающих и выше? Вы найдете полные шаги по созданию логотипа самостоятельно в Illustrator, а также основные ярлыки Illustrator (в Windows).В части 1 мы собираем некоторые чтения логотипов и базовые советы по дизайну для начинающих, чтобы вы могли получить некоторые знания, а также почерпнуть вдохновение для разработки логотипа AI. Во второй части вы подробно ознакомитесь с этапами создания логотипа Adobe Illustrator. Наконец, мы представляем вам гораздо более простой способ создать бесплатный логотип в Интернете.

Часть 1 — Подготовка: освоите основные навыки разработки логотипа

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

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

Часть 2 — Как сделать логотип в Illustrator?

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

Если вы еще не установили Adobe Illustrator, мы прилагаем официальную ссылку для скачивания (7-дневная бесплатная пробная версия): https://creative.adobe.com/products/download/illustrator

Примечание: Мы будем использовать Adobe Illustrator CC 2019 для Windows в объяснении ниже.

Шаг 1. Создайте проект логотипа в Adobe Illustrator:

Откройте Illustrator, выберите [Создать] и введите размер вашего логотипа.

Шаг 2. Создание формы логотипа и текста логотипа в Illustrator:

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

A. Нарисуйте базовую форму в качестве основного элемента:

Попробуйте использовать инструмент «Эллипс», нажав «L», затем перетащите плоский эллипс с цветной заливкой.

б. Создайте графику как отрицательное пространство (путем копирования и поворота основного элемента):

Перейдите [Правка]> [Копировать]> [Вставить на место].Затем щелкните эллипс правой кнопкой мыши, выберите [Трансформировать]> [Повернуть…] и введите угол 60 градусов. Повторите все действия по 2 раза, чтобы получить симметричную графику.

Изображение: Как вращать фигуры и объекты в AI.

c. Объедините / объедините основные формы (объекты) как одну в Illustrator:

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

c1. Выделите все формы: возьмите инструмент выделения Illustrator (ярлык удерживает V и одновременно щелкает элемент — эллипс), затем нажмите Shift, чтобы выделить остальные эллипсы.

c2.Перейдите [Объект]> [Путь]> [Обводка контура]. Затем перейдите [Windows]> [Обработка контуров], щелкните значок «Объединить» под [Режимы формы:].

Изображение: Как объединить формы и объекты в AI.

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

г. Нарисуйте многоугольник:

Используйте [Инструмент многоугольника], чтобы нарисовать другой рисунок — шестиугольник — и изменить его цвет. Переместите его слой вниз для дальнейшего использования.

e.Минус и полый полигон графика:

Измените размер и положение фигуры и убедитесь, что все границы двух фигур касаются друг друга. Выделите две графики одновременно, затем перейдите [Обработка контуров]> используйте значок «Минус передний» в разделе [Режимы формы:].

Изображение: минус передний слой, разгруппировать и раскрасить каждую фигуру в AI.

е. Отделение и разгруппирование полого многоугольника и придание ему красочности:

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

г. Добавьте текст в качестве названия вашей компании:

Возьмите инструмент [T], выберите цвет и шрифт текста и введите название своей компании. Тогда ваш дизайн логотипа готов.

Шаг 3. Загрузите ваш логотип в Illustrator:

Перейдите [Файл]> [Экспорт]> [Экспортировать как…]. Затем Illustrator сгенерирует изображение вашего логотипа в файле SVG, JPG, PNG и т. Д.

Параметры вывода Adobe Illustrator:

  • Поддержка форматов растровых изображений: JPEG, BMP, DWG (чертеж AutoCAD), DXF (файл обмена AutoCad), CSS, EMF, SWF (Flash), TGA, TIFF, PSD, PCT (Macintosh PICT).
  • Поддержка векторных форматов: SVG, WMF.

Изображение: Загрузите и выведите свой логотип в векторные и растровые изображения.

Часть 3 — [Альтернативный логотип Illustrator] Как бесплатно создать свой логотип в Интернете?

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

По сравнению со многими простыми создателями логотипов, дизайнер логотипов Illustrator, кажется, проигрывает своим конкурентам по адресу:


  • Создание логотипа с нуля занимает слишком много времени и усилий.
  • Любая незначительная ошибка при навигации может испортить всю красоту логотипа и усложнить дизайн.

Если вы также находите Illustrator непростым делом и хотите более интуитивно понятное решение для логотипов, мы предлагаем конструктор логотипов DesignEvo в качестве альтернативы Illustrator?

Это универсальное решение для дизайна логотипа для всех (более 10 000 шаблонов логотипов, никаких навыков не требуется): https://www.designevo.com/logo-maker.

Изображение: онлайн-альтернатива Illustrator — бесплатный конструктор логотипов DesignEvo.

  1. Щелкните [Создать бесплатный логотип] на сайте DesignEvo.com.
  2. Найдите шаблон, пробуя разные ключевые слова, и выберите шаблон, который вам больше всего нравится.
Оставить комментарий

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *