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


Создание иконки – электрогитара

Обучение Автор: design_class
Аватар

04 апреля 2011





5331
5

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

 


 

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

Знакомимся — Fender Stratocaster. На таком инструменте играют Ингви Мальмстин и бывший вокалист «System of a Down» Серж Танкян. Например, вот такие замечательные изображения должны нам помочь:

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

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

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

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

Когда кривая готова, жмём Ctrl+Enter, образуется область выделения. Ее заливаем аккуратно в пустом слое черным цветом. Аналогично отрисовываем кривой белую поверхность (деку).
Потом выделяем все что есть в черном слое (Ctrl+клик на иконке в палитре слоев). Выделение уменьшаем на 1 пиксел, с помошью меню «выделение», опции модификация — уменьшить область выделения, там в настройках указываем 1 пиксел:

 

 

 

 

 

 

 

 

В новом слое вызываем контекстное меню (правой кнопкой мыши), выбираем «Выполнить обводку», задаем параметры: 1 пиксел, сглаживание, без размытия.

Резиночкой (Eraser tool) вытираем блик там, где его не должно быть:

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

Еще мне не нравится черный цвет корпуса, уж больно он тяжелый. Заменил его параметрами наложения: градиент и тиснение.

Аккуратный градиент добавляем и к белой деке:

Видите маленькие черные болтики, которыми дека крепится к корпусу? Рисуем их квадратиками по 2 на 2 пиксела, черными или темно-серыми. В дальнейшем я уменьшил их прозрачность, чтобы они смотрелись «мягче».

 

 

Красота.

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

Потом мы ее дублируем, сдвигаем, копируем еще раз; и вот эту третью поворачиваем куда следует:

Потом объединяем их в один слой, и делаем потемнее, с помощью опции «Тон-насыщенность-яркость» (точно не помню, в общем вызываем его клавишами Ctrl+U):

Идём на кухню, курим в окошко, возвращаемся, включаем погромче «Шоу маст гоу он», рисуем гриф.

Создаем для него папку и слои:

По английски «гриф» звучит как fingerboard.

Students frequently ask me what for do I give english names for layers and folders. I think it’s a funny way to improve my English.

Гриф на исходном изображении скошенный. если попробовать тоже нарисовать его кривыми, в лоб по исходнику — получится корявая фигулина с битыми пикселами. Поэтому для начала рисуем прямоугольник, с округлым левым краем (как у оригинала). Потом выделяем по ряду пикселов сверху и снизу, и резиночкой с прозрачностью 40 % стираем часть грифа. Не помню точно какой был диаметр кисти эрейзера, но примерно как гриф по длине. Два движения мышкой — и готово.

На нижнем рисунке видно что получилось в итоге. Отодвигаем картинку (то есть масштаб делаем 100%) и смотрим — кажется, получилось.

Если вы держали в руках этот инструмент (мне посчастливилось), то заметили что гриф не плоский, как у акустической гитары, а дугообразный в сечении. Придаем ему видимость объема слоем-обтравочной маской, в котором рисуем градиент:

Замечаем, что одну штуковину мы не нарисовали — это небольшой выступ справа на грифе. Рисуем его аккуратно пикселами:

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

Поверх грифа делаем еще один слой-обтравочную маску, в созданных областях зарисовываем:

Чтобы порожки не резали глаз, затираем их сверху и снизу резинкой:

И рисуем метки на грифе, так же как делали болтики для деки:

Ставим их куда надо, делаем светлее с помощью уже знакомой команды Ctrl+U.

Рисуем форму головки грифа точно так же, как делали форму резонатора и деки:

Естественно, она в новом слое, ниже грифа. Вот свойства:

Дальше рисуем колки — болтики на грифе, на которые натягивают струны.

В новом слое рисуем аккуратные кружочки:

Двигаем на наш рисованный гриф, задаем слою свойства:

Делаем в новом слое еще кружочек для самого поворотного механизма:

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

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

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

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

Потом несколькими линиями рисуем ее правый край (он приподнят и загнут, у него есть тень)

Струны рисуются довольно просто – шесть параллельных линий, толщиной по 1 пикселу, через два пиксела каждая. Одна деталь: если линии в 1 пикс. толщиной задать неполную прозрачность, то она будет казаться тоньше. Струны я рисовал с такими прозрачностями: 100, 70, 60, 50, 40, 20 %.

Возле колков они затемнены. это делается инструментом «Затемнитель» (Burn Tool).

Это уже красоты на подставке:

Создаем новую папку и слой

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

Дублируем, размножаем ее, в новом слое рисуем тоже пикселями элементы  подставки сверху и снизу:

Смягчаем резинкой с прозрачностью:

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

Еще двумя линиями рисуем форму для его тени, размываем инструментом Blur:

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

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

Просто слой с кружком

Просто тень и просто тиснение, а потом слои размножаем и рисуем 1-пиксельной белой линией указатели:

Аналогично рисуем ещё-какой-то-там-выключатель. Линия под 45 градусов, квадратик рычажка сверху.

Это гнездо под джек (штекер по-нашему).

Создаем под него форму кривыми, вырезаем кружочек крепёжного болтика, задаем свойства:

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

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

Мы забыли на корпусе сделать крепеж для ремня. Рисуем, применяем градиент.

Дальше наводим красоту. Создаем новый слой над слоями деки резонатора, звукоснимателей, ну, скажем, light.

Выделяем все что есть в слое корпуса, отсекаем часть выделения. Заливаем эту область белым цветом в новом созданном слое light. Присваиваем ему парараметр «Перекрытие» (Overlay), уменьшаем прозрачность, часть затираем — такие эффекты хороши когда с одной стороны блик затерт в ноль, а с другой имеет резкую границу.

Вот и все.

 

Автор статьи Семён Лобач

 

Метки: , , , ,

Предыдущий пост

VN:F [1.9.10_1130]
5

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