Поисковая форма:) поиск по free-lance.ru Топ/история/обновления фриланса, по разным параметрам (темы, сообщения, пользователи...) Автоматическое удаление постов от ненужных юзеров в топике (php скрипт) Досье(точный ник)
 

Ник (или часть ника):
?
Какой текст ищем:
?
Раздел блогов:
За срок
дней
Тип поиска: (по вхождению: по тексту гуг выдаст посты с "гуг", "гугл", "огугл"; "полнотекстовый": по тексту "гуг" выдаст посты только с "гуг")
По вхождению строки:  Полнотекстовый: 
(поиск не 100% актуальный, есть определённая задержка при обновлении данных для поиска. )
0 Всего найдено: 47
stre_kaza Сообщение 13/07/2010 11:23 Копия темы
Урок) в жж дополненный и исправленный. Подробнейшая портянка текста и пикселей о том, как я делаю иконки в Photoshop.
Училась и учусь исключительно методом тыка, поэтому если что-то можно сделать проще быстрее и круче — подсказывайте, буду благодарна.

Зы: если у вас возникло желание разместить этот урок где-то у себя, предупредите меня об этом и дайте ссылку на мой жж bit.ly/b3QQNt , в котором этот урок тоже есть. Не хочется неприятных ситуаций.

Зы: хабряне могут поставить плюсик здесь: habrahabr.ru/blogs/iconos... =)

Всё внутри.
stre_kaza Сообщение 13/07/2010 11:24 Копия темы
На картинку нужно жмакать. 1. Создаём окружность, затем создаём окружность внутри. Для этого на слое с шейпом нужно кликнуть по серому прямоугольнику, после чего выделятся пути.
Теперь нужно снова выбрать шейп окружность и перед началом рисования круга нужно зажать alt (при этом возле курсора-крестика появится минус), обнаружив, что инструмент уже рисует внутри большой окружности, отпустить alt, и, продолжая рисовать, зажать shift (это для того, чтобы рисовать круг, а не овал) . Таким образом можно построить маленький круг внутри большого.
После того, как построили его, выбираем инструмент Convert Point Tool, выделяем внутреннюю окружность и двигаем её до тех пор, пока она не встанет по центру.
Основа готова.

2. Белые полоски. Строим прямоугольник поверх круга. Затем выделяем его (ctrl + T) и из списка трансформаций выбираем Perspective. На рисунке видно, какого эффекта нужно добиться. После этого изменённый прямоугольник копируется, отражается вниз, затем оба копируются и разворачиваются перпендикулярно своим родителям.

Затем выбираем в Blending Options выбираем Color Overlay и назначаем полоскам цвет.
Вы спросите: зачем так сложно, можно ведь сразу дать цвет шейпу? Нет, это неудобно, просто сделайте так, дальше я объясню, почему я делаю так.
stre_kaza Сообщение 13/07/2010 11:24 Копия темы
3. Маска. В палитре слоёв все полоски лежат над кругом. Теперь зажав альт кликаем между слоем круга и лежащей над ним полоской. Полосочка прячется под маску круга. Перетаскиваем все полоски так, чтобы они спрятались под маску и сцепляем круг и полосочки, чтобы зафиксировать их расположение относительно друг друга.

4. Объём.
a)Возвращаемя к слою, на котором круг и снова открываем Blending Options. И назначаем кругу сначала Inner Shadow со значениями:
Multiplay (цвет: 138:97:83)
Opacity: 75
Angle: -90
Distance: 5
Choke: 0
Size: 5
галочку с Use Global Light обязательно снять.

b) Затем Bevel & Emboss:
Inner Bevel
Smooth
Size: 8
Soften: 4
Angle: 90
Altitude: 48

Screen (255, 255, 255)
Opacity: 60
Multiplay: (138:97:83)
Opacity: 40

5. Объём полоскам. Выделяем верхнюю полоску и идём опять же в Blending Options. Здесь даём полоске начала Inner Glow:
Screen (255, 255, 255)
Opacity: 50
Choke: 0
Size: 1

а затем Drop Shadow:
Multiplay (0, 0, 0)
Angle: 90
Opacity: 55
Distance: 1
Spread: 0
Size: 1
галочку с Use Global Light обязательно снять.

Теперь возвращаемся к палитре слоёв. Под полоской, с которой производились манипуляции есть надпись Effects и перечислены все применённые эффекты. Зажимаем alt, хватаем лапкой надпись Effects и поочерёдно перетаскиваем на остальные полоски. Таким образом, если нужно будет поменять цвет всем (допустим их у вас 100), нужно будет отдельно к каждой менять. поменяли одной и перетащили на остальные.

