ФотошопСундучок photoshopsunduchok
Начните свой путь в мир ФОТОШОПА сейчас!

 

 

 

БЕСПЛАТНЫЕ РАССЫЛКИ ВКОНТАКТЕ

(более 20 рассылок) 

 

 

Помощь сайту

Понравился сайт? Внесите вклад в его развитие, пожертвовав любую сумму.

Деньги пойдут на оплату серверов и на развитие сайта.

В примечании к платежу, при желании, укажите свои данные.

Меценаты

Присоединяйтесь в

Вход на сайт

Профиль

Кто на сайте

Сейчас на сайте 118 гостей и нет пользователей

 

 

 

 

 

 

Последние комментарии

Яндекс.Метрика

Ни одна современная веб-страница не может обойтись без графического оформления. И чем оно эффектнее, тем больше популярность сайта.

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

Думаете делать графику для сайта в Photoshop сложно? Вовсе нет!
В рубрике "Уроки фотошопа графика" Вы узнаете, как всего за пару действий можно создать привлекательные кнопочки для сайта, которые откровенно будут заманивать ваших посетителей кликнуть по ним.
Кроме того, вы научитесь делать удобные навигационные панели, хедеры для сайта и многое другое.

Большая просьба сообщать о неработающих ссылках в комментариях.

Получать новые уроки по работе с графикой, Вы можете в форме подписки ниже:

 

Создание кнопки в фотошопе

 
 

Создание кнопки в фотошопе

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

Урок сделан в русифицированой программе Photoshop CS3, но может быть выполнен практически в любой версии фотошопа.

 15

Подобные публикации:

 

Печать

Как сделать кнопку для сайта

Как сделать кнопку для сайта

 

В этом уроке по работе фотошопом будет показан простой способ создания кнопки для сайта.

Урок сделан в версии фотошопа CS3, но может быть легко выполнен и других версиях фотошопа.

Урок сделан по мотивам книги "Adobe Photoshop CS6. Мастер-класс Евгении Тучкевич".

Объёмная кнопка

Подобные публикации:



{smooth-scroll-top}

Печать

Как сделать обводку в фотошопе

Как сделать обводку в фотошопе

 

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

Так как сделать обводку в фотошопе?

Окружность


{smooth-scroll-top}

Печать

Быстрый способ создания объёмной кнопки в фотошопе

 

 

Быстрый способ создания

объёмной кнопки в фотошопе

На изображениях очень многим нравится созданный эффект 3D для каких-либо частей картинки. И действительно такие фотографии смотрятся гораздо выигрышнее по сравнению с обычными изображениями.

В этом уроке по работе с фотошопом мы освоим быстрый способ создания объёмной кнопки в фотошопе, которую можно использовать в качестве графики на Вашем сайте.

Этот способ можно использовать и для придания каким-то элементам Вашего фото 3D эффекта.

 

Бирюзовая кнопка

 

Подобные публикации:

 

Печать

Создание кнопки

Создание кнопки


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

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

Кнопка

Подобные публикации:


{smooth-scroll-top}

Печать

Как сделать кнопку с тенью

Как сделать

кнопку с тенью


Графика на сайте играет большую роль. От внешнего вида всяких кнопочек, логотипов и т.д. и т.п. во многом зависит восприятие сайта и соответственно поведение посетителя - то ли он сразу закроет сайт или, наоборот, с интересом пощёлкаем по кнопкам, и почитает любопытную информацию. В этом уроке по работе с фотошопом с помощью несложных приёмов мы научимся делать кнопку с тенью.

Графика

Подобные публикации:


{smooth-scroll-top}

Печать

Создание объёмной кнопки для сайта

