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

[Конкурс] Как русифицировать кнопки [by RedNaxi]

Добавлено: 16.05.2007 10:47
Mr. Anderson
Подробный фак - как русифицировать кнопки.
Для чайников от чайника.
ФАК написан чайником так что просьба не придираться=)

Итак, у нас есть стиль с английскими кнопками. Стиль нам очень понравился, но к сожалению кнопки у стиля только английские:(
Что же делать в такой ситуаци?? Первое, что приходит на ум - пойти в тему
http://phpbbguru.net/community/viewtopic.php?t=365
Выложить там архив кнопочками и ждать пока их русифицирует добрый пользователь этого форума.
Но мы люди упорные и потому перед тем как выкладывать туда свои кнопочки сначала прочитываем всю тему от начала до конца - а вдруг кто-то уже сделал русские кнопки для нашего стиля? Заодно идем и на сайт автора стиля - вдруг там есть русские кнопочки. Если кнопки где то нашлись - поздравляю - Вы смогли русифицировать кнопки для вашего стиля =)

Если же кнопочек нигде нет - что делать в этом случае? перед выкладыванием в вышеуказанной теме попробуем русифицировать их сами.

Итак, переходим к процессу русификации:
1. Открываем нужную кнопку в фотошопе (советую открыть сразу две кнопки - еще одну для сравнения)
Изображение
2. Нажимаем ctrl+a или select(выделение) -> all (все)
3. Нажимаем ctrl+с или edit(правка) -> copy (копировать)
Изображение
4. Нажимаем ctrl+n или file(файл) -> new (новый)
5. Нажимаем ctrl+v или edit(правка) -> paste (вставить)

Если окно фотошопа стало выглядеть примерно так:
Изображение
это значит что подготовительные работы закончены, приступаем к русификации.
1. Изменяем масштаб( можно менять либо в левом нижнем углу окна с кнопкой либо на вкладке навигатор на панели управления, которая обычно находится в правом верхнем углу окна фотошопа). Я рекомендую 550-600.
Изображение
2. Находим на кнопке область на которой ничего не написано и выделяем с помощью инструмента rectangular marquee tool область шириной 1 пиксель и высотой с эту кнопку в той части где нет надписи (обычно бывает между словами, надо смотреть чтобы тени там тоже не было, область где находятся различные закругления и границы справа или слева кнопки не подходят)
Изображение
3. Нажимаем ctrl+t или edit(правка) -> free transform (свободное трансформирование?)
4. Растягиваем выделенную область чтобы она накрыла собой всю надпись. Вуаля - у нас появилась абсолютно пустая кнопка:
Изображение
5. С помощью пипетки с кнопки взятой для сравнения(см. пункт 1 подготовки) берем цвет надписи.
Изображение
6. Берем инструмент Текст и с его помощью пишем на кнопке нужную нам надпись
Изображение
7. Подгоняем размер, положение и шрифт букв под эталон
Изображение
8. Находим слой с текстом в списке слоев и нажимаем на него правой кнопкой там выбираем Blending Options в открывшемся окошке находим Drop Shadow И с помощью регуляторов Angle, Opacity, Size, Distance погоняем тень букв под тень оригинала.
Изображение
Изображение
Все - мы получили русифицированную кнопку.

Затруднения могут возникнуть на 6 пункте - вдруг русский текст шире или уже английского?