Теперь горизонтальным полоскам нужно подредактировать угол падения тени.
Левая:  Angle: 166, правая: 16.
stre_kaza Сообщение 13/07/2010 11:25 Копия темы
6. Петли для верёвок.
a) Строим прямоугольный шейп по скруглёнными углами (я взяла 5). Поворачиваем его на 45 градусов, копируем и расставляем по кругу так, чтобы были видны только 2 скруглённых уголка. Петли для верёвок в палитре слоёв находятся под кругом.

b) В Blending Options назначаем одному из верхних ушек Gradient Overlay:
Linear
(127, 35, 10) (206, 68, 21) (213, 94, 52)
Назначим ему соответствующй угол (у меня 54).
Затем добавляем Inner Shadow:
Soft Light (254, 238, 238)
Opacity: 85
Angle: 74
Distance: 1
Choke: 0
Size: 1
галочку с Use Global Light обязательно снять.

Теперь копируем это на соседнее верхнее ушко и подгоняем углы градиента и тени.

с) На нижних ушках только Gradient Overlay у которого ползунок с самым светлым цветом (213, 94, 52) удалён, а самый тёмный стал ещё чуть темнее (60, 18, 7). С углами градиента и расположением ползунков все справятся сами))
Inner Shadow на нижних ушка нет.

7. Верёвки.
a) Теперь берём Pen Tool и строим верёвочки. Я делаю так: строю путь, затем в меню через правую кнопку выбираю Define Custom Shape, удаляю пути построения и нахожу в палитре шейпов созданную мной форму.

b) А теперь всем верёвкам назначаем Color Overlay (197, 193, 160) и Bevel&Emboss:
Inner Bevel
Size: 1
Soften: 0
Angle: 90
Altitude: 26

Screen (255, 255,255)
Opacity: 75
Multiplay (118, 105 83)
Opacity: 75
stre_kaza Сообщение 13/07/2010 11:25 Копия темы
8. Тени от верёвок. Верхняя и нижняя верёвочка копируются. У обеих удаляется Bevel&Emboss. Затем идём в Color Overlay И в Blend Mode вместо normal — multiplay, Opacity — зависит от фона, на котором будете использовать иконку, у меня 46.
Теперь в палитре слоёв этому слою Fill ставим 0%. Теперь слой, ставший полупрозрачным и тёмным сдвигаем на пару пикселей вниз, чтобы получить эффект тени.

Так же нужно помнить, что если объект будет использоваться в виде png, то тень не нужно делать multiplay, она должна быть просто тёмная и полупрозрачная. Иначе при сохранении получится грязь.

9. Тень от круга.
a) Строим окружность, затем сжимаем её по вертикали.

b) Назначаем Gradient Overlay:
Multiplay (255, 255,255) и Opacity этого цвета: 0, (150, 121, 104), (255, 255,255) и Opacity этого цвета: 0.
Linear
Angle: 0
И в палитре слоёв этому слою Fill ставим 0%

c) Для придания тени реалистичности копируем этот большой овал, уменьшаем его по высоте и ширие и ставим точно-точно под круг.
stre_kaza Сообщение 13/07/2010 11:26 Копия темы
10. Море в круге.
a) Под всеми слоям создаём ещё одну окружность и назначаем ей линейный градиент (Gradient Overlay):
выглядит он вот так:
stre_kaza Сообщение 13/07/2010 11:26 Копия темы
10.
b) поверх «моря» нужно нарисовать последний круглый шейп. Он чёрного цвета, а в палитре слоёв его Fill на 0%. И задаём ему Bevel&Emboss:
Вот с такими параметрами:
stre_kaza Сообщение 13/07/2010 11:34 Копия темы
Готово =))
KnavishKola Сообщение 13/07/2010 11:39 Копия темы
О_о
отлично
Inglo Сообщение 13/07/2010 11:41 Копия темы
Ух ты, молодец, многим пригодится урок.
dkeen Сообщение 13/07/2010 11:42 Копия темы
Лучший пост за последние полгода.
Жирный +
nKrow Сообщение 13/07/2010 11:43 Копия темы
Спасибо! ))
Ozra Сообщение 13/07/2010 11:44 Копия темы
классно, но шейпы в фотошопе такая лажа( работа с ними напоминает забивание гвоздей микроскопом, меня от них аж типает))
Mgself Сообщение 13/07/2010 11:44 Копия темы
Не перестаю Вами радоваться :)

