Создание сайта-визитки в Фотошопе

Original Clean Style for Your Website
В этом уроке я покажу вам, как создать отличную навигационную панель (меню) для вашего сайта, которую вы можете использовать далее как готовые конструкции.
В начале давайте создадим фон, на котором мы будем добавлять меню. Создать новый документ с размерами 800?600 px и заполнить его белым цветом.
Original Clean Style 01
Затем выделить Прямоугольной областью Rectangular Marquee Tool и заполнить выделенную область  цветом # 78b000.
Original Clean Style 02
Удалите выделение Ctrl + D. На этом этапе мы начинаем создавать меню. Выберите Закруглённый прямоугольник Rounded Rectangle Tool (Radius: 15px) и сделать некоторые формы с любым цветом:
Original Clean Style 03
Установите прозрачность до 0% для этого слоя и примените следующие параметры наложения Blending Options на текущий слой:
• Drop Shadow Тень
• Внутренняя тень
• Outer Glow Внешнее свечение
• Inner Glow Внутреннее свечение
• Bevel и Emboss Тиснение
• Gradient Overlay Перекрытие градиента
• Глянец
• Обводка
Original Clean Style 04
Original Clean Style 05
Original Clean Style 06
Original Clean Style 07
Original Clean Style 08
Original Clean Style 09
Original Clean Style 10
Original Clean Style 11
В результате мы получили следующие кнопки:
Original Clean Style 12
Теперь дублируйте, как показано на фото ниже:
Original Clean Style 13
Теперь нам нужно, чтобы эти кнопки были разноцветные. Для этого изменить некоторые параметры наложения Blending Options для каждой кнопки:
Для второй кнопки:
• Drop Shadow Тень
• Gradient Overlay Градиент
Original Clean Style 14
Original Clean Style 15
Для третьей кнопки:
• Drop Shadow
• Gradient Overlay
Original Clean Style 16
Original Clean Style 17
Для четвертой кнопки:
• Drop Shadow
• Gradient Overlay
Original Clean Style 18
Original Clean Style 19
Для пятой кнопки:
• Drop Shadow
• Gradient Overlay
Original Clean Style 20
Original Clean Style 21
Для шестой кнопки:
• Drop Shadow
• Gradient Overlay
Original Clean Style 22
Original Clean Style 23
Мы получили следующие результаты для каждой кнопки:
Original Clean Style 24
После этого нам необходимо добавить текст для каждой кнопки. Берём Текст  Horizontal Type Tool и введите название для одной кнопки  белым цветом и используя Myriad Pro шрифт. Постарайтесь, чтобы получить тот же результат, как это показано на моей фотографии ниже.
Original Clean Style 25
Тогда применяются следующие Параметры наложения Blending Options для этого слоя с текстом:
• Drop Shadow
Original Clean Style 26
Получились тени от текста.
Original Clean Style 27
После этого текстовый слой копируйте еще пять раз с помощью CTRL + J . Для каждой кнопки тип собственного названия как показано на картинке ниже:
Original Clean Style 28
На этом мы закончили наше меню. Теперь, я думаю, мы должны добавить логотип, чтобы закончить дизайн сайта.
Выберите Horizontal Type Tool и напишите название компании, лозунг, белым цветом и используя AvantGarde Md BT шрифт.
Original Clean Style 29
Время, чтобы добавить логотип. Выберите Произвольную фигуру Custom Shape Tool и  стандартную форму из палитры:
Original Clean Style 30
А теперь вставить паззл в левом нижнем углу холста:
Original Clean Style 31
Теперь, поверните его немного с помощью Ctrl + T:
Original Clean Style 32
Добавить несколько форм точно так же:
Original Clean Style 33
И последний шаг, который мы должны сделать, это добавить логотип едва заметный на фоне с кнопками. Копии трех слоев с головоломкой и применить следующие параметры Blending Options к каждому из скопированному слою:
• Color Overlay
Original Clean Style 34
Теперь, вы получите что-то вроде этого:
Original Clean Style 35
После этого шага все серые копии головоломки под слоями с меню и пропорционально возрастут до следующих размеров, как на рисунке ниже:
Original Clean Style 36
Вы не потеряете качество при увеличении, так как все эти формы являются векторными. Наш урок окончен . Мы получили отличный корпоративный дизайн.
Original Clean Style 37



Случайный пост Оставить комментарий