Создание объёмной кнопки для сайта
В этом уроке по работе с фотошопом я покажу как можно создать красивую объёмную кнопку для сайта.
Один из вариантов создания похожей кнопки я уже рассматривал в уроке под названием: "".
Откроем новый документ: "Файл - Новый" или просто нажмём Ctrl+N.
В окне документа установим параметры, указанные на рисунке. В дальнейшем размер кнопки можно будет уменьшить.
Установим цвет переднего плана чёрный. Для этого достаточно нажать клавишу D.
Выберем инструмент "Заливка" (G).
Щёлкнем по нашему документу и он окрасится в чёрный цвет.
Создадим новый слой. Для этого щёлкнем по второй справа иконке в палитре "Слои".
Выберем инструмент "Овальная область" (M).
Нажмём и удерживаем клавиши Alt и Shift, наведём курсор на центр нашего слоя, щёлкнем левой кнопкой мыши и создадим круглое выделение, расположенное по центру нашего изображения.
Зальём наше выделение любым цветом, отличным от чёрного. Для этого щёлкаем по иконке цвета переднего плана и в окне выбора цвета устанавливаем необходимый цвет, к примеру зелёный.
Выбираем инструмент "Заливка" (G) и щёлкаем им по нашему выделению. Оно окрасится в зелёный цвет.
Придадим верхнему слою некоторые стили. Для этого щёлкаем по второй слева иконке fx в палитре "Слои" и в раскрывшемся списке выбираем "Внутренняя тень".
В окне "Стиль слоя" я поставил значения, которые Вы видите на рисунке. Вы конечно можете выбрать свои параметры.
Переходим к параметру "Внутренне свечение". Я установил вот такие значения. Вы, как всегда, вольны выбрать то, что Вам нравится.
Выбираем "Глянец" и устанавливаем такие параметры, чтобы кнопка выглядела объёмной. Нажимаем "Да".
Придадим ещё большую объёмность нашей кнопке. Для этого идём по такому пути. Создаём новый слой - Ctrl+N.
Устанавливаем цвет перднего плана белый. Для этого вначале нажимаем D (цвета переднего и изаднего плана установились по умолчанию, т.е. цвет перднего плана чёрный, а заднего - белый), а затем X (цвета переденго и заднего цветов поменялись местами).
Выбираем инструмент "Градиент" (G).
Щёлкнув по окошку градиента, выбираем градиент от цвета переднего плана к прозрачности, градиент - линейный.
Проводим нашим градиентом сверху вниз.
Вот что у нас получилось.
Снимаем выделение - Ctrl+D.
Применяем инструмент трансформирования - Ctrl+T.
Нижний центральный маркер двигаем вверх.
Левый и правый центральные маркеры двигаем вправо и влево соответственно.
Поворачиваем рамку трансформации по часовой стрелке.
Перемещаем рамку в верхний правый угол.
Нажимаем Enter.
Дублируем верхний слой, просто перетащив его на вторую справа иконку "Создать новый слой" палитры "Слои".
Идём в "Редактирование - Трансформирование - Отразить по горизонтали".
Точно также отражаем по вертикали и перетаскиваем с помощью инструмента "Перемещение" (V) наш блик в нижний левый противоположный угол.
У нас остался активным верхний слой. Нажимаем сочетание клавиш Ctrl+E и наши два слоя с бликами объединятся.
Выбираем "Фильтр - Размытие - Размытие по Гауссу".
В окне фильтра примерно устанавливаем такой радиус размытия.
Переходим на слой с зелёной кнопкой и устанавливаем параметр "Заливка" для этого слоя равным нулю.
Переходим на верхний слой и создаём новый слой - Ctrl+N.
Выбираем, к примеру, синий цвет и заливаем им, с помощью инструмента "Заливка" (G) наш верхний слой. Всё точно также, как и описывалось выше.
Выберем инструмент "Горизонтальный текст" и что-нибудь напишем.
Объединим текстовый слой и "Слой 3" - Ctrl+E.
Перетащим наш объединённый слой под слой с кнопкой и инструментом "Перемещение" (V), разместим нашу надпись по центру кнопки.
Щёлкнем левой кнопкой мыши по зелёной кнопке (Слой 1) и наша кнопка выделится.
Нажмём сочетание клавиш Shift+Ctrl+I и наше выделение инвертируется.
Нажимаем кнопку Delete и снимаем выделение - Ctrl+D. Наша кнопка готова!