Я бы ещё текстурки чуть чуть придал :)
andrewes Сообщение 13/07/2010 11:44 Копия темы
Итс гуд)) огромное спасибо и+++
5angel Сообщение 13/07/2010 11:46 Копия темы
Все клёво, но я бы нарисовал в люстре (:
stre_kaza Сообщение 13/07/2010 11:46 Копия темы
я не юзаю в люстре растровые эффекты, мне удобнее в фотошопе.
stre_kaza Сообщение 13/07/2010 11:47 Копия темы
а мне нравится)
5angel Сообщение 13/07/2010 11:48 Копия темы
оке
Ozra Сообщение 13/07/2010 11:52 Копия темы
это самое главное)
stre_kaza Сообщение 13/07/2010 11:57 Копия темы
он же резиновый, глянцевый. не?
stre_kaza Сообщение 13/07/2010 11:58 Копия темы
рад стараться!)
stre_kaza Сообщение 13/07/2010 11:58 Копия темы
на здоровье)
stre_kaza Сообщение 13/07/2010 11:59 Копия темы
спасибо)
stre_kaza Сообщение 13/07/2010 11:59 Копия темы
надеюсь, что так))
sopietois Сообщение 13/07/2010 12:01 Копия темы
ты крутая
stre_kaza Сообщение 13/07/2010 12:03 Копия темы
теперь уже даже соглашусь)
спасибо
SADart Сообщение 13/07/2010 12:05 Копия темы
В векторе получилось бы однозначно лучше и выйгрешней по всем статьям.
Красивый круг..))
stre_kaza Сообщение 13/07/2010 12:07 Копия темы
Так ведь это вектор) Только в фотошопе.
DIMAAAAA Сообщение 13/07/2010 12:12 Копия темы
нунифигасебе))
Artis-Art Сообщение 13/07/2010 12:15 Копия темы
Спасибо!
rim89 Сообщение 13/07/2010 12:25 Копия темы
я уже плюсик в карме до дыр затер ;)
guingly Сообщение 13/07/2010 12:25 Копия темы
Класс, пригодится, всегда здорово получить мастер-класс от профессионала)!
linzza Сообщение 13/07/2010 12:28 Копия темы
большие картинки)
урок отличный
evilheat Сообщение 13/07/2010 13:00 Копия темы
плюс вам на хабре, урок клеви
DAdes1gn Сообщение 13/07/2010 13:10 Копия темы
<урок
была у меня книжка по максу, нужно было также вбивать циферками вбивать сотни две примитивов.
stre_kaza Сообщение 13/07/2010 13:13 Копия темы
Можно и не писать эти цифры, а просто сказать: сделайте дроп шэдоу.
Но далеко не всем понятно, что для достижения той или иной цели, нужно поменять угол и прозрачность, свойство прозрачности, или какой выставить цвет, чтобы добиться необходимого эффекта ... ) поэтому всё так подробно.
stre_kaza Сообщение 13/07/2010 13:13 Копия темы
спасибо)
stre_kaza Сообщение 13/07/2010 13:13 Копия темы
я честно старалась)
stre_kaza Сообщение 13/07/2010 13:14 Копия темы
спасибо)
stre_kaza Сообщение 13/07/2010 13:14 Копия темы
пользуйтесь на здоровье)
stre_kaza Сообщение 13/07/2010 13:14 Копия темы
дада)
DAdes1gn Сообщение 13/07/2010 13:32 Копия темы
ну ок, мне просто показалось что приоритет "как делаем эффект?" взял верх, относительно "для чего делаем эффект?"
и квадрат спасения уже не смогу сделать по этому уроку.
stre_kaza Сообщение 13/07/2010 13:35 Копия темы
Мне кажется, вы ошибаетесь.
Достаточно понять общий принцип создания мелких изображений шейпами и стилями и не будет проблем в создании других предметов.

Кроме того, (я не стала это писать в уроке), в любом случае, чтобы создать что-то объёмное, вам нужно иметь хотя бы базовые представления о форме, объёме, цвете, светотени и тд.. Но этому я научить не смогу, этому учат в школах.
Picasso Сообщение 13/07/2010 13:43 Копия темы
ты крутая женщина, например

спасиба за тутор
stre_kaza Сообщение 13/07/2010 14:02 Копия темы
перечитала урок и кое-где вставила пояснения для тех, кому совсем непонятно.
спасибо, что указали.
DAdes1gn Сообщение 14/07/2010 14:19 Копия темы
ok sps -)

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

кстати читающим этот топик – удобная фича при рисовании иконок: window->arange->new window for...
делает дубль окна, чтобы каждый раз не прыгать с масштабом
0

©2008 edogs egods
Выразить восторг, поругаться
или предложить что-нибудь можно на форуме
Для обсуждения этого сервиса так же есть темы на фрилансе по
поиску , флудотопу ,и по удалённым сообщениям ,и по Актуальным/популярным темам , и по топу "кто кому больше наотвечал"