Вариант шире (как у меня на скринах):
1. Копируем правую часть кнопки(закругление или еще что то такое зависит от кнопки)
Для этого:
1.1 Переходим на слой с кнопкой а не с текстом с помощью списка слоев
Изображение
1.2 Выделяем ее с помощью rectangular marquee tool
Изображение
1.3 Нажимаем ctrl+с или edit(правка) -> copy (копировать)
2. Нажимаем alt+ctrl+с или image ->canvas size
3. Указываем большу ширину кнопки чем стоит и ставим квадратик в левый верхний угол чтобы стрелочки от него шли только вправо и внизи нажимаем ок
Изображение
4. Нажимаем ctrl+v или edit(правка) -> paste (вставить)
5. С помощью инструмента мышь со стрелочками(на знаю как он называется:() перетаскиваем вставленную границу кнопки на самый край. Должно получится примерно так:
Изображение
6. Повторяем инструкции 2-4 русификации кнопки(про растягивание пустой области)
Все, у нас расширенная кнопка с нужным нам текстом:
Изображение
Вариант уже:
Аналогичен варианту шире только в пункте 3 указывется значение ширины меньшее чем стоит и пункт 6 выполнять не надо.

Ну и напоследок удалим фон:
1. Переходим на слой background в списке слоев
2. В этом же списке в правом нижнем углу нажимаем кнопку с корзиной:
Изображение

Все - у нас есть самостоятельно русифицированная кнопка.
Делаем File -> Save As в списке выбираем CompuServe( GIF) и сохраняем:
Изображение
Вот результат этой работы:
Изображение

Если результат такой русификации вас не устроил(бывает если кнопки с каким то хитрым фоном) то тогда уже идем просить гуру.

(с) RedNaxi 1.05.2007
Всех с днем солидарности трудящихся!

Добавлено: 16.05.2007 14:12
Поручик
Кашмар. И ЭТО на конкурс. :shock: Даже объяснять не буду, почему ЭТО.

Добавлено: 16.05.2007 16:50
Rayden
Поручик не надо так. На самом деле многим поможет, а кого то подтолкнет к изучению фотошопа.
Кнопки - это как раз тот случай, когда для профи задача не интересна, а для чайника крайне актуальна.

Добавлено: 16.05.2007 17:01
Поручик
Rayden надо так.
Так уж и быть для тех, кто не понял. Орфографию и пунктуацию можно было хотя бы через MSWord пропустить?
Я могу прицитировать Гиляровского:
Это письмо долго ходило по рукам в конце прошлого века:
"Батюшка барин сивый мерин сдох а шкуру его ..."
Далеко ли мы ушли от того времени, господа?

Добавлено: 16.05.2007 17:24
Rayden
Поручик
В этом ты прав, прав, прав! :D

Добавлено: 16.05.2007 20:28
RedNaxi
Писал в блокноте:( ворда русского у меня нет:( стоит бесплатная бета 2007 она английская

Добавлено: 16.05.2007 20:41
Поручик
А русский язык ты изучал? Или знаки препинания так тяжело расставить, требуется образование не ниже двух высших.

Добавлено: 16.05.2007 21:31
Rayden
RedNaxi T9 в блокноте включи)))

Добавлено: 16.05.2007 22:11
Палыч
RedNaxi
По теме: последний пункт я бы изменил: не сохранить как..., а сохранить для WEB... выбрав соответствующий оптимизированный вариант и тип файла

Добавлено: 17.05.2007 0:50
RedNaxi
Признаю, запятые стоят далеко не везде где необходимо :oops:

Замечание с save for web в принципе верное, но только фак для чайников а им намного проще сделать save as чем save for web с оптимизацией.

Добавлено: 17.05.2007 11:05
Палыч
RedNaxi писал(а): но только фак для чайников а им намного проще сделать save as чем save for web с оптимизацией.
Так надо чайников дотягивать до уровня юзера, а не самим опускаться до уровня чайника

Добавлено: 17.05.2007 18:44
Vladson
Смущает то что делать это надо в фотошопе, который кстати (лицензионный) стоит дофига, в то время как тоже самое можно сделать и в простом MS-Paint...

Добавлено: 18.05.2007 0:31
RedNaxi
Vladson
в паинте со слоями работать нельзя:( а без слоев многое сделать невозможно. сегодня-завтра поищу альтернативу бесплатную которая позволит выполнять все эти действия

Добавлено: 18.05.2007 1:27
Vladson
RedNaxi писал(а):в паинте со слоями работать нельзя
И не нужно !!!
Берёшь кнопку, стираешь текст и пишешь сверху свой, всё что надо...

Единственное не хватает прозрачности и нормального Resampling-а для шрифтов, но это можно с помощью бесплатного IrfanView сделать... (совместить работу с двумя редакторами)

Дело в том что фотошоп это профессиональная программа и делать такие вещи с её помощью сравнимо со стрельбой из базуки по комарам (что не совсем рационально)

Добавлено: 18.05.2007 1:37
Alexalexis
ФАК... ФАК... :twisted:
Наверное, по-русски это будет ЧАВО хотя бы?!