В этом уроке по работе с фотошопом я покажу как можно создать красивую объёмную кнопку для сайта.

Один из вариантов создания похожей кнопки я уже рассматривал в уроке под названием: "Создание круглой кнопки для Вашего сайта".


Подобные публикации:


{smooth-scroll-top}

Печать

Создание круглой кнопки для Вашего сайта

 

Создание круглой кнопки для Вашего сайта
В этом уроке по работе с фотошопом я покажу простой способ создания круглой кнопки для Вашего сайта.
Создадим новый документ - "Файл - Новый" или просто нажмём Ctrl+N.
В окне нового документа выберем примерно такие параметры, которые указаны на рисунке. Нажмём "Да".
Появится новый документ.
Выберем инструмент "Овальная область".
Установим параметры: заданный размер и ширину и высоту поставим по 80 пикселов.
Чтобы получился круг, удерживаем клавишу Shift и проводим по нашему документу. Появляется выделение в виде круга.
Выбираем инструмент "Градиент" (G), щёлкаем по полю градиента для его редактирования.
В окошке "Редактор градиента" щёлкаем по нижним маркерам (поочерёдно), потом по полю "Цвет" и в окне "Выберите цвет" подбираем необходимые нам цвета для левого и правого маркеров градиента.
Я остановился на таких, а Вы можете подобрать цвета более подходящие для дизайна Вашего сайта. В окне "Редактор градиентов" нажимаем "Да".
Проводим градиентом под углом 45 градусов по нашему выделению.
Получился вот такой градиентный переход.
Опять выбираем инструмент "Овальная область", с теми же параметрами, за исключением высоты и ширины - устанавливаем по 60 пикселов.
Удерживаем клавишу Shift, создаём новое выделение и размещаем его по центру нашей картинки.
Опять выбираем тот же самый градиент.
Проводим градиентом по нашему выделению под углом в 45 градусов, но уже в другую сторону.
Вот что у нас получилось.
Снимаем выделение - Ctrl+D.
Что-нибудь напишем, к примеру цифру 1. Придайте ей любые эффекты, я добавил тень, тиснение и наложение цвета. А Вы вольны выбрать что Вам понравится. Если кто забыл, эффекты добавляются щелчком по второй слева иконке fх в палитре "Слои".
Все предыдущие скриншоты экрана я делал при увеличенном масштабе, чтобы можно было понять как применять те или иные инструменты. А теперь посмотрите как выглядит наша кнопка при 100% просмотре.

В этом уроке по работе с фотошопом я покажу простой способ создания круглой кнопки для Вашего сайта.



{smooth-scroll-top}

Печать

Популярные уроки сайта:

Prev Next

Создание масок из кан…

Видеоуроки

  Видео урок Создание масок из каналов и их объединение Когда мы создаем коллаж или делаем фотомонтаж, то очень частой операцией является выделение объекта и перенос его на другой фон. Выделение объекта можно...

Читать далее

Как сделать стекающий…

Уроки фотошопа текст

Как сделать стекающий текст в фотошопе   Всем привет! Сегодня мы будем создавать стекающий текст. Стекающий текст выглядит довольно необычно. Эффект стекающего текста вы сможете использовать в своих работах как с материалами из папки...

Читать далее

Как улучшить картинку…

Видеоуроки

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

Читать далее

Яркий логотип в фотош…

Уроки рисования в фотошопе

  Яркий логотип в фотошопе   Всем привет! Сегодня мы будем рисовать яркий логотип. Используя приемы, показанные в уроке, вы сможете создать не только логотип, а и, например, афишу, визитку или даже обои для рабочего стола. Сначала...

Читать далее

Как сделать светящийс…

Уроки фотошопа текст

