Новые сообщения Участники Правила форума RSS Подписки Поиск
  • Страница 1 из 1
  • 1
Форум CREWEBIK.ru » design studio for uCoz » Дизайн мастерская » Уроки дизайна » Рисуем дизайн сайта (урок фотошопа ;))
Рисуем дизайн сайта
exclusiv...
/avatar/01/4333-414916.png
1');return false;" rel="nofollow" href="javascript://" name="83">
15.06.2011 в 17:16

Начнем создание шаблона

Создайте новый документ (Ctrl + N) с размерами 1200 х 1550 пикселей. Установите цвет переднего плана на # FFFFFF цвета и фона на # e3e3e3 затем выберите Gradient Tool (G). С выбранным инструментом Градиент изменения градиента типа отражение градиента

Перетащите градиент от примерно на полпути вниз холста, как только вы добавили градиент добавить немного шума, перейдя в "Filter> Noise> Add Noise".

Ваш фон должен выглядеть следующим образом


Название и слоган
-----------------------------------
Выберите "Инструмент" (Т), чтоб в верхней части холста добавить название сайта и слоган используя нужный шрифт

добавить следующие стили слоя на свой слой название сайта.


Вы должны иметь что-то вроде этого

Теперь вытащить скругленный прямоугольник примерно такой же высоты, как ваше название сайта , а затем место прямоугольник в правой части холста

Украсьте прямоугольник, добавив следующие стили слоя для вашего прямоугольника слоя.



Вы должны иметь что-то вроде этого

Внутри в окне поиска, добавить небольшое увеличительное стекло с текстом "Поиск ..." рядом с ним.


Создание текстовой навигации
------------------------------------------

Выберите "Инструмент" (T), затем введите ваш элементов навигации, я пошел за курсивом Verdana. Как только вы набрали его цвет первым пунктом навигация в другой цвет

Как только вы сделали навигацию добавьте тень с настройками ниже

На слой под вашим слоем текста добавить прямоугольник с закругленными углами с помощью "Rounded Rectangle Tool (U). После добавления прямоугольник цвета в белый цвет (# FFFFFF), затем добавить маленький треугольник с помощью пера инструмент в нижней середине прямоугольника


Создание области содержимого
-------------------------------------------

Выберите "Rounded Rectangle Tool (U) с радиусом 20px затем перетащите из большой белый # FFFFFF прямоугольник выходит на холсте.

Добавить инсульта на ваш большой прямоугольник, используя настройки ниже

Далее, выберите "Elliptical Marquee Tool" (M), то вытащить эллипса же ширины содержание коробки, но пусть эллипса над повесить на первое место по smidge

Fill (G) эллиптического выделения с черным цветом (# 000000) на слой под слоем содержание коробки, а затем установите непрозрачность на 20%. Наконец размытия эллипса, перейдя в "Filter> Blur> Guassian Blur", установите размытие сумму до 3 пикселей. Вы должны иметь что-то вроде этого.


Популярные Содержание
------------------------------------------
Выберите "Rounded Rectangle Tool (U), то вытащить черный (# 000000) прямоугольник внутри содержимого коробки. Радиус прямоугольника должна быть около 5-10px

Внутри новый черный прямоугольник добавить например признакам изображения. Как только вы выбрали изображение, которое вы можете легко поместить изображение внутри прямоугольника, выбрав "Edit> Paste Into" и "Правка"> "Специальная вставка> Вставить в" Если вы используете CS5

В настоящее время собираются превратить нашу признакам изображения, так это выглядит, как JQuery слайд-шоу. Выберите "Rectangular Marquee Tool" (M), то сделать выбор в нижней части изображения признакам

Fill (G) выделение черным цветом (# 000000) затем установить прозрачность до 25%. В настоящее время собирается удалить избыток прямоугольника, как мы не хотим ее пределами нашей признакам изображения. Загрузите выделение вокруг признакам прямоугольника изображения оставляя черный слой прямоугольник выделен. Теперь переходим к "Select> Inverse" и нажмите удалить ключ.

Внутри прозрачного прямоугольник, который у нас теперь есть, собираются добавить текст. Выберите "Text Tool" (T) и используя большой жирный шрифт добавить название вашей статьи Показывая. После того как вы добавили название статьи добавить немного мета информацию о времени и дате и т.д. ...

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



Вы должны иметь что-то вроде этого

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


Создание статьи блога
--------------------------------------

При создании блога статей думать о том, как столбцы установки в журналах и газетах

Для этого макета я пошел на подобный взгляд использовании текстовых блоков, каждый блок текста есть мета-данные для этой статьи.

Как только вы начали добавлять статьи продолжают добавлять больше статей и разделов, как вы бы в журнале. Я пошел вперед и добавил простой раздел сообщества

Тогда я прикончил макет, добавив некоторые средства массовой информации, видео и фотографии и т.д. ...


The Footer

Завершите макет, добавив простые текстовые колонтитул с какой-нибудь социальной иконки для хорошей мерой

Перевод от - Admin6532
Djolezuk
https://64440884.uid.me/avatar.jpg
2');return false;" rel="nofollow" href="javascript://" name="1227">
09.12.2011 в 00:22 класно )
Saiqdrx
/avatar/23/6039-732056.jpg
3');return false;" rel="nofollow" href="javascript://" name="2711">
08.03.2012 в 16:49 exclusive37, раньше вроде на MVK лежала ?!
Betrue
4');return false;" rel="nofollow" href="javascript://" name="4187">
22.08.2012 в 17:11 хорош...!!!
(Admin)s...
5');return false;" rel="nofollow" href="javascript://" name="4198">
23.08.2012 в 09:22 ребята а эта проста рисавание неможна редактиравать текст в ХТМЛ ?
VedmaK
/avatar/01/464426.png
6');return false;" rel="nofollow" href="javascript://" name="4200">
23.08.2012 в 13:55 (Admin)sandu, как ты так пишешь???

И прости конечно я обычно не высказываюсь о других людях в интернете, но ты вообще хоть чуть чуть слышал о информатике, языках веб программирования?
Графический фаил не редактируется языком разметки!!

Существует еще такая вещь, как верстка шаблона (гугли) и даже если ты собираешься ей учиться, то это явно не подходящий для этого прокт
(Admin)s...
7');return false;" rel="nofollow" href="javascript://" name="4201">
23.08.2012 в 18:38 VedmaK, я нерускии я молдавскии и мне 14 лет я неочени могу писать по руски
STEZ
8');return false;" rel="nofollow" href="javascript://" name="4209">
25.08.2012 в 07:08
Quote ((Admin)sandu)
ребята а эта проста рисавание неможна редактиравать текст в ХТМЛ ?

Доступно только для пользователей
VedmaK
/avatar/01/464426.png
9');return false;" rel="nofollow" href="javascript://" name="4212">
25.08.2012 в 15:27 STEZ, а ничего что предложенный тобой сайт платный?

ну и это всё равно для статичных страниц. К примеру на этом же сайте блог сделан уже на Word Press
STEZ
10');return false;" rel="nofollow" href="javascript://" name="4214">
25.08.2012 в 23:51
Quote (VedmaK)
STEZ, а ничего что предложенный тобой сайт платный?

я и не говорил что он бесплатный, просто как варинт. хотя на мой взгляд куда проще взять готовый подходящий по структуре юкозовский шаблон.
Форум CREWEBIK.ru » design studio for uCoz » Дизайн мастерская » Уроки дизайна » Рисуем дизайн сайта (урок фотошопа ;))
  • Страница 1 из 1
  • 1
Поиск: