У администрации появилась идея оснастить пользователей Anime.Com.Ru юзербарами. Но, так как мало кто захочет ходить с одной подписью на всех, было решено сделать урок.
Юзербар— графическое изображение, предназначенное для размещения в подписи на веб-форумах и других средствах интернет-общения. Основной целью размещение юзербара является выражение каких-либо убеждений, пристрастий, увлечений, привязанностей и даже черт характера пользователя.
Основные требования:
* Размер 350x19 px.
* Наличие чёрной рамки толщиной 1 пиксель по всему периметру изображения.
* Использование шрифтаVisitor (скачать)TT1 (10 pt), Visitor TT2 (13 pt) илиmicroN55 (скачать) (8 pt) белого цвета с чёрной каймой и выключенной опцией anti-alias.
* Наличие фоновой штриховки под углом 45°.
* Белый полупрозрачный овал в верхней части изображения для придания иллюзии трёхмерности.
* Формат файла GIF (можно использовать также для создания анимации) или PNG (для высокого качества).
......... Вступительная часть окончена, теперь - сам урок.
Нажмите тут чтобы увидеть спрятанное сообщение (возможно сообшение содержит spoiler)
1 - Открываем Photoshop и создаем новый документ (Ctrl+N), вводим нужные нам значения:
Width - 350 px
Height - 19 px
! Color mode - RGB !
2 - Открываем любую понравившуюся нам картинку (Ctrl+O)
! Image - Mode - RGB ! - эту операцию нужно обязательно сделать. Если галка напротив RGB уже стоит, то все нормально.
3 - Теперь нужно переместить изображение на нашу заготовку:
- Удерживая Ctrl (появится черная стрелка), перемещаем картинку на заготовку. Переместилась? Закрываем изображение - оно нам больше не понадобится.
- Нажимаем F - так будет удобнее работать. Изображение копировалось на новом слое и мы можем его уменьшить: нажимаем Ctrl+T - за заготовкой появилась рамка с квадратиками. Наведите мышку на любой угловой квадрат и, удерживая Shift, сужайте изображение до необходимого вам размера (перемешайте рисунок, передвинув курсор к центру рамки (появится черная стрелка), чтобы лучше закомпоновать)
- Нажмите Enter для подтверждения.
4 - Нам нужно сделать наклонную штриховку. Выбираем Инструмент Pattern Stamp Tool (S)(если по умолчанию стоит Clone Stamp, надавите на иконку несколько секунд, пока не всплывет окошко - выберите нужный инструмент).
Далее - открываем библиотеку pattern
*если наклонной штриховки нет, то нужно ее загрузить:
Можно создать новый слой и сделать штриховку на нем (для последующих махинаций ^^) И, собственно, заштриховываем (выберите кисть с большим диаметром ~ 200)
Можно кое-где стереть штрих, если хотите.
5 - Нужно сделать полупрозрачный овал.
Создаем новый слой (Ctrl+Shift+N - OK), выбираем elliptical marquee
Создавать эллипс нужно за пределами заготовки по диагонали он верхнего угла (потренируйтесь немного - поймете). Закрашиваем выделение белым.
6 - Создаем текст с помощью horisontal type [img:d2fc8a0fa8]http://demiart.ru/forum/html/psicons/horisontal_type.gif" border="0" /> Цвет, шрифт, размер - по желанию, главное - сама надпись anime.com.ru user ^^
Если же все-таки хотите использовать классические для юзербара шрифты, их нужно установить в папку: C:\WINDOWS\Fonts (не забудьте их распаковать из архива ^__^)
Так... а теперь махинации со слоями...
Что вы можете делать:
- Изменить цветовую схему изображения: активируйте слой с картинкой *щелкните по нему на панеле слоев* - Ctrl+U (поставьте галочку напротив ! Colorize !)
- Изменить цвет и прозрачность штриховки: удерживая Ctrl, щелкаем по окошку слоя со штрихом При этом курсор примет форму руки с квадратом выделения.
Можете использовать кисть,
градиентили фильтры для эффектов.
Так же можно изменить прозрачность слоя, просто уменьшите значение Opacity (правый верхний угол панели со слоями)
- теперь переходим на слой с овалом и меняем свойства слоя, пока не будем довольны. По умолчанию стоит Normal, но для нас лучше подойдут значения Soft Light и Overlay(при уменьшенном opacity)
Не забудьте про рамку )
Перейдите на самый верхний слой, создайте новый и выберите pencil установите размер кисти 1 рх
далее: поставьте точку в любом углу и, удерживая Shift, направьте линию вверх или вниз - так вы и сделаете рамку ^^
Т.к. рамка на новом слое, с ней тоже можно что-нибудь наколдовать.
Сохраняем документ - Ctrl+Shift+S и выбираете любой удобный формат, кроме .psd, конечно )
Как написано выше, лучше подойдет GPEJ, GIF, PNG
Чтобы узнать, как вставить ваш юзербар в подпись, пройдитепо этой ссылке Далее - заходите в свой профиль и в окошко для подписи вставляете код ( img! )
Если есть вопросы - задавайте ^^'
Очень напутано, но иначе я не умею... надеюсь, что ничего не забыто ^^
Последний раз редактировалось: Denoro (11-07-2008 19:17:57), всего редактировалось 2 раз(а)
12 пользователей сказали Denoro спасибо за это полезное сообщение
о`кей )
Тогда расскажу как делать штриховку.
Проще некуда ^^
Создание штриховки
Нажмите тут чтобы увидеть спрятанное сообщение (возможно сообшение содержит spoiler)
1 - Создаем новый документ с такими настройками (хотя размер документа может быть и 3х3 рх ^^):
2 - Выбираем [img:f3c36f4fdb]http://demiart.ru/forum/html/psicons/pencil.gif" border="0" />в 1 рх, увеличиваем документ до максимума (Ctrl + + *на цифровом блоке*) и выстраиваем квадраты по диагонали
3 - сохраняем, как Pattern
Теперь штриховка у нас в библиотеке )
Последний раз редактировалось: Denoro (07-04-2008 23:12:09), всего редактировалось 1 раз
4 пользователей сказали Denoro спасибо за это полезное сообщение
Немного попробовал, милое занятие, но... Со штриховкой более-менее, только расстояние подгадать - у меня почему-то при малом размере паттерна очень рябить начинает, до невозможности .
Насчет шрифтов - указанных пока нет, но, наверное, таки лучше будет потом на однотипные поменять... А то в ремарке сказано, что можно любой, а в основном посте - типы точно обусловлены. И насчет рамки - она обязательна?
И, конечно, ждку замечаний) (все равно на следующих выходных эти доводить до ума буду, видимо )
В таком случае, можно вдвое увеличить размер файла (6х6 рх или еще больше)
В первом посте - название шрифтов=ссылка на скачивание ^_^
Ну, мы же с вами для нашего сообщества делаем юзербары, предпологалось, что каждый сделает для себя сам - такой, какой ему по вкусу. Поэтому можно не ограничивать фантазию.
Но если по правилам - любое отступление от нормы (даже создание документа 350х20 рх вместо 350х19 рх) является нарушением и выйдет у нас уже не юзербар. Поэтому рамка обязательна (да и с ней посимпатичней ^^)
Замечания:
на первом очень неудачный текст - сливается с фоном... Нужна кайма и на всех остальных.... Нда, урок не доделан... *надо было перепроверить х_х*
Шрифт с каймой
Нажмите тут чтобы увидеть спрятанное сообщение (возможно сообшение содержит spoiler)
Shelly, намного лучше, но у второго лучше поменять штрих.
Raugmoss, в основных требованиях штриховка числится )
(можете пройти по ссылке *юзербар* и прочитать сведения в википедии )
Просто в данном случае с ней что-то не так... можно с помощью ластика (eraser)стереть ненужное
2 пользователей сказали Denoro спасибо за это полезное сообщение
Я несогласен с рядом требований:
1 - про шрифт. По мне юб это как исскуство и каждый вправе делать то что ему нравиться
2 - штриховка. Почему 45 градусов??? Можно придумать прикольные узоры и ими делать заливку. Можно линиями под любым углом.
3 - белый полупрозрачный овал. Я видел много юбов с прямоугольной заливкой и тоже хорошо смотрится.
еще есть вопрос, а что про бигбары, юзербоксы??? их можно использовать???
TOTORO, вы можете быть несогласны с чем угодно )
Это правила, написанные в википедии... Если кто не понял, вступительная часть взята именно оттуда, а не с потолка.
Слово "Юзербар" = ссылка. Можете пройти по ней и убедиться, что отсебятины тут нет.
В подписи вы можете делать все, что вам угодно (в пределах приличия), в данном случае мы говорим про юзербар для anime.com.ru
Вы не можете начинать темы Вы не можете отвечать на сообщения Вы не можете редактировать свои сообщения Вы не можете удалять свои сообщения Вы не можете голосовать в опросах