Рисуем красивенькую кнопку онлайн

Просмотров: 1532 | Добавил: Mr_Djun | Загрузок: 0

Рисуем красивенькую кнопку онлайн
Я решил вот написать урок , как нарисовать красивенькую кнопку. Такие кнопки вроде используются в Mac OS... Не знаю, с Маком ни разу не общался). Но такие вот кнопки мне очень нравятся.
Рисовать мы будем не в фотошопе, как вы могли подумать. В фотошопе тоже можно, но у меня сейчас фотошоп не работает, я пользуюсь онлайн-программами типа фотошопа. Так вот, рисовать мы её будем в онлайне, в графическом редакторе Aviary Raven.
1. Открываем редактор. Его можно найти по адресу http://aviary.com/launch/raven
2. Создаём изображение любого размера. Лучше всего выберите стандартный размер.
3. Выбираем инструмент прямоугольник. Можете нарисовать его, как в обычном графическом редакторе (щёлкнуть и растянуть), а можете просто кликнуть на картинке и откроется окно. 3 параметра. 1 - закругления углов, вторые - размеры. Я ввёл: 50, 500x100.
4. Если вы нарисовали прямоугольник как кликнуть - растянуть или закругления углов мало, можете добавить по точке на верхней и нижней стороне и растянуть. Зачем мы нарисовали его повёрнутым? Сейчас узнаете.
5. Выберите цвет, которым вы хотите залить кнопку. Залейте её градиентом от тёмного к светлому справа налево.

Обратите внимание на окошко fill (заливка), одного взгляда достаточно чтобы понять, как залить градиентом кнопку... Вот зачем мы рисовали повёрнутую кнопку! Градиент снизу вверх не заливается!
6. Рисуем такой же прямоугольник, но гораздо тоньше и заливаем его градиентом от белого к прозрачному. Прозрачность легко поставить в окошке "выбрать цвет", ставим там прозрачность 0. И ОБЯЗАТЕЛЬНО прозрачный цвет всё равно сделайте белым. Не оставляйте чёрным. Увидите, почему.
7. Бело-градиентная полоска должна распологаться в самом "верху", точнее слева кнопки. Уже так и хочется нажать кнопку)))
8. Поворачиваем кнопку, за ней и полоску в нормальное состояние.
9. Последний штрих - пишем текст и распологаем на слое ниже слоя бело-градиентной полоски.[/j]

Всё, наша кнопка готова! Только не забываем, что такие кнопки должны обязательно при наведении на них курсора окрашиваться другим цветом, а при нажатии "щёлкаться" (надпись должна вдавливаться, как у обычных кнопок).

Выкладывайте, что получилось у вас)

Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
Мини-чат
Наш опрос
Новый диз сайта?
Всего ответов: 100
Статистика


фарфор мейсенский
недвижимость в германии
скачать chrome
Онлайн всего: 1
Гостей: 1
Пользователей: 0