Делаем дизайн для престижного сайта в Фотошоп

01.09.13 20:03

В данном уроке используется небольшое количество цветов, что позволит создать дизайн, который прекрасно подходит для делового стиля. Если хотите сделать все правильно, скачайте фотошоп cs6 и приступайте к заданию.

22[1]

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

Итак, следует создать новый документ, размером приблизительно 1000х1000 пикселей. Фон будет иметь изначально цвет – 2с2с2с. Набор текстур можем использовать любой. Обратите внимание, что на сегодняшний день невозможно использовать набор пиксельных текстур. Поэтому, буде лучше создать текстуру самостоятельными силами.

Текстуры следует загрузить в программу, создать заготовку в качестве шапки. То есть, делаем все так, как показывается на рисунке. Можно использовать дополнительно инструмент под названием Прямоугольник.

Для слоя применять будем такие стили:

2[1]

Текстуры выбираем здесь:

3[3]

Можно поэкспериментировать с разнообразием текстур, как на рисунке:

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

Стили слоя для шапки будут такими:

Тень

Наложение градиента

7[1]

После этого кнопка будет выглядеть так:

Нужно создать еще один дополнительный квадрат, и использовать цвет для фона – 131313.

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

Дальше нужно объединить все слои в один общий, и выделить их, нажимая сочетание кнопок CTRL+E. К слою, который получится, нужно применить такие стили:

Внутренняя тень

В итоге получается это:

Используем инструмент Прямоугольник с округленными краями. Здесь же следует создать несколько форм, точно так же, как показано на изображении.

Необходимо следующим шагом выделить все ранее созданные слои, и объединяем их в один целый. Используем такой стиль, как

Наложение градиента

У нас постепенно получается слайдшоу.

При помощи все того же инструмента необходимо создать еще несколько форм. Причем, самая верхняя форма будет предназначена для поиска, а нижняя будет отождествлять сайдбар.

Используем такие стили для остальных форм:

Внутренняя тень

Тиснение

Используем инструмент Перо, который позволит нам создать дополнительную форму, расположенную снизу макета.

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

Нужно разбивать макет при помощи картинок, а то получается довольно скучно. Для этого мы используем Эффект Боке

В качестве последнего штриха нужно добавить подходящий текст. И все готово к использованию!

Добавить комментарий