Как сделать светящийся текст в фотошопе   Всем привет! Сегодня мы будем создавать светящийся текст. Эффект светящегося текста не сложен в исполнении, но выглядит очень стильно. Сначала мы создадим новый документ и зальем фоновый слой...

Читать далее

Коррекция контровых ф…

Обработка фотографий в фотошопе

Коррекция контровых фотографий в фотошопе. Метод №1 Контровая фотография – это такой момент съёмки, когда источник света находится позади снимаемого объекта. В результате можем получить проработанный передний план и «убитый» задний, или наоборот. В целом...

Читать далее

Коррекция контровых ф…

Обработка фотографий в фотошопе

Коррекция контровых фотографий в фотошопе. Метод №2 Продолжаем тему работы с тенями и светами, применительно к коррекции контровых фотографий. Первый урок здесь: https://www.photoshopsunduchok.ru/uroki/fotograf/5427-kontrovykh-fotografij Мы с Вами остановились на том, что выяснили, что метод, изложенный в 1-м...

Читать далее

Рождественская откры…

Уроки рисования в фотошопе

  Рождественская открытка для фотошопа   Всем привет! Сегодня мы будем рисовать открытку к Рождеству. Рождество – светлый семейный праздник, которого с нетерпением ждут и дети, и взрослые. Существует много прекрасных традиций, приуроченных к этому...

Читать далее

Новогодние пресеты дл…

Обработка фотографий в фотошопе

  Новогодние пресеты для фотошопа У нас продолжается Новогодняя неделя и вскоре мы будем праздновать Старый Новый год! :-) В связи с этим решил подарить Вам 8 пресетов (стилей, 3D лутов) для раскрашивания...

Читать далее

Мини-курс «Обработка …

Обработка фотографий в фотошопе

Мини-курс «Обработка контровой фотографии» Продолжаю серию мини-курсов по обработке фотографий. Напомню, что мы с Вами рассмотрели различные варианты работы с яркой солнечной фотографией: разбитой на темную и светлую половину пейзажной пейзажной с большим количеством водных...

Читать далее

Анимация мигающие ого…

Уроки анимации в фотошопе

Анимация мигающие огоньки в фотошопе   Всем привет! Сегодня мы будем создавать анимацию свечения огоньков на елочке. Огоньки на елке добавляют самому любимому празднику детей и взрослых, Новому Году, еще больше волшебства. Мы попробуем погрузиться...

Читать далее

Команда «Выделение и …

Видеоуроки

  Видео урок Команда «Выделение и маска» в фотошопе В этом уроке применим возможности команды «Выделение и маска» для того, чтобы вырезать нужный объект на фотографии. Заодно рассмотрим какие новые функции появились у этой...

Читать далее

Подготовка темного фо…

Видеоуроки

  Видео урок Подготовка темного фото кобработке в фотошопе  Практически любая обработка фотографии, будь то методика Дэна Маргулиса или просто классическая обработка снимка, должна начинаться с устранения посторонних проблемных цветов с изображения. Но, если...

Читать далее

Обои со снежинками в ф…

Уроки рисования в фотошопе

  Обои со снежинками в фотошопе   Всем привет! Сегодня мы будем рисовать новогодние обои для рабочего стола – со снежинками. Вот и наступила зима! Какой она будет – морозной и снежной или теплой и мягкой?...

Читать далее

Замена неба в фотошоп…

Видеоуроки

  Видео урок Замена неба в фотошопе В последних версиях фотошопа появились отдельные интересные функции по выделению объектов. В частности, мне понравилось, как работает команда «Замена неба». Поэтому записал два урока. В первом уроке рассмотрим эту...

Читать далее

Новогодняя открытка в…

Уроки рисования в фотошопе

  Новогодняя открытка в фотошопе   Всем привет! Сегодня мы будем рисовать новогоднюю открытку. В преддверии самого сказочного и любимого праздника в году мы будем создавать себе праздничное настроение, рисуя новогоднюю открытку. Такой открыткой вы можете...

