Яндекс.Метрика

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

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

27 мая 2013 | Опубликовано в Уроки | 12 Комментариев »

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

  • Программа: Adobe Illustrator
  • Версия: CS5
  • Сложность: Beginner
  • Время: 1 hour

Конечный результат:

Шаг 1

Создайте новый файл в Illustrator и выберите инструмент Ellipse Tool (L). Нарисуйте широкий эллипс и залейте его цветом CMYK = 15, 40, 74, 1.

Шаг 2

Выберите прямоугольник с закругленными углами, установите в настройках радиус 50px и создайте нижнюю часть булочки. Залейте ее тем же цветом, который использовали для верхней части. 
hamicon-02

Шаг 3

Теперь нарисуйте еще два прямоугольника со скругленными углами.  На этот раз сделайте их тоньше и залейте цветом CMYK = 25, 52, 65, 71.

hamicon-03

Шаг 4

Выберите Ellipse Tool (L) и нарисуйте небольшие эллипсы — кунжут. Заполните их CMYK = 5, 21, 42, 0.
hamicon-04

Шаг 5

Следующий шаг заключается в том, чтобы создать сыр. Выберите Pen Tool (P) и нарисуйте расплавленный ломтик сыра между двумя гамбургерами. Цвет, который мы использовали — CMYK = 0, 27, 85, 0.

Шаг 6

Скопируйте форму с сыром и переместите ее вниз на 10px. Измените цвет на CMYK = 0, 27, 85, 30. Нажмите A, чтобы выбрать инструмент Direct Selection Tool, и измените опорные точки, чтобы создать 3D эффект. 

Шаг 7

Отлично. Приступим к созданию булочки. Выберите Pen Tool (P) и нарисуйте форму, как на первом изображении. Затем, удерживая Shift , выберите верхнюю форму булочки и нажмите кнопку Intersect (Пересечение). Затем скопируйте полученную форму и отобразите ее по горизонтали и переместите на другую сторону. Если у вас есть планшет, вместо этого можно использовать инструмент Path Eraser Tool. 


hamicon-071

hamicon-073

Шаг 8

Повторите предыдущий шаг для другой части булочки.

 

Шаг 9

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

Шаг 10

Выберите инструмент Pen Tool и нарисуйте форму, как на первом изображении. Дублируйте нижнюю форму булочки. Выделите только-что созданную с помощью инструмента Pen Tool фигуру и, удерживая Shift, нажмите на нижнюю булочку. Нажмите на кнопку Intersect (Пересечение). Измените цвет этой формы на CMYK = 15, 31, 50, 0. Затем копируйте форму, отразите по горизонтали и поместите на другую сторону булочки.

hamicon-101

Шаг 11

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

Шаг 12

Наша иконка гамбургера готова. Теперь создадим еще одну иконку с одного цвета. 

Выберите гамбургер и, удерживая Alt, перетащите его на любое место холста.  Это позволит создать копию гамбургера. Начните с выбора зерен кунжута(выберите первое зерно, а затем, удерживая  Shift, — все остальные). Перейдите к Object-> Paths-> Offset Path и выберите 5px. Затем, удерживая Shift, выберите верхнюю форму булочки. Нажмите кнопку Subtract (вычитание).Переместить форму булочки на 20px вверх (Shift + Up X2).


Шаг 13

Сделайте аналогичные шаги с остальными формами (удалить темно-желтые формы под ломтиками сыра).

Шаг 14

С помощью инструмента Pen Tool сделайте края более гладкими.

Шаг 15

Вот и все. Теперь вы можете редактировать иконку, уменьшить ее или добавить нужные эффекты. Перед тем, как объединить  все формы иконки можно создать копию иконки, чтобы в дальнейшем можно было редактировать ее. 
hamicon-15

Варианты:

Автор: Alan Klim

Перевод — Дежурка

Смотрите также:




Комментарии

  1. Merziuz
    Thumb up Thumb down 0

    wLAx7Z pills2sale.com viagra online

    Ответить

  2. Moses
    Thumb up Thumb down 0

    Is it convenient to talk at the moment? oxandrolone for sale canada The flood insurance program is broken. It is hopelessly mired in debt. By attempting to undue common sense reforms, lawmakers are doing their constituents, taxpayers, and the program a great disservice. For NFIP to slip further into insolvency would dramatically undermine support for the program even further and embolden efforts to discard it entirely.

    Ответить

  3. Riley
    Thumb up Thumb down 0

    I'm retired virility health ltd uk I've got an Acer A700 which has a 1920x1200 screen but I assume the desktop will be actually 1920x1080. The A700 can feel laggy at points in sharp contrast to the Asus Transformer Infinity which has the same screen resolution and processor (clocked a little higher) but feels much smoother.

    Ответить

  4. Casey
    Thumb up Thumb down 0

    Photography lamictal for anxiety attacks The frown-faced Internet sensation, real name Tardar Sauce, is now the “spokescat” for a Friskies brand of cat food, Nestle Purina PetCare announced Tuesday. The St. Louis-based company didn’t release terms of the deal.

    Ответить

  5. Addison
    Thumb up Thumb down 0

    We're at university together imiquimod creme preo Funds that hold stocks of companies outside the UnitedStates have been popular and attracted $13.2 billion so far inAugust, TrimTabs said. Those inflows have come even as the MSCIworld-equity index declined 1.24 percent.

    Ответить

  6. Gabriel
    Thumb up Thumb down 0

    I live in London benadryl taken off market Altamont and its partners could end up owning as much as40.5 percent of Billabong if all the options and preferenceshare issues are exercised as part of a longer-term refinancingagreed with Altamont and GE Capital.

    Ответить

  7. Edmond
    Thumb up Thumb down 0

    Are you a student? enduraflex 1988 Instead, the most recent gains in British economic activityappear to be linked to two factors that helped cause the lastglobal financial crisis — debt-fuelled consumer spending andhigher house prices.

    Ответить

  8. Israel
    Thumb up Thumb down 0

    History lamotrigine 25 mg chewable dispersible tablet side effects That notion was again rejected by the Treasury and the White House, which have said that it would be the «height of irresponsibility» to leave the US government with only small amounts of cash in hand and no authority to borrow to pay its bills.

    Ответить

  9. Gabriella
    Thumb up Thumb down 0

    this post is fantastic benicar hct reviews True, maintaining their unprecedented 15-year rise, bookended by Toy Story and Toy Story 3, has not been easy. They’re no longer the maverick outsider, nimbly taunting the big studios with their indie credibility; since being bought by Disney for $7.4 billion in 2006, Pixar is now most definitely the mainstream — just one judged on a perilously steep curve.

    Ответить

  10. Mitch
    Thumb up Thumb down 0

    Please call back later ubat cytotec di malaysia More positively for Dell, sales from the enterprise solutions, services and software business climbed 9 percent to $5.8 billion, reflecting an increased focus on investing in providing services to corporations and government agencies.

    Ответить

  11. Lawrence
    Thumb up Thumb down 0

    What sort of music do you listen to? propranolol migraine starting dose In addition, the outbreak did not come from areas with poorer socioeconomic households, where there may be less access to health care. Instead the clusters of both pertussis infections and those who opted out of vaccinations were in areas with higher socioeconomic characteristics.

    Ответить

  12. axvbca
    Thumb up Thumb down 0

    rzgHJ3 mxrqdfogpkya, [url=http://nugdidgzmwzi.com/]nugdidgzmwzi[/url], [link=http://mzlblvqokkzh.com/]mzlblvqokkzh[/link], cpwpjftfnhmy.com

    Ответить

Оставить ответ


6 + = двенадать

Вставить изображение