Вторник, 01.07.2025, 01:07


Главная
Онлайн уроки Регистрация ВходРеклама у нас / ПОМОЧЬ ПРОЕКТУ
Приветствую Вас, Новичок · RSS
Меню сайта
доска почета

brettnz69
Файлов:
10645

zyzy
Файлов:
2481

NIKIG
Файлов:
1190

didl3
Файлов:
1072
статистика
Онлайн всего: 1
Гостей: 1
Пользователей: 0

Сегодня были:

 Каталог статей
Обучающие уроки » Статьи » Онлайн уроки Photoshop


Рисуем дизайн веб галереи в духе Web 2.0, Clean Photo Gallery Website Layout, Онлайн уроки Photoshop

Нравится

Clean Photo Gallery Website Layout


1.

Нужно создать документ 1024?1200.
Создаем дизайн для галереи в стиле Web 2.0 *

2.

Применив paint_bucket.gif заливаем краской цвета #3E4C54.
А применив rectangular_marquee.gif нужно сделать выделение таким же образом как на картинке ниже, и закрасим его цветовой гаммой #1F2B33.
Создаем дизайн для галереи в стиле Web 2.0 *

3.

Делаем двойной на слое, в следствии чего выйдет окошко функций Blending Options. Там делаем следующие параметры:
Создаем дизайн для галереи в стиле Web 2.0 *

4.

После того как закончили с шапочкой, переходим к менюшке. Снова выбираем rectangular marquee: и заполняем цветом #FC4F83.
Добавляем туда еще две кнопки того же размера, и заливаем их цветовой гаммой #27343C. После этих действий прилепляем текст в белом цвете.

Создаем дизайн для галереи в стиле Web 2.0 *
Создаем дизайн для галереи в стиле Web 2.0 *

5.

Прибавляем текст и лого. Я применял шрифт Helvetica Neu, strong. Для текста "Your” и "Gallery" цвет #FFFFFF. На "Photo”, цвет #FC4F83. Нижестоящую надпись закрашиваем, цветом #B1D4E8.
Создаем дизайн для галереи в стиле Web 2.0 *

6.

Теперь нужно приниматься за галерею. Выбираем rounded_rectangle.gif - с параметрами: радиус 10 рх. Цвет #ECF1F3, сделав это создаем формочку как внизу.
Создаем дизайн для галереи в стиле Web 2.0 *

7.

Настала очередь создавать блок для категорий и большой блок. Выбираем rectangular_marquee.gif выделаем также как на картинке ниже и заливаем цветом #000000.

Создаем дизайн для галереи в стиле Web 2.0 *

Теперь нужно настроить Blending Options:
Создаем дизайн для галереи в стиле Web 2.0 *
Создаем дизайн для галереи в стиле Web 2.0 *

8.

Добавляем текст "Categories” белого цвета.
Создаем дизайн для галереи в стиле Web 2.0 *

Используем rectangular_marquee.gif и заливаем выделение #000000.
Создаем дизайн для галереи в стиле Web 2.0 *

Настраиваем Blending Options:
Создаем дизайн для галереи в стиле Web 2.0 *
Создаем дизайн для галереи в стиле Web 2.0 *

9.

На этом этапе нужно залить цветом #3E4C54.

Создаем дизайн для галереи в стиле Web 2.0 *

Повторяем шаг 8, для остального текста.
Создаем дизайн для галереи в стиле Web 2.0 *

10.

Повторите шаги для создания "Highest Rated” блока. И добавьте баннер 200х80.
Создаем дизайн для галереи в стиле Web 2.0 *

11.

Затем идем к главной области галереи. Применив rounded_rectangle.gif - с параметром 10 рх. Создаем формочку также как показано на фотографии ниже и заливаем белым цветом.

Создаем дизайн для галереи в стиле Web 2.0 *

Делаем двойной щелчок по слою и выставляем следующие настройки:
Создаем дизайн для галереи в стиле Web 2.0 *

12.

На 12 шаге будем работать над дизайном изображений, которые находятся внутри галереи. Применяем rounded_rectangle.gif - с размером 10 рх и цветом #ECF1F3. Необходимо создать форму по нижеприведенному образцу.

Создаем дизайн для галереи в стиле Web 2.0 *