Читать далее

Инструмент Быстрая ма…

Обработка фотографий в фотошопе

  Инструмент Быстрая маска в фотошопе   Всем привет! Зима, холодно, а хочется тепла, моря и романтики. В сегодняшнем нашем уроке "Инструмент Быстрая маска в фотошопе" мы с вами создадим красивую романтичную картинку...

Читать далее

Как сделать новогодни…

Уроки рисования в фотошопе

  Как сделать новогодние обои с елочкой в фотошопе   Всем привет! Сегодня мы будем рисовать новогодние обои с елочкой из снежинок. Такие обои будут создавать вам праздничное настроение! Сначала мы создадим новый документ, зальем фоновый слой красным...

Читать далее

Инструмент трассиров…

Обработка фотографий в фотошопе

  Инструмент трассировка в фотошопе   Всем привет! Продолжаем рассматривать новые возможности программы Adobe Photoshop (версия 22.0). В этой версии программы появилась интересная возможность обычным пользователям наравне с бета-тестировщиками испробовать новые инструменты. Давайте...

Читать далее

Как нарисовать штрих-…

Уроки рисования в фотошопе

  Как нарисовать штрих-код в фотошопе   Всем привет! Сегодня мы будем рисовать штрих-код. Штрих код - графическая информация, которая помещается на товар и хранит информацию о его происхождении в зашифрованном виде. Сначала мы создадим новый документ...

Читать далее

Текст пунктиром в фот…

Уроки фотошопа текст

Текст пунктиром в фотошопе   Всем привет! Сегодня мы будем создавать текст с пунктирными линиями. Такой текст украсит ваши работы, например, визитки, плакаты, афиши, логотипы или открытки. Сначала мы создадим новый документ с белым фоном, установим...

Читать далее

Как сделать текстуру …

Уроки рисования в фотошопе

  Как сделать текстуру камня в фотошопе   Всем привет! Сегодня в уроке "Как сделать текстуру камня в фотошопе" мы будем рисовать текстуру камня. В уроке мы рассмотрим два способа создания текстуры камня. Оба способа очень простые...

Читать далее

Pro-экшены. Как ускорит…

Видеоуроки

Pro-экшены. Как ускорить и упростить обработку фотографий в Photoshop   В Интернете, в свободном пользовании, существует довольно много экшенов (операций) для фотошопа. И многие стремятся накачать как можно больше для себя экшенов, думая...

Читать далее

Медная текстура в фот…

Уроки рисования в фотошопе

  Медная текстура в фотошопе   Всем привет! Сегодня мы будем рисовать медную текстуру. Этот урок примечателен тем, что нам не понадобятся исходники или готовые текстуры. Весь процесс будет происходить с нуля. Сначала мы создадим новый квадратный документ и применим...

Читать далее

Как аккуратно поднять…

Обработка фотографий в фотошопе

  Как аккуратно поднять насыщенность цвета   В этом уроке мы продолжим работать с результатом, который получили в предыдущем материале «Как добавить контраст на фото», когда подняли контраст фотографии необычным способом. Существует множество способов поднятия...

Читать далее

Как добавить контраст…

Обработка фотографий в фотошопе

  Как добавить контраст на фото   Существует множество способов добавить контраст к изображению, и они сильно различаются. К примеру, ползунок «Контрастность» в фильтре Camera Raw, ползунок «Контрастность» в инструменте «Яркость/Контрастность» или, наконец, обычные «Кривые»...

Читать далее

Как сделать радужную …

Уроки фотошопа текст

Как сделать радужную обводку в фотошопе   Всем привет! Сегодня мы будем создавать эффект радужной обводки для текста. Текст с радужной обводкой выглядит просто и, в то же время, оригинально и необычно. Такой текст...

Читать далее

Соглашение / Оферта
Автор сайта: Накрошаев Олег, Все права защищены Copyright, © 2009-2020