Beauty – ретушь для начинающих при помощи Photoshop.

Beauty – ретушь для начинающих при помощи Photoshop.

Эффект голограммы на фотографии.

Эффект голограммы на фотографии.

Создание портрета при помощи шрифтов.

Создание портрета при помощи шрифтов.

Создаем красивую оригинальную шапку для блога.

Создаем красивую оригинальную шапку для блога.

Необычный эффект глаз при помощи Photoshop.

Необычный эффект глаз при помощи Photoshop.

Создаем макет сайта о звездах и знаменитостях.

Создаем макет сайта о звездах и знаменитостях.

Создание текстового логотипа в стиле Ретро при помощи фотошоп.

Создание текстового логотипа в стиле Ретро при помощи фотошоп.

Урок ретуши фото. Создаем потрясающий портрет в Photoshop.

Урок ретуши фото. Создаем потрясающий портрет в Photoshop.

Урок по созданию летнего водного макета сайта в Photoshop.

Урок по созданию летнего водного макета сайта в Photoshop.

Урок по созданию футуристического логотипа в фотошоп.

Урок по созданию футуристического логотипа в фотошоп.

Создаем дизайн телефона на Android в Photoshop.

Создаем дизайн телефона на Android в Photoshop.

Создание макета сайта в стиле минимализма.

Создание макета сайта в стиле минимализма.

Как создать пиксельную кнопку в фотошопе

Как создать пиксельную кнопку в фотошопе

Создаем макет сайта для службы знакомств.

Создаем макет сайта для службы знакомств.

Создание RSS иконки.

Создание RSS иконки.

Урок по созданию простого  и современного  макета для сайта.

Урок по созданию простого и современного макета для сайта.

Графика для сайта.  Рисуем иконку на сайт.

Графика для сайта. Рисуем иконку на сайт.

Урок по созданию зимнего текста.

Урок по созданию зимнего текста.

Урок по созданию красивого новогоднего макета в фотошоп.

Урок по созданию красивого новогоднего макета в фотошоп.

Псевдо HDR.

Псевдо HDR.

Как создать основу для рекламы профессиональной косметики для волос.

Как создать основу для рекламы профессиональной косметики для волос.

Создание эффекта рисунка на фотографии.

Создание эффекта рисунка на фотографии.

Создаем макет сайта, продающий програмное обеспечение.

Создаем макет сайта, продающий програмное обеспечение.

Урок по созданию макета сайта-портфолио при помощи текстуры "джинс".

Урок по созданию макета сайта-портфолио при помощи текстуры "джинс".

Урок по созданию макета сайта для гостиниц и ресторанов.

Урок по созданию макета сайта для гостиниц и ресторанов.

Создаем креативный макет для продажи косметических средств с помошью Photoshop.

Создаем креативный макет для продажи косметических средств с помошью Photoshop.

Урок по созданию фотореалистичного макета сайта для его дальнейшей верстки CSS/XTML.

Урок по созданию фотореалистичного макета сайта для его дальнейшей верстки CSS/XTML.

Урок по созданию яркого красочного дизайна сайта.

Урок по созданию яркого красочного дизайна сайта.

Создание простого и стильного макета сайта.

Создание простого и стильного макета сайта.

Создаем макет блога в фотошоп.

Создаем макет блога в фотошоп.

Создаем оригинальный чистый стиль для сайта.

Создаем оригинальный чистый стиль для сайта.

Создаем профессиональную панель навигации для сайта.

Создаем профессиональную панель навигации для сайта.

Рисуем милую девчушку-смайл.

Рисуем милую девчушку-смайл.

Урок по рисованию прохлаждающегося солнца.

Урок по рисованию прохлаждающегося солнца.

Фантастический эффект фотографии.

Фантастический эффект фотографии.

Создание приятного макета сайта портфолио.

Создание приятного макета сайта портфолио.

Создание макета сайта для портфолио в стиле Веб 2.0

Создание макета сайта для портфолио в стиле Веб 2.0

Урок по созданию стильного рекламного банера с помошью Photoshop.

Урок по созданию стильного рекламного банера с помошью Photoshop.

Урок по созданию профессионального бизнес-шаблона сайта с помощью фотошоп.

Урок по созданию профессионального бизнес-шаблона сайта с помощью фотошоп.

Урок рисования реалистичного динамика.

Урок рисования реалистичного динамика.

Создаем стильный коллаж.

Создаем стильный коллаж.

Урок по созданию макета дизайна сайта в стиле Веб 2.0

Урок по созданию макета дизайна сайта в стиле Веб 2.0

Урок создание эффекта металлического текста

Урок создание эффекта металлического текста

Небесный коллаж

Небесный коллаж

Урок по созданию фотореалистичного макета сайта для его дальнейшей верстки CSS/XTML.

Tags: уроки web дизайна | уроки веб дизайна | уроки создания сайта

В этом уроке вы узнаете как создать макет фотореалистичного сайта всего за несколько шагов.


Для этого макета нам понадобится текстура которую вы можете сохранить на свой компьютер.

 


Откройте это изображение в фотошопе и перейдите по меню Редактирование-Определить узор. Выбурите название для данной текстуры и нажмите ОК.


Создайте новый документ размером 960*900 пикселей по высоте и залейте его узором, который вы только что создали.
Вы получите что то вроде этого:


Установите цвет переднего плана # 49290 и инструментом Прямоугольник со скругленными углами создайте в центре макета форму.


Задайте форме следующие стили:


Необходимо будет создать еще формы над первой, для них используйте белый цвет.


Для этих слоев используйте те же стили слоя что и в предыдущем шаге.


Вот что должно получится.


В нижней правой части макета добавим изображение дивана и цветочного горшка.


Под слоем с диваном создадим круглую форму инструментом Овал.


Для этого слоя используем фильтр Размытие по Гауссу со следующими параметрами:


Таким образом у нас под диваном получилась реалистичная тень.


В левой стороне макета создадим несколько блоков инструментом Прямоугольник.


Для фигур задайте следующие стили слоя:


Добавим текст и изображение:


С правой стороны добавим несколько банеров:


Добавим пунктирную линию между постами.


Чтобы создать пунктирную линию воспольщуемся инструментом Горизонтальный текст  и применим к нему следующие настройки:


Последний шаг это создание логотипа и кнопок:


Вот окончательный результат. Как видите это было сделано очень просто и потребовало лишь несколько хороших образов и картинок.

 

Источник.

AddThis Social Bookmark Button
 

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


Защитный код
Обновить

поиск
RSS
Играем в "Песочнице" Google.

  Само понятие "песочница" появилось совсем недавно (2004г.), но это понятие уже стало хорошо известно многим оптимизаторам, задачей которых является продвижение...

кол-во просмотров5100
Подробнее...

Модульная сетка.

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

кол-во просмотров16354
Подробнее...

Несколько полезных ссылок веб-дизайнерам.

Очень часто при работе не хватает чего-то под рукой. Мы идем в интернет, спрашиваем на форумах, листаем книжки. Есть много...

кол-во просмотров4643
Подробнее...

Стили сайтов. Американский бизнес стиль.

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

кол-во просмотров8682
Подробнее...

Интересная подборка креативных вещей.

       В этой подборке вы увидите 17 необычных и оригинальных решений для предметов повседневного использования. Может что-то вдохновит вас на...

кол-во просмотров5516
Подробнее...