Настройки слоя:
Создаем дизайн для галереи в стиле Web 2.0 *

13.

Сделав дубликат слоя нужно выделить, и дальше следовать в Edit>Clear или нажимаем Del на клавиатуре.
Создаем дизайн для галереи в стиле Web 2.0 *

Настройки слоя:
Создаем дизайн для галереи в стиле Web 2.0 *
Создаем дизайн для галереи в стиле Web 2.0 *

Результат:
Создаем дизайн для галереи в стиле Web 2.0 *

14.

Мы должны сделать маленькое свечение. Делаем выделение в 1 рх, заливаем белым цветом, и меняем режим слоя Soft Light, прозрачность 57%
Создаем дизайн для галереи в стиле Web 2.0 *

Результат:

Создаем дизайн для галереи в стиле Web 2.0 *

Добавляем текст белый:
Создаем дизайн для галереи в стиле Web 2.0 *

Настройки на слой с текстом:
Создаем дизайн для галереи в стиле Web 2.0 *
Создаем дизайн для галереи в стиле Web 2.0 *

15.

Добавляем дату когда пост был опубликован, используя инструмент текст и цвет #3E4C54. Добавляем рейтинг к посту, в виде звездочек.

Создаем дизайн для галереи в стиле Web 2.0 *

Добавляем в заключении текст для тегов, и текст для категории:
Создаем дизайн для галереи в стиле Web 2.0 *

16.

Добавляем нумерацию страниц, цвет цифр #1F2B33 , для активной страницы (цифры) создаем выделение и заливаем цветом #FC4F83, или форму.
Создаем дизайн для галереи в стиле Web 2.0 *

17.

Последнее что нам нужно добавить так называемый footer или нижний колонтитул. Берем rectangular_marquee.gif делаем выделение и заливаем #27343C.
Создаем дизайн для галереи в стиле Web 2.0 *

Настройки:
Создаем дизайн для галереи в стиле Web 2.0 *

18.

Добавляем текст на footer, и мы закончили.

Финальный результат:
Создаем дизайн для галереи в стиле Web 2.0 *

Смотрите также:


Категория: Онлайн уроки Photoshop | Добавил: GOR (15.12.2011)
Просмотров: 1221 | Рейтинг: 0.0/0
Всего комментариев: 0
Имя *:
Email:
Код *:
Copyright BENO Corp © 2025
кабинет
Вторник
01.07.2025
01:07

Требуются файловики за плату
Пользователей: 47495 Зарегистрируйтесь чтобы убрать рекламу
Предлагаем:
БЕСПЛАТНОЕ РАЗМЕЩЕНИЕ ВАШИХ СТАТЕЙ С ВЕЧНЫМИ ССЫЛКАМИ!
Онлайн уроки
Спецэффект - Interface Holes
Создаем свой дорожный знак
Рисуем шоколадный череп
Учимся цветокоррекции летних фотографий
Учимся создавать собственный форум
Акварельный текст - Watercolor Text
Стильный апельсиновый дизайн
Увеличение объема ресниц
Рисуем 3D текст cо сказочными цветами — Часть II, Add Fantastic Color to 3D Text – Part II
Эффект крутящейся планеты
НОВЫЕ КОММЕНТАРИИ
Учимся создавать собственный форум My new hot project|enjoy new website
Учимся создавать собственный форум Scandal porn galleries, daily updated lists

Учимся создавать собственный форум My new hot project|enjoy new website
Учимся создавать собственный форум Sexy pictures each day
http://piet.re

Учимся создавать собственный форум Enjoy daily galleries
http://homesexv

Учимся создавать собственный форум Hardcore Galleries with hot Hardcore photos

Спасибо за такой объемный отзыв, людям интер

Книга очень понравиться представителям идеи

Всех порву кто против нас!

---

сорри за оффтоп, кто-то на форуме справшивал

и даже не сомневайтесь, всё так и есть

нет




Любая публикация опубликованная на софт портале предоставлена только для ознакомления и является авторским материалом. Администрация не несет никакой отвественности за размещенные новости, программы, статьи и ущерб не оплачивает. Копирование без авторского разрешения уголовно наказуемо законодательством РФ и Украины: "Об авторском и смежном праве". Если вы берете новость с сайта то вы обязаны поставить активную ссылку!
Карта сайта