Главная
Статьи
Форум
Баннерообмен
Файловый хост
Гостевая
Рег-ция доменов
Видео GTA
  • Страница 1 из 1
  • 1
Форум о GTA Multiplayers. GTA SA-MP, MTA, VC-MP, IV-MP » Форум по Photoshop » Уроки » Создание дизайна веб-сайта с нуля
Создание дизайна веб-сайта с нуля
Offline
VampDoz
Дата: Пятница, 17.07.2009, 16:38 | Сообщение # 1
Группа: Заблокированные
Сообщений:
38
Награды: 0
Репутация: 7
Как видите, это очень симпатичный дизайн, с яркими цветами и не перегруженный элементами. Одна из главных черт дизайна – это то, что он являет собой переплетенную с одной стороны книгу. Готовы? Давайте начнем!

Приблизительное время выполнения: 20 минут

Шаг 1

Создайте в Photoshop новый документ с белым фоном. Для этого зайдите в File => New или нажмите “Ctrl+N”.

Шаг 2

Создайте прямоугольник с закругленными углами должного цвета и размера – какого захотите. Я использую зеленый прямоугольник.

Шаг 3

Создайте серый градиент с помощью Gradient tool и непрозрачностью 13% - теперь верхняя часть сайта слегка темнее.

Шаг 4

Затем мы нарисуем желтый эллипс и, наложив на него маску, мы поместим нужную секцию этого эллипса в прямоугольник.


Шаг 5

Примените подходящий стиль к слою с эллипсом: простой Stroke размером 3 пикселя и такой Outer Glow:


Шаг 6

Далее мы создадим меню. Создайте кнопки меню, нарисовав прямоугольник с закругленными углами и стерев некоторые его участки (инструмент select и затем клавиша DEL). Не забудьте для этого растеризовать слои.


Шаг 7

Продублируйте слои с кнопками столько раз, сколько вы хотите кнопок. Затем расположите вертикальную панель подобным образом - прямоугольник с закругленными углами с удаленной левой стороной. Меню почти готово.

Шаг 8

Затем добавьте к кнопкам надписи и маркеры справа (это просто прямоугольники с небольшим outer glow).

Шаг 9

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

Шаг 10

Теперь нарисуйте места переплета для книги. Линия с двумя кружочками будет над кнопками меню и будет как бы зашнуровывать ваш шаблон наподобие электронной книги. Отверстия для шнуровки простые – просто кружочек (ellipse shape tool) плюс inner shadow.

Шаг 11

Теперь сам шнурок. Он рисуется при помощи эллипса и отрезания лишнего (при помощи маски), оставляя только нужный изгиб.

Затем измените цвет и разместите его на месте, между двумя отверстиями.
http://tutorials.psdschool.ru/wp-cont....1_2.jpg
Шаг 12

Добавьте текст в заголовок и внизу страницы (и логотип, если хотите). Это все делается при помощи Text tool.

Шаг 13

Теперь нужно встроить иллюстрацию. Откройте скачанный файл в формате PSD и выберите группу слоев номер 7 (это группа в файле, который мы использовали в примере – группа слоев, содержащих здание).

Шаг 14

Перетащите слой на нарисованный вами дизайн и произведите слияние слоев в одну группу – так вам будет удобнее с ними работать. Выделите группу и нажмите Ctrl+E.

Шаг 15

Но подождите – работа ещё не окончена. Нам ещё понадобится добавить небольшую тень к зданию, так оно будет выглядеть более реалистично. Продублируйте слой с иллюстрацией дважды, выберите один из слоев и поставьте их Hue и Saturation на 100 (эти настройки вы найдете в опции “Adjustments of Layer”). Этот слой будет содержать тень для здания.

Шаг 16

Затем выберите верхнюю часть слоя и удалите её

Шаг 17

Примените “Gaussian Blur” (размером 1.7 пикселей) и измените layer fill на 33% - теперь действительно похоже на тень.

Шаг 18

Примените те же шаги ко второму слою, за исключением вырезания верхней части. Этот слой должен быть полностью затенен. Поставьте его непрозрачность на 22%. Это будет вторая тень. Вы также должны трансформировать и исказить вторую тень немного для того, чтобы она выглядела более реалистичной.

Шаг 19

Теперь переместите иллюстрацию на две тени – но соблюдайте порядок слоев. Тени должны быть под первоначальным слоем с иллюстрацией.

Вуаля! Вот и все – при помощи нашего урока дизайн веб-сайта готов!

Источник: www.tutorials.psdschool.ru


Offline
Snaiperok
Дата: Пятница, 26.02.2010, 09:54 | Сообщение # 2
Группа: Пользователи
Сообщений:
6
Награды: 0
Репутация: 0
отличная статья

Ни кто незнает кто я но я всажу пулю тебе из дигла!! )))
Форум о GTA Multiplayers. GTA SA-MP, MTA, VC-MP, IV-MP » Форум по Photoshop » Уроки » Создание дизайна веб-сайта с нуля
  • Страница 1 из 1
  • 1
Поиск:
Статистика форума
Лучшие по кол-ву сообщений Лучшие по репутации Лучшие по рангу MP3 Плеер
Dav1d[B]lane 314
Pro::killer 221
IIIu3uK 203
Abibas 141
[DH]MAXIMKA 89
NoNothing 54
KNIAZ 53
MYRZblJlKO 47
qurdo 46
VampDoz 38
Dav1d[B]lane 667
IIIu3uK 40
Pro::killer 25
Abibas 13
KNIAZ 12
qurdo 8
NoNothing 8
VampDoz 7
MYRZblJlKO 6
seregaGT 5
Dav1d[B]lane Генералиссимус
IIIu3uK Генерал-полковник
Pro::killer Полковник
Abibas Полковник
[DH]MAXIMKA Майор
NoNothing Лейтенант
KNIAZ Лейтенант
MYRZblJlKO Лейтенант
qurdo Лейтенант
devil_racer Сержант

Хостинг от uCoz GTAProClan.ru