Создание спидометра часть 2.

[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]

Страница 1 из 1
1

Форум » GTA Vice City » Моделинг/Анимация » Создание спидометра часть 2.

VintProg

Дата: Воскресенье, 07.08.2011, 11:02 | Сообщение # 1

Новичок

Группа: Администраторы

Сообщений: 193

Репутация: 9

Статус: Offline

Рисуем спидометр (Speedometer Design From Scratch)

В этом уроке мы разберем, как легко и быстро можно нарисовать спидометр. Вы узнаете, что такое текст по контуру, как использовать инструмент Pen, как работать со слоями-фигурами, и многое другое. Итак, начнем.
Вот что мы будем делать:

Создаем документ
Создаем новый документ (Ctrl + N) размером 800 х 600 пикселей, цвета фона любой. Задаем рабочий цвет #353535, фоновый цвет #161616, выбираем инструмент Gradient (G), на панели настроек отмечаем «радиальный градиент».

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

Рисуем шкалу спидометра

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

Посередине нашего документа создаем контур в виде круга.
Подсказка:
Удерживайте клавишу Shift, когда рисуете круг, это поможет создать именно ровный, правильный круг, а не эллипс.
(прим.: еще одна подсказка от переводчика: на панели настроек прячется менюшка Ellipse options (выпадающий список, отмечен зеленым на рисунке выше), где можно задать, что круг у нас будет именно кругом, а не эллипсом, а также задать создание фигуры от центра и всякие другие полезности).

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

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

Когда все линии готовы, выделяем последнюю группу линий и перекрашиваем их в красный цвет.

Используя уже знакомую нам технику, создаем еще один круглый контур чуть меньшего диаметра, расположенный внутри первого и с помощью инструмента Type размещаем по контуру точки.
(прим.: для удобства можно перейти на вкладку Paths, выбрать в меню Edit>Transform path>Scale и изменить размер круга, задав, например, 95%).

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

Рисуем внутренний круг спидометра

Выбираем инструмент Ellipse (U) и на новом слое, расположенном под слоем со шкалой, рисуем круг. Он должен быть чуть больше, чем наша шкала с делениями.

Далее, применяем к получившемуся кругу следующие эффекты:

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

Вот что у нас должно получиться:

Рисуем внешний хромированный круг

Снова воспользуемся инструментом Ellipse (U) и нарисуем еще один круг, опять немного больше предыдущего. Слой с новым кругом должен находиться под предыдущим слоем.

Применяем к этому слою следующие эффекты:

Должно получиться что-то вроде этого:

Переходим к созданию стрелки спидометра. Начнем с ее основания.

Проделываем над этим слоем следующие манипуляции:

Вот что должно получиться:

Снова выбираем инструмент Ellipse (U) и рисуем маленький круг белого цвета (#ffffff) внутри предыдущего круга. Устанавливаем непрозрачность 5%.

Рисуем стрелку спидометра

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

Потом выбираем инструмент Pen, на панели настроек кликаем по иконкам Paths и Add to Shape Area («Добавить к области фигуры»).

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

После этого применяем к этому слою следующие эффекты:

Мы должны получить примерно вот что:

Оживим наш рисунок, добавив блики

И напоследок, я покажу вам, как добавить блики. Выберем инструмент Polygonal Lasso (L) и сделаем выделение, показанное на рисунке:

Залейте выделение белым цветом (#ffffff) (прим. – предварительно неплохо бы создать новый слой), потом загрузите выделение внутреннего круга спидометра.

Подсказка:
Для того, чтобы быстро загрузить выделение объекта, просто кликните по его иконке на панели Layers, удерживая клавишу Ctrl. Другой способ – выбрать в меню Select > Load Selection.

Теперь идем в меню Select > Inverse (Ctrl + Shift + I), и удаляем лишнее, нажав клавишу Del. У нас должна остаться часть белой фигуры, ограниченная кругом спидометра.

Снова выбираем инструмент Polygonal Lasso и создаем выделение посреди белой фигуры. Удаляем это выделение, нажав Del.

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

Теперь мы нарисуем большой блик на ободке нашего спидометра. Воспользуемся инструментом Elliptical Marquee (M) и создадим эллипс на внешнем круге спидометра слева вверху. Зальем выделение белым цветом (#ffffff).

Выберем в меню Edit > Transform > Warp, в выпадающем меню выберем Arc.

Переместим опорную точку так, чтобы получить выгнутую фигуру, затем с помощью команды Free Transform (Ctrl + T) повернем ее так, чтобы он соответствовал изгибу внешнего круга.

Размоем полученную фигуру, выбрав в меню Filter > Blur > Gaussian Blur и указав радиус 3-4 пикселя. Установим непрозрачность слоя примерно 70%.

Заключение

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

Автор: Richard Carpenter
Оригинал статьи: Speedometer Design From Scratch
Перевод: Maroussia

Теперь чтобы его запрограммировать в GTA надо смотреть это

GTA сайт