Как сделать рамку в illustrator

Обновлено: 04.07.2024

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

Содержание:

Почему логотипы делают в иллюстраторе

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

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

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

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

  • в каком стиле будит выполнен ваш логотип;
  • будет ли он содержать рисунок и надпись, либо же только рисунок или только надпись.

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

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

  1. Текстовый логотип:
    • аббревиатура;
    • слово (название компании).
    1. Графический логотип:
      • торговый знак или символ;
      • объемный или 3d;
      • абстрактный рисунок;
      • в виде персонажа.
      1. Комбинированные логотипы:
        • текст и графика;
        • эмблема компании.

        Как перерисовать логотип в иллюстраторе

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

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

        Если вы используете какие-нибудь надписи стоит подобрать нужный вам шрифт.

        В конечном итоге вы получите желанный логотип со всеми цветами и формами.

        Как сохранить логотип в AI

        После того как вы завершили создание своего логотипа его следует сохранить в правильном формате. Самые распространенные форматы для сохранения готовых работ являются: AI .EPS .PDF. Разберем возможности каждого формата по отдельности.

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

        Eps – широко применяется для печати логотипов в полиграфии. Так же при масштабировании логотипа качество изображения не теряется. Позволяет одновременно использовать как векторную так и растровую графику в логотипе.

        Pdf – позволяет без искажений отображать шрифты, векторные и растровые элементы использованные при создании логотипа.

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

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

        Перво-наперво нам необходимо включить отображение линейки в нашем документе. Это можно сделать нажав правой кнопкой мыши и выбрав «Показать линейки» или сочетанием клавиш Ctrl+R.

        Модульная сетка

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

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

        Видео уроки по созданию логотипа

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

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

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

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

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

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

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

        О том как использовав простые инструменты (прямоугольник и градиент) в создании логотипа можно посмотреть в видео ниже.

        Наглядное видео по созданию объемного объекта в качестве логотипа.

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

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

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

        Шаг 1. Создаем новый документ в иллюстраторе и начинаем творить. Берем инструмент Кисть-клякса (Blob Brush Tool или Shift-B) и начинаем рисовать наш узор. Кстати, чтобы облегчить себе работу по рисованию, вы можете заблаговременно сделать наброски на листе бумаги карандашом или ручкой (смотря что есть под рукой), потом отсканировать или сфотографировать ваш рисунок и забросить в программу иллюстратор (только не забудьте его закрепить чтобы он не мешал), и уже в программе его обрисовать. Вот к примеру такой рисуночек получился у меня.

        как нарисовать рамку в иллюстраторе - шаг 1

        Шаг 2. Далее выбираем инструмент Поворот (Rotate Tool или R) и с зажатой клавишей Alt клацаем нашей мишкой ниже самого рисунка, тем самым определяя центр вращения(как в примере). При этом отрывается окно настроек, в котором мы указываем угол вращения, я выбрала 45 градусов (угол поворота должен в сумме давать 270 градусов) и нажимаем Копировать.

        как нарисовать рамку в иллюстраторе - шаг 2

        Шаг 3. Смотрим что получилось. Если результат вас устраивает то нажимаем Ctrl + D, что позволяет повторить предыдущие манипуляции и снова сделать поворот нашего рисунка. Если же нет, то возвращаемся на шаг назад и снова проделываем шаг 2.

        как нарисовать рамку в иллюстраторе - шаг 3

        Шаг 4. Вот такая у нас в итоге должна получится рамка. Как по мне то очень даже симпатичная, даже не смотря на то что она черно-белая. Представьте себе какая будет красота, если добавить цвет.

        как нарисовать рамку в иллюстраторе - шаг 4

        как нарисовать рамку в иллюстраторе - шаг 5

        как нарисовать рамку в иллюстраторе - шаг 6

        как нарисовать рамку в иллюстраторе - фото рамки

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

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

        А какие рамки создали вы? Прошу поделиться вашим творчеством в комментариях ниже.

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

        Уровень сложности

        Программы и устройства для работы

        Используемые инструменты

        Что такое текстура бесшовная?

        Говоря простым языком, бесшовная текстура представляет собой определенный образец (рисунок), который соединяется с своими близнецами без заметных границ (при размещении бок о бок «шва» картины видно не будет).

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

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

        Бесшовные текстуры делятся на:

        • горизонтально бесшовную текстуру (соединять можно только по горизонтали);
        • вертикально бесшовную текстуру (соединять можно только по вертикали);
        • бесшовная текстура (соединять можно и по горизонтали и по вертикали).

        Основная концепция бесшовной текстуры проста: если объект в шаблоне (например, камни в каменной стене) выходят за пределы края, часть объекта, которая выходит должна существовать в этом шаблоне на противоположной стороне.

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

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

        Как сделать текстуру в иллюстраторе и к тому же бесшовную?

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

        бесшовная текстура пингвин

        Шаг 1: Установка монтажной области

        Выберите размер и форму Вашего будущего рисунка. В этом примере я использовала квадрат. Монтажная область будет вашим «гидом» и поможет вам визуализировать 4 стороны вашей текстуры.

        создание бесшовной текстуры - шаг 1 монтажная область

        Шаг 2: Разместите объекты

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

        создание бесшовной текстуры - шаг 2 создание обтравочной маски

        Шаг 3: Скопируйте шаблон

        создание бесшовной текстуры - шаг 3 копирование шаблона

        Шаг 4: Скопируйте и вставьте ваши фигуры

        Теперь происходит волшебство. Переходим в дубликат квадрата (в Illustrator вы можете дважды щелкнуть объект находящийся в маске для редактирования его содержимого) и выбираем все объекты, которые выходят за пределы края. Копируем их в дубликате квадрата и вставляем все скопированные объекты в том же месте.

        создание бесшовной текстуры - шаг 4 размещение фигур

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

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

        создание бесшовной текстуры - шаг 5 проверка на непрерывность шаблона

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

        В вашей практике, наверное, неоднократно возникала ситуация, когда ограничивающая рамка (Bounding Box) располагается под «неудобным» углом и вам необходимо изменить ее для того чтобы произвести правильную трансформацию объекта или нескольких объектов. Вполне закономерно у вас возникает вопрос, как развернуть ограничивающую рамку в Adobe Illustrator? Если вы искали ответ, то знаете, что до сегодняшнего дня его просо не существовало. Да, я знаю, как это сделать, и хочу поделиться с вами.


        Ограничивающая рамка используется в Illustrator для трансформации объектов при помощи таких инструментов, как Selection Tool (V), Scale Tool (S), Shear Tool и Free Transform Tool (E). Также от положения рамки зависит, каким образом будет происходить трансформация. На рисунке ниже показан один и тот же объект, но с разным положением ограничивающей рамки и результаты его трансформирования при помощи Selection Tool (V).


        Я думаю, вы видите, как важно уметь управлять положением рамки.

        Для поворота ограничивающей рамки необходимо выделить одну опорную точку при помощи Direct Selection Tool (A) и перейти Object > Transform > Rotate… и в открывшемся диалоговом окне ввести угол поворота. В результате рамка примет необходимое положение.


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


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


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

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


        Вам может показаться утомительным, поворачивать рамку каждого объекта, тем более, если вы работаете с большим количеством таких объектов, поэтому я предлагаю вам еще один способ поворота общей ограничивающей рамки. Выделяем все объекты и переходим Object > Transform > Rotate… и в открывшемся диалоговом окне вводим угол поворота.



        Переходим Object > Transform > Reset Bounding Box.


        Теперь нам необходимо повернуть объекты в исходное положение, переходим Object > Transform > Rotate… и в диалоговом окне вводим угол поворота ограничивающей рамки только с противоположным знаком.



        Как я нашел такое простое решение? Признаюсь, это произошло совершенно случайно. Мне нужно было повернуть ограничивающую рамку и у меня ничего не получалось. Я искал ответ на форумах, спрашивал авторитетных дизайнеров и разработчиков, но получал лишь один ответ – это не возможно сделать в Adobe Illustrator. Делая очередной эксперимент, я случайно выделил не весь объект, а только одну его точку… ну, а что произошло дальше, вы уже знаете. Когда вы не сдаетесь и продолжаете искать – случай становится закономерностью. И это далеко не первый раз, когда я нахожу «случайные» решения. Например, я открыл, как разрезать Gradient Mesh. Подбор цветов в моих векторных работах также часто носит случайный характер. Как говорится: ищите и найдете!

        Создание pattern brush у многих дизайнеров, даже опытных, вызывает некоторые трудности. В сегодняшнем уроке я расскажу, как правильно создавать такую кисть в Adobe Illustrator. Для создания элементов векторного орнамента мы будем использовать InkScribe Tool плагина DrawScribe, что позволит работать более эффективно.

        Шаг 1

        Давайте начнем наш урок с создания элементов орнамента винтажной рамки. Для создания орнамента я предпочитаю использовать InkScribeTool. Этот инструмент позволяет нам работать более быстро и точно, чем, используя старый добрый Pen Tool (P). В этом вы убедитесь в процессе нашей работы. Итак, берем InkScribe Tool и создаем путь, который состоит из четырех прямолинейных сегментов.


        Как вы видите, сегменты имеют "ручки призраки". Это обычные ручки, которые содержит кривая Безье, но пока не активные. Мы создаем форму листка и она должна быть симметричной. Сейчас мы применим один трюк, который поможет вам создавать динамические симметричные формы. Выделяем созданный путь, затем переходим Effect > Transform & Distort > Transform… и устанавливаем параметры, указанные на рисунке ниже.



        Шаг 2

        Теперь, если мы активизируем одну из "ручек призраков" при помощи InkScribe Tool, то увидим, что наша форма изменится симметрично. Этот трюк позволяет нам правильно оценивать всю симметричную форму целиком.


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


        Шаг 3

        Как вы понимаете, у нас существует только один путь. Левая половина формы это всего лишь его отображение, полученная при помощи эффекта. Для дальнейшей работы нам потребуется сделать ее реальной. Переходим Object > Expand Appearance.


        Разгруппировываем полученные объекты два раза, затем выделяем верхние точки касания путей и соединяем их (Command / Ctrl + J). Те же действия проделаем с нижними точками касания путей.



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

        Шаг 4

        Создадим вертикальную линию в центре листа и применим к ней треугольный профиль в панели Stroke.


        Теперь создадим два криволинейных сегмента и применим к ним тот же профиль.


        Шаг 5

        Выделяем эти три пути, затем переходим Object > Expand Appearance.


        Объединяем полученные объекты при помощи Unite в панели Pathfinder.


        Теперь выделяем все созданные объекты, затем нажимаем Minus Front в панели Pathfinder. Удалим лишние точки при помощи функции Smart Remove point инструмента InkScribe.





        Шаг 6

        Создадим две окружности при помощи Ellipse Tool (L), затем соединим их центры вертикальной линией.


        Группируем все созданные объекты (Command/ Ctrl + G).

        Шаг 7

        Выделяем группу, берем Rotate Tool (R) и, удерживая клавишу Option / Alt, кликаем в центре нижней окружности. Устанавливаем угол равный 90 градусов в открывшемся диалоговом окне, затем нажимаем на Copy.


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


        Шаг 8

        Выделяем все объекты, затем переходим Object > Transform > Rotate… и устанавливаем угол равный 45 градусам.


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


        Выделяем и группируем все созданные объекты.

        Шаг 9

        Перетаскиваем группу вправо, удерживая клавиши Shift и Option/Alt, что приведет к ее дублированию.


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


        Шаг 10

        Берем Scissors Tool (C) и разрезаем правую окружность в точке A.


        Сместим нижнюю точку вместе разреза вправо.


        Соединим точки A и B при помощи InkScribe Tool. В панели InkScribe выбраны опции "Draw a curved segment” и "Smooth point”. Эти опции позволяют нам сразу создать плавный переход криволинейного сегмента в прямолинейный в точке B.


        Манипулируя ручками точек криволинейного сегмента A и B, приведем его к виду, показанному на рисунке ниже.


        Шаг 11

        Создадим еще два криволинейных сегмента при помощи InkScribe Tool.


        При помощи Spiral Tool создадим две спирали и поместим их так, как показано на рисунке ниже.


        Создадим две окружности и поместим их на концах спиралей.


        Шаг 12

        Создадим два эллипса.


        Выделим их, затем нажмем на Minus Front в панели Pathfinder.


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

        Шаг 13

        Группируем все объекты второго элемента орнамента. Теперь выделим его и переходим Object > Transform > Reflect…, выбираем Horizontal Axis в диалоговом окне и нажимаем на кнопку Copy.


        Переместим новый элемент орнамента горизонтально вправо.


        Шаг 14

        Выделяем третий элемент орнамента, затем переходим Object > Transform > Rotate…, и устанавливаем угол, равный -90 градусов, затем нажимаем на кнопку Copy.


        Помещаем четвертый элемент ниже первого. Для правильного позиционирования вы можете воспользоваться вертикальной направляющей.


        Шаг 15

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


        Выделяем вертикальную направляющую, затем переходим Object > Transform > Move… и устанавливаем величину горизонтального смещения влево, нажимаем на кнопку Copy.


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


        Шаг 16

        При помощи InkScribe Tool или Pen Tool (P) создаем путь, который состоит из двух прямолинейных сегментов. Точки этого пути должны точно лежать на правой и верхней направляющей.


        Используя эту технику, создадим еще два пути так, как это показано на рисунке ниже.


        Теперь направляющие могут быть удалены.

        Шаг 17

        Все элементы нашего векторного винтажного орнамента готовы, давайте приступим к созданию pattern brush. Нам необходимо определить основные элементы кисти. Площадь угловой плитки выделена красным цветом на рисунке ниже.


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


        Шаг 18

        Площадь боковой плитки выделена синим цветом на рисунке ниже.


        Нам необходимо ограничить площадь плиток реальными векторными объектами. Это должны быть прямоугольники без заливки и обводки.


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

        Шаг 19

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


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


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


        Шаг 20

        Открываем панель Brushes (Window > Brushes) и выбираем New Brush в сплывающем меню.


        В открывшемся диалоговом окне выбираем Pattern Brush.


        Применяем к side tile и corner tile "pattern swatches”, которые мы создали в предыдущем шаге. Для того чтобы цвет кисти соответствовал цвету обводки выбираем Colorization method: Tint


        Нажимаем OK. Создадим прямоугольник произвольного размера и применим к нему созданную кисть.


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


        Не расстраивайтесь, если с первого раза у Вас не получится точно состыковать элементы орнамента. Я должен признаться, что это очень кропотливая работа и у меня это получилось далеко не с первого раза. Для точной стыковки элементов вы можете просматривать их в режиме Outline preview (Command / Ctrl + Y).

        Читайте также: