Урок №1 Как нарисовать макет для сайта в Photoshop

Автор Nadezhda Belousova
Урок №1  Как нарисовать макет для сайта в Photoshop

Здравствуйте в этом курсе.

Мы с вами на примере рассмотрим. Как рисовать макет программе Adobe Photoshop у меня стоит версия CS5 если у вас версия 3 или 4. Вы можете смело работать потому, что особых отличий.

Они не имеют начало отдавать я рассмотрим программу.

Вот она имеет такой вид нам понадобится. Верхнее меню при работе панель с инструментами и также панель со слоями и навигатор и также вы можете установить вид который для вас удобен настроить. Например у меня здесь есть для форматирования текста история там может быть у вас есть кисти — это можно всё убрать. Мне нужно. Главное чтобы было были панели для слоев и инструменты также верхней части если у вас стоит 5 версия есть такие вкладки например вкладка для рисования и уже будет немного другой вид и набор панелей и также. Если вы нажмете на стрелочку то можно увидеть различные виды сбор сбор панелей например для создания анимации 3D фотографии и также вы можете создать новую рабочую площадь пространство у меня называется рабочее пространство дизайн. Вот и я то есть выбрала необходимые компоненты для дальнейшей работы с макетом прежде чем вы начнете рисовать макет программе нужно определиться какой у нас будет макет по структуре вообще все макеты делятся на три вида это. Макет с одной колонкой. Макет с двумя колонками и мать с тремя колонками имею шапку и подвал. Если вы хотите придумать что-то уникальное не похожи на всё остальное я не советую этого делать давайте для начала научимся создавать типичный макеты потом будет проще сверстать установить на популярные бесплатные движки такие как же мы Drupal например WordPress так далее и так вот если. Открой мне с вами любой сайт тот же индекс то. Увидим, что все они состоят из колонок подвал шапки и например сайт YouTube тоже самое. Поэтому с вами не будем отходить от такой структуры и будем рисовать в нашем первом уроке макет состоящее из. Ну например двух колонок для начала мы должны создать. Полотно его можно создать двумя способами первые если мы заживём клавиша Control н н английская окно где мы указываем с вами ширину высоту макета и фон. Например можно указать. Белый показать в тот который сейчас у нас имеется ты тоже белый вон на панели инструментов и транспарент — это прозрачной. Также можно. Полотно при помощи меню верхнего File New и таким же образом мы задаем параметры для нашего будущего макета. Давайте в ширину советую указывать ширину 1024 пикселя поскольку — это у нас с вами будет минимальное разрешение экрана — это в принципе самое популярное разрешение то есть пользователи монитор. Допустим мы сами сделаем разрешение 1280 ширину макета 1280 пикселей. А У пользователя экран имеет расширение 1024 ширина то у него при просмотре сайта будет появляться горизонтальная полоса прокрутки и чтобы этого не было мы будем с вами рисовать макет рассчитанные на минимальную ширину 1024 пикселя записываем и высоту давайте сделаем 1000 пикселей фон сделать прозрачным то есть транспорт нажимай и у нас открывается окно где мы видим в прозрачный фон Toyota полотно в котором мы с вами будем создавать необходимые компоненты для нашего макета сейчас масштаб 50 для того чтобы увеличить изображение на нужно зажать клавишу Control и вместе с ней клавишу + 66 и 7% и 100% чтобы уменьшить масштаб мы с вами зажимаешь. Контру и минус навигатор — это в правой панели нужен для того чтобы просматривать необходимую часть которую не видно например чтобы не прокручивает на мышке и теперь давайте перейдем к тому как заливать фон у нас в левой панели есть два квадратика. Первый из них сейчас красный цвет данный цвет называется groundcover то есть он переднего плана и белый квадратик — это background-color то есть цвет фона. И если мы с вами нажмем на клавишу D английскую сбросить настройки. То есть у нас передний план станет черный задний белый и. Давайте зальем наш с вами макет белым цветом то есть фон сделаем белым цветом для этого зажимаем клавишу Control и клавишу Backspace вот мы получили белый фон из например. Вы хотите сделать чёрный фон там и зажимаем клавишу Alt Backspace и заливается чёрным. Давайте оставим белой вот таким образом мы сбрасываем цветов и при помощи горячих клавиш заливаем наш с вами макет уроке мы рассмотрим. Как создавать текстуры для фона. И я покажу так при помощи инструментов создать основные компоненты — это шапка и колонки с подвалом этот урок окончен. Спасибо за ним.

0 комментариев
0

Читайте также