Базовые инструменты Photoshop для новичков. Все версии Фотошоп – описание и особенности Adobe photoshop является

Введение

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

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

Поскольку данная работа посвящена использованию программы Adobe Photoshop именно в web-дизайне, было приемлемо условно поделить ее на две части. Первая посвящена самой программе - вернее, тому минимуму, не зная который, пользователь может не понять, о чем идет речь и web-дизайну, во второй части вы узнаете об одном из вариантов создания простого дизайна сайта посредством программы Photoshop.

Цель данной работы: создать дизайн сайта с использованием программы Adobe Photoshop.

привести основную информацию о программе, ее назначении, функциях, инструментах;

рассмотреть понятие основные и правила web-дизайна;

рассмотреть применение Photoshop в web-дизайне на конкретном примере - шаблон сайта к 65-и летию Победы.

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

Учебные материалы были разработаны на основе сайта созданного к 65-летию Победы в Великой Отечественной Войне.

Глава 1. Возможности программы Adobe Photoshop в web-дизайне

.1 Графический редактор Adobe Photoshop.

растровый графический редактор, разработанный и распространяемый фирмой Adobe Systems. Этот продукт является лидером рынка в области коммерческих средств редактирования растровых изображений, и наиболее известным продуктом фирмы Adobe. Часто эту программу называют просто Photoshop (Фотошоп). В настоящее время Photoshop доступен на платформах Mac OS X/Mac OS и Microsoft Windows. Ранние версии редактора были импортированы под SGI IRIX, но официальная поддержка была прекращена начиная с третьей версии продукта. Для версии CS 2 возможен запуск под Linux с помощью альтернативы Windows API - Wine 0.9.54 и выше.

Несмотря на то, что изначально программа была разработана для редактирования изображений для печати на бумаге (прежде всего, для полиграфии), в данное время она широко используется в веб-дизайне. В более ранней версии была включена специальная программа для этих целей - Adobe ImageReady, которая была исключена из версии CS3 за счёт интеграции её функций в сам Photoshop, а также включения в линейку программных продуктов Adobe Fireworks, перешедшего в собственность Adobe после приобретения компании Macromedia.тесно связан с другими программами для обработки медиафайлов, анимации и другого творчества. Совместно с такими программами, как Adobe ImageReady (программа упразднена в версии CS3), Adobe Illustrator, Adobe Premiere, Adobe After Effects и Adobe Encore DVD, он может использоваться для создания профессиональных DVD, обеспечивает средства нелинейного монтажа и создания таких спецэффектов, как фоны, текстуры и т. д. для телевидения, кинематографа и всемирной паутины. Основной формат Photoshop, PSD, может быть экспортирован и импортирован во весь ряд этих программных продуктов. Photoshop CS поддерживает создание меню для DVD. Совместно с Adobe Encore DVD, Photoshop позволяет создавать меню или кнопки DVD. Photoshop CS3 в версии Extended поддерживает также работу с трёхмерными слоями.

Из-за высокой популярности Photoshop, поддержка его формата файлов, PSD, была реализована в его основных конкурентах, таких, как Macromedia Fireworks, Corel PHOTO-PAINT, Pixel image editor, WinImages, GIMP, Jasc Paintshop Pro и т. д.поддерживает следующие цветовые модели:

RGB,.Photoshop предназначен для редактирования и создания растровой графики (bitmapped images). Программа используется для работы с фотографиями и коллажами из них, рисованными иллюстрациями, слайдами и мультипликацией.обладает практически безграничными возможностями. Его с успехом используют фотохудожники для ретуши, цветовой и тоновой коррекции, повышения резкости и создания художественных эффектов. Хорошо продуманный набор инструментов для работы с частями изображения незаменим для оформления монтажей.

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

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

Увеличено пространство экрана для редактирования, при этом все необходимые инструменты остаются доступными. Палитры находятся в удобных, самонастраивающихся доках, которые могут быть развернуты в полный размер или уменьшены до иконок, помимо этого их можно сузить до самовоспроизводящихся полосок в углу вашего монитора.® Bridge CS3 представляет усовершенствованную систему, панель Фильтров для облегчения поиска, способность сгруппировать несколько изображений в одной "миниатюре" (уменьшенная и упрощенная копия графического объекта, а также макета компонуемого документа), инструмент

Лупа, автономный просмотр изображения, и т.д.

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

Обработка raw изображений с большей скоростью и улучшенным конверсионным качеством при использовании плагина Adobe Photoshop® Camera Raw, в который добавлена поддержка форматов JPEG и TIFF; новые инструменты, в том числе Fill Light (свет) и Dust Busting (подавление шума); совместимость с программным Обеспечением Photoshop Adobe Lightroom™; совместимость с камерами более 150 моделей.

Точное управление размером страниц PDF, открытых в Photoshop; возможность добавления контроля безопасности и метаданных, таких как, например, авторское право, для изображений формата PDF; возможность создания более насыщенных, богатых изображений в файлах PDF и документах.

Переключение с программного обеспечения Photoshop Adobe Lightroom на Photoshop CS3 одним кликом мышки для редактирования ваших цифровых фотографий. Lightroom (продаётся отдельно) предоставляет большие возможности в импортировании, управлении и представлении файлов больших размеров цифровых изображений.

Улучшен контроль качества печати цветных изображений, добавлено большое окно предварительного просмотра печати с большим количеством управляющих возможностей. Добавлена возможность выбора принтера марок HP, Epson, and Canon, что позволяет учитывать их особенности и оптимизировать качество изображений

Возможность автоматической цветовой корректировки в панели Кривых (Curves), смешивании каналов (Channel Mixer), новое диалоговое окно конверсии черно-белого изображения.

Оптимизирована работа на Intel® и PowerPC® для систем Макинтош и Microsoft® Windows® XP и Windows Vista™.

Возможность автоматизировать общие производственные задачи. Установите скрипты, запишите серии шагов как необходимое действие для эффективной пакетной обработки и проектируйте однотипную графику быстрее с помощью Variables (Переменных).

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

Возможность импорта и экспорта большого количества форматов файлов, в том числе: PSD, BMP, Cineon, JPEG, JPEG2000, OPENEXR, PNG, Targa и TIFF.

Возможность создания мобильного содержимого, например, обои или screensavers для мобильных устройств, возможность предварительного просмотра в том виде, в каком оно будет отображено на этих устройствах, с помощью встроенного Adobe Device Central CS3. Настройка и редактирование проектов под размеры и освещение мобильного экрана.Flash® и технология Zoomify позволяют экспортировать изображения большого разрешения для просмотра изображений с помощью программного обеспечения Adobe Flash Player. Flash Player демонстрирует изображение быстро и эффективно, позволяя просмотрщикам рассмотреть детали с минимальной задержкой.

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

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

Возможность вычислений, вращений и деформаций растровой и векторной графики без потери качества. Возможность сохранения векторных данных из программного обеспечения Adobe Illustrator®.

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

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

Повышенная функциональность Channel Mixer облегчает его использование в черно-белой конверсии.

Возможность создания и редактирования 32-битных изображений, комбинирование нескольких в одном. 32-битное изображение сохраняет полную картину: от самых глубоких теней, до самых ярких светов. Новая обработка изображений и алгоритмы корректировки дают превосходные результаты.

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

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

Возможность изменения перспективы на новом слое с помощью продвинутого фильтра Vanishing Point, который позволяет создавать многоплановые объекты в одном изображении, соединять их под любым углом, а затем "обертывать" их графикой, текстом или изображением, например, для создания упаковочных макетов в натуральную величину и т.д.

Возможность создания точных соединений (композиций) при помощи автоматического выравнивания многочисленных слоев, основанных на однотипных изображениях. Команда Auto-align Layers быстро анализирует детали и передвижения, вращает или деформирует слои, для получения безупречного выравнивания, а команда Auto-blend Layers смешивает цвета и штрихует, для достижения однородного, подходящего для дальнейшего редактирования результата

Использование усовершенствованной технологии Photomerge®, которая использует новые возможности выравнивания и смешивания слоев, позволяет автоматически преобразовывать горизонтальные или вертикальные фотографии в панораму.

При выделении небольшой области и дальнейшем свободном растягивании этого выделения на нужные области изображения, инструмент Quick Selection доделает начатую работу, автоматически захватываю нужные области. Доводка выделения производится с помощью инструмента Refine Edgе

Возможность составления изображений, текстов, различных эффектов на сотнях слоев для достижения неподражаемых результатов. Организация слоев вплоть до пяти уровней вложения, сохрание в различных комбинациях как аккомпанементы слоя (Layer Comps).

1.2 Понятие и основные правила web-дизайна

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

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

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

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

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

В современном Веб принято неразговорчивое соглашение о том, что - профессиональный веб-сайт должен корректно отображаться при экранном разрешении 640×480 точек с палитрой цветов в 256 цветов.

При отображении html-документа, рассчитанного на просмотр с, как все говорят, экранным разрешением 800×600 точек, на компьютере, настроенном на разрешение 640×480 точек, в нижней части, как люди привыкли выражаться, головного окна броузера как бы возникает, как большинство из нас привыкло говорить, горизонтальная полоса прокрутки, что существенно затрудняет исследование документа и вызывает огромное количество пререканий.

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

Очевидно, опосля подготовки начального шаблона будущей web-страницы его нужно, мягко говоря, протестировать на соответствие, как большинство из нас привыкло говорить, изложенным выше требованиям. Надо сказать то, что для этого, загрузив страничку в броузер, измените экранное разрешение и применяемую, как заведено, палитру цветов в настройках Windows. Вообразите себе один факт о том, что потом щелкните правой, как большинство из нас привыкло говорить, клавишей мыши в любом вольном от ярлычков участке Десктопа и, выбрав в показавшемся меню пункт Характеристики, перейдите на вкладку Настройка, как многие выражаются, диалогового окна Характеристики: Экран. И действительно, установив надлежащие значения в разделах Палитра цветов и Область экрана, щелкните мышью на кнопочке Применить, после этого согласитесь с конфигурацией характеристик, как большая часть из нас постоянно говорит, экранных опций без перезагрузки Windows.

Рекомендуется, наконец, проверить правильность отображения содержащейся в html-документе информации при изменении, как мы выражаемся, экранных опций в броузерах как Microsoft Internet Explorer, так и Netscape Navigator.

Правило 2

Последующее правило, в общем то, обосновано тем, что для вас непонятно программное обеспечение, которое, в конце концов, употребляется вашими возможными посетителями для просмотра web-страниц. Мало кто знает то, что идет речь о броузерах. Надо сказать то, что как понятно, Microsoft Internet Explorer и и остальные броузеры употребляют разные методы обработки HTML-кода, из-за чего же один и этот же элемент в этих 2-ух броузерах может, вообщем то, отображаться совсем, как все говорят, по-разному.

Посреди начинающих web-дизайнеров существует мировоззрение, как будто как бы вынудить страничку наконец-то смотреться как бы схожим образом в упомянутых программках решительно нереально. И даже не надо и говорить о том, что но это совсем не так: все различия меж броузерами отлично как раз поддаются, как всем известно, количественной оценке и анализу, наиболее того, существует огромное количество алгоритмов, применение которых как бы дозволяет свести неадекватность отображения страничек к минимуму. Мало кто знает то, что о их мы побеседуем позднее, пока же довольно, стало быть, уяснить последующее. Web-страница обязана идентично также отображаться в Microsoft InternetExplorer и остальных броузерах, при этом очень лучше - в крайней и предпоследней версиях данных программ.

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

Правило 3

Не тайна, что подавляющее большая часть пользователей употребляют для выхода в Веб dial-up соединение, другими словами, работают на неспешных линиях, подключаясь к, как всем известно, провайдерскому пулу с помощью модема. Очевидно, в данном случае скорость передачи данных (обычно, удручающе низкая) играет для их, как мы выражаемся, решающую роль: навряд ли кому-то доставит наслаждение дожи- даться загрузки, как все знают, 1-го html-документа 10-ки, мягко говоря, минут. Как бы это было не странно, но таковым образом, мы при- ходим к последующему, как всем известно, тривиальному «закону» web-дизайна.

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

Правило 4

Иной момент, о котором непременно следует упомянуть, касается навигации по веб-сайту. Несомненно, стоит упомянуть то, что у пользователя не обязано так сказать возникать ни мельчайших затруднений при переходе от 1-го раздела вашего ресурса к другому, независимо от модели его компьютера и типа установленного, как большинство из нас привыкло говорить, программного обеспечения. Несомненно, стоит упомянуть то, что он должен ясно представлять для себя, как мы с вами постоянно говорим, логическую структуру вашего проекта и, по способности, иметь доступ ко всем его компонентам в, как заведено выражаться, хоть какой момент времени. Конечно же, все мы очень хорошо знаем то, что конкретно, как заведено, потому нужно держать в голове последующее. Сделанная вами web-страница обязана непременно включать навигационные элементы, обхватывающие все разделы вашего веб-сайта, при этом эти элементы должны постоянно быть на виду. Их размещение следует, мягко говоря, выбирать, исходя из, как многие выражаются, наибольшего удобства для пользователя. Было бы плохо, если бы мы не отметили то, что ежели они, наконец, расположены в высшей части странички и пропадают из поля зрения опосля скроллинга (прокрутки экрана вниз), не забудьте продублировать их в нижней части документа. Надо сказать то, что графические ссылки и активные элементы как бы следует повторить в как бы испытательной форме в расчете на пользователей, в броузерах которых отключено отображение графики либо как раз отсутствует поддержка Java.

Правило 5

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

Правила 6 и 7

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

1.3 Применение Photoshop в web-дизайне

Рисование

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

Также web-дизайнеры оценят удобный и полный впечатляющих возможностей интерфейс внедренной в Photoshop программы ImageReady.создавался как программа, предназначенная для очень узкого круга потребителей, использующих настольные издательские системы. В те времена стоимость аппаратуры (компьютеры, сканеры, принтеры), необходимой для элементарной работы с изображениями, измерялась десятками тысяч долларов.

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

С развитием и повсеместным распространением Internet Photoshop превратился в программу № 1 для тех, кто создает свои страницы в WWW (World Wide Web). Язык описания Web-страниц, HTML (HyperText Markup Language), поддерживает использование только растровых изображений, а лучший редактор растровых изображений, конечно Photoshop. HTML исключительно прост, а визуальные редакторы (Microsoft Frontpage, Adobe GoLive, Macromedia Dreamwaver и др.) сделали верстку Web-страниц столь же простым делом, как набор текста с помощью текстового процессора. Это вызвало лавинообразный рост WWW, и, как следствие, спрос на инструменты создания Web-страниц. Но такие HTML редакторы добавляют кучу лишнего кода в файл страницы, из-за этого соответственно растет и вес вашего сайта.

Разработчики прекрасно понимают причины популярности своего детища и с каждой версией вводят в него возможности, ориентированные на новый слой потребителей, Web-дизайнеров.

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

Создание анимационных GIF-изображений.

Создание интерактивных элементов навигации: кнопок и панелей.

Оптимизация изображений при экспорте в форматы, принятые в Internet, - GIF и JPEG. "Штатные" фильтры экспорта не позволяли достичь требуемой компактности графических файлов.

Создание карт ссылок на основе изображений.

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

Для решения этих задач Web-дизайнеру приходилось использовать либо подключаемые модули для Photoshop сторонних фирм, либо вообще отдельные приложения. Фирма Adobe, зная о нуждах Web-дизайнеров, предложила им отдельный редактор растровых изображений ImageReady 1.0. Он представлял собой Photoshop, облегченный за счет изъятия некоторых инструментов и функций, которые применяются при подготовке изображений для полиграфического тиражирования. Особенно это относится к цветовой и тоновой коррекции, управлению цветом, работе с каналами, печати. Программа существенно удешевилась и, кроме того, в нее были внесены дополнения, необходимые именно для Web-дизайнера, в первую очередь, связанные с оптимизацией изображений. Судя по всему, программа не пользовалась достаточной популярностью, поскольку была лишена той гибкости и богатства возможностей, которые обеспечили Photoshop безусловное лидерство на рынке.

Первая версия ImageReady стала последней ее самостоятельной версией. Новый вариант ImageReady 2.0 был включен в Photoshop 5.5. Таким образом, пользователям Photoshop не пришлось расставаться с любимой программой для реализации недостающих функций. Новая версия Photoshop 6.0 содержит и новую версию ImageReady 3.0.

Подчеркнем, что ImageReady используется только в сфере Web-дизайна. Если вы готовите материалы для полиграфического тиражирования, то можете не устанавливать этот компонент и не читать настоящую главу. О том, насколько хорош ход, сделанный Adobe, можно поспорить. Вместо одной программы, Web-дизайнеру все равно приходится пользоваться двумя. Это не просто недостаточно удобно, но и приводит к неоправданной трате ресурсов компьютера: разработчики рекомендуют при одновременном использовании обоих компонентов дополнительные 32 Мбайт оперативной памяти и больше дискового пространства (для размещения виртуальной памяти обеих программ). Трата ресурсов эквивалентна дополнительному вложению денег в оборудование и потерям времени на переключение между приложениями. Что бы ни говорили рекламные буклеты об интеграции Photoshop и ImageReady, это все-таки отдельные программы. Даже передача изображений из одной программы в другую происходит через файл на диске, хотя это и скрыто от пользователя.

Глава 2. Создание шаблона сайта посредством программы Adobe Photoshop

.1 Создание шаблона сайта к 65-летию победы

web дизайн верстка рhotoshop

1. Создайте документ с размерами 1024*768 пикселей.

Создайте новый слой (ctrl+shift+n). Выберите инструмент Rectangular Marquee Tool (M). С помощью его выделите прямоугольную область, примерно как на рисунке ниже.

Теперь нам нужно сгладить углы выделения, сделать их округлыми. Для этого в горизонтальном меню ищем select -> modify -> smooth и выставляем значение sample radius на 4.

Результат будет выглядеть примерно так:

Выбираем инструмент Brush (B) и закрашиваем выделенную область белым цветом.

Назовем этот слой main.

Снимаем выделение (ctrl+d). Нажмите правой кнопкой на слой main, в контекстном меню выберите пункт Blending Options. Выставляем следующие значения:

Вот что примерно должно получиться:

Создаем новый слой. Назовем его head. На новом слое с помощью Rectangular Marquee Tool (M), создаем небольшой прямоугольник, как на рисунке:

Сглаживаем углы у выделения, делаем их округлыми (select - modify - smooth, 4).

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

Рис. 10

Если вдруг ваш прямоугольник встал криво или вы нарисовали его не по размеру, встав на слое head входим в режим трансформации объекта (ctrl+t), и трансформируем до получения требуемого результата.

Заходим в Blending Options слоя head и выставляем там следующие значения:

для Stroke

Рис. 11

Добавим на шапку небольшой блик. Выбираем инструмент Gradient Tool (G). Жмем на кнопку показанную на картинке, чтобы зайти в редактор градиентов (gradient editor).

Рис. 12

11. Выбираем цвет градиента от белого к прозрачному.

Рис. 13

Создаем новый слой, назовем его blik. Нажмите на слой иконку слоя head с зажатой клавишей ctrl, чтобы получить его выделение. Затем, не снимая выделения вернемся на слой blick и закрасим не большую область как на рисунке.

Рис. 14

Немного изменим прозрачность слоя с бликом. Для этого в панели слоев, встав на слой blick изменим значение opacity на 52.

Пришло время нарисовать кнопки для нашего шаблона. Для этого выбираем инструмент Rectangular Marquee Tool (M). С его помощью на новом слое (назовем его button) рисуем маленький прямоугольник. Закрашиваем его. Цвет мы выбрали красный.

Затем копируем слои с кнопками (ctrl+J), до нужного количества. Размешаем их по шапке. Добившись нужного размера, требуемого расстояния между кнопками, объединяем слои button в один (для этого выделите слои, которые хотите обледенить зажав клавишу ctrl, затем нажмите сочетание клавиш ctrl+e).

Рис. 16

Также мы нарисовали на новом слое красный прямоугольник, равный по размерам прямоугольнику на слое main, поместил его ниже остальных слоев и немного повернули. (ctrl+t).

Рис. 17

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

Так как шаблон задумывался посвященный дню победы, вот что в итоге получилось у нас:

Рис. 18

2.2 Особенности размещения информации на страницах сайта

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

Теперь посмотрим на шапку и то, что должно находится в ней: любая графика, которая делает сайт уникальным и узнаваемым, а также логотип сайта, отображающий его назначение, да еще визитная карточка, она же - средство вернуться на главную страницу. Да, именно так. В любом месте сайта щелчок по логотипу должен приводить к возврату на стартовую страницу. Кроме логотипа, в шапке может быть любая другая графика и даже какие-то основные команды, но их должно быть немного, например здесь допустимы элементы, для поиска по сайту. Не надо перегружать шапку и делать ее слишком высокой. В Интернете полно сайтов, в которых шапка по высоте больше, чем допускается, на 400 пикселей. Пользователи не любят скроллинг, поэтому основная информация должна быть видна сразу и без прокрутки.

Основа usability и правильного макетирования любого сайта - это меню. Если оно неудобно, то придется потратить слишком много времени на поиск необходимой информации или вообще отказаться от надежд найти ее. Где располагать меню? Чуть ниже шапки по горизонтали или по вертикали, но вдоль левого или правого края. Что выбрать? Зависит это от дизайна и количества основных разделов. Если основных разделов немного, то можно расположить меню горизонтально, вдоль верхней части. Оно может быть выполнено в виде простых ссылок, если нет подразделов, или в виде выпадающего меню. Выпадающее меню рекомендуется делать для сайтов, имеющих много подразделов, в поисках которых неудобно прыгать по разделам. Сейчас многие компании, которые не зарабатывают на баннерах и заботятся о благе посетителей сайта, переходят на использование таких меню, потому что они занимают мало места и при этом позволяют сделать меню сложной структуры - универсально, удобно, без "пересадок" можно добраться в самые отдаленные уголки сайта. Если разделов много и разместить их названия по горизонтали не удается, то придется размещать все по вертикали вдоль одной из сторон страницы (зависит от дизайна), но все же подумайте о создании горизонтального меню с выпадающими списками. Только не надо создавать два меню сразу (горизонтальное и вертикальное): испортится не только дизайн, но и usability, да и пользователь не узнает, в каком меню искать нужный раздел. Желательно, чтобы меню было одно и только одно. Если вы выбрали в качестве основного горизонтальное расположение ссылок, то вдоль края расположите нечто вроде "горячих ссылок" на тему выбранной страницы, но эти же ссылки должны быть и в основном меню. Горизонтальное меню должно умещаться в одну строку, особенно если есть выпадающий список.

Многие считают, что в низу сайта должен быть копирайт сайта и информация об авторстве на сайт или дизайн. Это верно, но не совсем, потому что, как говорят математики, данная информация необходима, но недостаточна. Допустим, каждая страница содержит очень много информации, а для того, чтобы увидеть самую нижнюю часть, нужно поработать скроллингом. Вот пользователь пролистал до нижней части страницы и решил перейти в другой раздел. Что делать? «Скролить» обратно на самый верх сайта, чтобы увидеть меню. По крайней мере, неудобно. В подвале сайта должна быть копия основных ссылок сайта. Конечно, копия меню - мелочь, но очень приятная, а каждая мелочь - это дополнительный пользователь.

Макет страницы должен разрабатываться вместе с дизайном. Некоторые дизайнеры рисуют внешний вид страницы, обращая внимание только на красоты и абсолютно не задумываются об удобстве использования. Не стоит повторять эту ошибку. Хорошо сконструированный сайт будет популярнее самого красивого - проверено практикой.

Заключение

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

Разобрали пример использования Photoshop при создании конкретного веб-сайта, посвященного 65-и летию победы. Рассмотрели способы снижения веса сайта, изучили основные требования к дизайну и некоторые приемы, как для создания более приятного внешнего вида шаблона, так и для поднятия юзабилити дизайна в целом.

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

Литература

1.Комолова Н.В., Яковлева Е.С. Adobe Photoshop CS3.- СПб.: БХВ-Петербург, 2007. - 752 с.

2.Дик Мак-Клелланд, Лори Ульрих Фуллер. Adobe Photoshop CS2. Библия пользователя = Photoshop CS2 Bible.

.Пономаренко С., Тайц А. Adobe Photoshop 4.0 в примерах - СПб: BHV, 1997. - 202 с.

.Леонтьев В. Новейшая энциклопедия персонального компьютера. - М.: ОЛМА-ПРЕСС, 1999. - 504 с.

.Web-дизайн по стандартам. Зельдман Д. 2005.

.Стильынй сайт с помошью CSS. Чарльз Смит. 2007.

Декабрь 14th, 2014

Программа Adobe Photoshop давно стала эталонной в программном классе редакторов растровой (пиксельной) графики. Проще говоря, фотошоп не имеет себе равных в возможностях обработки фотографий.

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

Богатые функциональные возможности программы реализуются посредством панели инструментов (оранжевая стрелка на снимке), набора меню (синяя) и панели параметров (зеленая).

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

Быстрая коррекция качества вызванной фотографии может быть произведена в автоматическом режиме тремя командами (синяя стрелка).

Для более тщательного редактирования используются команды меню «Коррекция» (оранжевая стрелка).
Ниже приведено несколько примеров редактирования фотографий посредством этих команд.

Впечатление ранневыпавшего снега создано посредством команды «Заменить цвет».

Оперативное отбеливание зубов осуществлено командой «Цветовой тон/Насыщенность».

Преобразование фона тюльпанов произведено командой «Поиск цвета».

Мужчина был «отправлен на курорт» с помощью команды «Микширование каналов».

Предыдущие примеры относились к целым фотографиям. Если необходимо откорректировать только ее часть, то она предварительно должна быть выделена посредством инструментов выделения или меню «Выделение».

После этого становится возможной локальная коррекция, например, цвета глаз.

Можно выборочно поменять цвет только выбранных тюльпанов.

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

Так, с помощью инструмента «Точечная восстанавливающая кисть» вполне возможно за минуту «осушить озеро», как показано ниже.

Инструмент «Заплатка» вполне способен оперативно удалить один из камней Стоунхенджа.

Посредством инструмента «Ремикс-заплатка» можно перемещать альпиниста по скале или добавить ему близнеца.

В результате взаимодействия инструментов «Текст» (оранжевая стрелка) и «Кисть» (синяя)

можно получить капающий текст с искрящимися льдинками.

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

Для качественной «окраски» блузки были использованы возможности слоев.

Соединение фото в Photoshop также было произведено с использованием слоев объединяемых фотографий.

Эффекты слоя были использованы для создания рамки фотографии. С помощью этого так же можно наложить фото на фото или склеить их , как было показано в приведенной по ссылке статье.

Особенности

Несмотря на то, что изначально программа была разработана как редактор изображений для полиграфии , в данное время она широко используется и в веб-дизайне . В более ранней версии была включена специальная программа для этих целей - Adobe ImageReady , которая была исключена из версии CS3 за счёт интеграции её функций в сам Photoshop, а также включения в линейку программных продуктов Adobe Fireworks , перешедшего в собственность Adobe после приобретения компании Macromedia .

Photoshop тесно связан с другими программами для обработки медиафайлов , анимации и другого творчества. Совместно с такими программами, как Adobe ImageReady (программа упразднена в версии CS3), Adobe Illustrator , Adobe Premiere , Adobe After Effects и Adobe Encore DVD, он может использоваться для создания профессиональных DVD , обеспечивает средства нелинейного монтажа и создания таких спецэффектов, как фоны, текстуры и т. д. для телевидения, кинематографа и всемирной паутины. Photoshop также прижился в кругах разработчиков компьютерных игр.

Возможно использовать трехмерные файлы для внедрения в двумерное фото. Доступны некоторые операции для обработки 3D-модели как работа с каркасами, выбор материалов из текстурных карт, настройка света. Также можно создавать надписи на 3D-объекте, вращать модели, изменять их размер и положение в пространстве. Программа включает в себя также команды по преобразованию плоских фотографий в трехмерные объекты определенной формы, такие как, например, банка, пирамида, цилиндр, сфера, конус и др.

Для имитации движения в Photoshop можно создавать кадры мультипликации, используя слои изображения. Можно создавать видеоизображения, основанные на одной из многих заданных пиксельных пропорций. После редактирования можно сохранить свою работу в виде файла GIF -анимации или PSD, который впоследствии можно проиграть во многих видеопрограммах, таких как Adobe Premiere Pro или Adobe After Effects . Доступно открытие или импортирование видеофайлов и последовательности изображений для редактирования и ретуширования, создание видеоряда мультипликации и экспорт работ в файл формата QuickTime, GIF-анимацию или последовательность изображений. Видеокадры можно отдельно редактировать, трансформировать, клонировать, применять к ним маски, фильтры, разные способы наложения пикселов, на них можно рисовать, используя различные инструменты.

Начиная с версии CS в Photoshop доступна работа со скриптами.

Photoshop поддерживает файлы DICOM (Digital Imaging and Communications in Medicine) - цифровые изображения и коммуникации в медицине. Для открытого в Photoshop DICOM-файла, можно использовать любой инструмент Photoshop для коррекции и ретуширования изображений.

И, наконец, с помощью программы Photoshop Extended можно рассматривать MATLAB -изображения, обрабатывать их в программе Photoshop, комбинировать команды MATLAB с технологиями обработки изображений Photoshop. Как только устанавливается соединение с программой Photoshop из программы MATLAB и осуществляется ввод команд в командную строку MATLAB, эти управляющие воздействия незамедлительно выполняются в Photoshop. Файлы, подготовленные в программе MATLAB, имеют расширение m, fig, rpt, mat, mdl. Коммуникация между Photoshop и MATLAB использует интерфейс Photoshop JavaScript и библиотечный интерфейс MATLAB.

«Пасхальные яйца»

Общие

Изображение мага Зажав Alt и, удерживая левую кнопку мыши, щёлкнуть чёрный треугольник в верхнем правом углу палитры Layers и выбрать в меню Panel Options. Этот маг (Мерлин) - долгоживущее «пасхальное яйцо», присутствующее в Photoshop с версии 3.0. Альтернативная заставка Зажав Ctrl , выбрать Help (Справка) → About Photoshop (О Photoshop). Для Mac OS: ⌘ Cmd , Photoshop → About Photoshop. Картинка меняется от версии к версии. Например, в CS2 на заставке изображена обезьяна в космосе, в CS3 - красная таблетка , в CS4 - Стоунхендж , в котором можно прочитать название версии (CS4). А в CS5 - белый кролик и надпись White Rabbit . В бета-версиях альтернативная заставка показывается по умолчанию, а при нажатии Ctrl - стандартная (релизная). В CS6 это нарисованный текстом кот с заголовком Superstition. Хотя альтернативная заставка сама по себе является пасхальным яйцом, в неё часто включают другие пасхальные яйца. Одно из них… Электрический кот Версия 4.0 имела кодовое название Big Electric Cat. Электрический кот стал талисманом Photoshop и встречается на альтернативных заставках всех версий вплоть до CS5 (кроме CS4). В некоторых версиях (7.0 / Liquid Sky, CS3 / Red Pill) он скрыт; чтобы его увидеть, следует сделать снимок экрана и на снимке поднять яркость изображения.

Специфичные для CS3

Фото Брюса Фрейзера Сделать снимок экрана с альтернативной заставкой, затем убавить в нём brightness до упора (−150). Это «пасхальное яйцо» сделано в память об умершем незадолго до выхода CS3 Брюсе Фрейзере, авторе книг по Photoshop. Красные следы от лапы кота Сделать снимок экрана с альтернативной заставкой, затем открыть Уровни (Ctrl + L) и в средней ячейке поменять 1,00 на 9. В самом низу также появляется надпись: «Alternative beta splash screen by Jeffrey Tranberry for my grandmother Maxine Tranberry and my kitties Duane and Debbie».

См. также

Примечания

Литература

  • Дэн Маргулис. Photoshop для профессионалов. Классическое руководство по цветокоррекции (+ CD-ROM) = Professional Photoshop: The Classic Guide to Color Correction. - Интерсофтмарк, 2003. - 464 с. - ISBN 5-902-56904-4
  • Лайза Дейли, Брэд Дейли. Adobe Photoshop CS5. Библия пользователя = Photoshop CS5 Bible. - М .: Диалектика, 2011. - 848 с. - ISBN 978-5-845-91716-4
  • Мэтт Клосковски. Слои в Photoshop: полное руководство по применению самого эффективного средства = Layers: The Complete Guide to Photoshop’s Most Powerful Feature. - 2-е изд. - М .: Вильямс, 2011. - 304 с. - ISBN 978-5-845-91729-4
  • Скотт Келби. Adobe Photoshop CS5: справочник по цифровой фотографии = The Adobe Photoshop CS5 Book for Digital Photographers. - М .: Вильямс, 2011. - 400 с. - ISBN 978-5-845-91727-0
  • Брюс Фрейзер. Реальный мир Camera Raw и Adobe Photoshop CS2 = World Camera Raw with Adobe Photoshop CS2. - Вильямс, 2007. - 304 с. - ISBN 5-845-90978-3
  • Питер Бойер. Adobe Photoshop CS5 для чайников = Photoshop CS5 For Dummies. - М .: Диалектика, 2010. - С. 432. - ISBN 978-5-845-91694-5
  • Яковлева Е. С. 3D-графика и видео в Photoshop CS4 Extended. - СПб. : БХВ-Петербург, 2010. - 272 с. - ISBN 978-5-977-50486-7
  • Александр Ефремов. Цифровая фотография и Photoshop. Уроки мастерства. - СПб. : Питер , 2009. - 192 с. - ISBN 978-5-388-00387-4

Ссылки

  • Страница семейства продуктов Adobe Photoshop (рус.) на официальном сайте Adobe
  • Обработка видео в Adobe Photoshop iXBT.com , обзорная статья

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

На сегодняшний день, Adobe Photoshop стал настолько насыщенным различными возможностями, что вам стоит использовать именно его. Не будет преувеличением сказать, что он является самым известным графическим редактором в мире. Уже на протяжении 20 лет разработчики совершенствуют свое детище, делая его все совершеннее с каждой новой версией.

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

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

Основные инструменты Photoshop

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

  1. Инструмент «Пипетка» (Eyedropper Tool)

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

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

  2. Инструмент «Текст» (Type Tool)

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

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

  3. Инструмент «Затемнитель» (Burn Tool)

    Горячая клавиша для вызова данного инструмента – кнопка латинской буквы «O ». «Затемнитель », как следует из названия, предназначен для затемнения областей изображения. Белые и светлые пиксели затемняются данным инструментом, который выглядит как рука. Чем больше раз вы используете «Затемнитель » в одной области, тем больше она будет приближаться к черному цвету. Нажмите левой кнопкой и задержите над соответствующей иконкой на панели инструментов, чтобы выбрать «Затемнитель » (см. изображение ниже). Далее, выберите кисть из набора в выпадающем списке на верхней панели.

    Теперь вы можете настроить размер кисти по своему желанию, выбирать диапазон воздействия инструмента (тёмные, средние, светлые тона). Диапазон «Тёмные тона » позволяет воздействовать только тёмные области изображения, «Средние тона » затрагивают только области средней яркости, а диапазон «Светлые тон а», соответственно, позволяет затемнять только самые светлые области.

    Также вы можете настроить экспозицию (Изображение>Коррекция>Экспозиция) для регулирования величины коррекции, производимой инструментом «Затемнитель ». Меньшее значение дает больший контроль над затемнением. Чтобы воспользоваться инструментом, просто проведите кистью там, где хотите затемнить участок изображения. Если вы не удовлетворены результатом, то нажмите комбинацию клавиш Ctrl+Z, чтобы отменить действие.

  4. Инструмент «Осветлитель» (Dodge Tool)

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

    Выберите инструмент «Осветлитель » на панели инструментов и задайте нужный тип и размер кисти, используя выпадающий список на панели в верхней части окна программы. Затем, выберите диапазон воздействия: тёмные, средние или светлые тона. Затем вы можете изменить экспозицию для настройки степени воздействия инструмента на изображение. Используйте «Осветлитель » только на малых областях. Этот инструмент позволяет вам изменять только имеющиеся изображения и неприменим для их создания.

  5. Инструмент «Палец» (Smudge Tool)

    Этот инструмент предназначен для смазывания и использует эффект искривления. Данный инструмент смазывает пиксели таким образом, что это похоже на использование акварельных красок, и имеет свои настройки. Инструмент «Палец» рекомендуется использовать на небольших областях, чтобы эффект выглядел натурально. Если вы будете им злоупотреблять, то можете потерять необходимые детали изображения.

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

  6. Инструмент «Размытие» (Blur Tool)

    Данный инструмент может быть использован для реставрации изображений и создания художественных эффектов, например эффекта движения футбольного мяча. Смазывание также может использоваться для фокусировки внимания зрителя на специфических элементах. Это достигается уменьшением контрастности между соседними пикселями. Инструмент «Размытие » используется похожим с инструментом «Палец » образом.

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

    Выберите режим наложения и интенсивность воздействия инструмента на панели опций, чтобы задать нужные параметры размытия.Если изображение состоит из нескольких слоев, вы можете отметить опцию «Образец со всех слоев », чтобы соседние пиксели при размытии брались со всех слоев. Примените инструмент «Размытие » в нужных областях и не забудьте сохранить файл после внесения изменений.

  7. Инструмент «Заливка с учетом содержимого» (Content Aware Fill Tool)

    Этот инструмент, на основе анализа изображения, может убирать с него нежелательные элементы (например, мусор с песка). Это помогает исправить сложные, насыщенные различными деталями изображения.

    Сначала, создайте копию вашего изображения, чтобы не вносить изменений в оригинал. На панели слоев появится два одинаковых слоя, оригинальное изображение будет расположено внизу списка и помечено как «Фон ». Редактироваться будет копия изображения.Обведите область, которую вы хотите заменить или удалить с помощью инструмента «Выделение » (Selection Tool) с панели инструментов. Вы также можете зажать левую кнопку мыши над инструментом «Лассо » (Lasso Tool) и выбрать другие инструменты выделения, например, «Магнитное лассо » или «Полигональное лассо », в зависимости от формы объекта.

    Затем, нажмите на клавиатуре клавишу F , чтобы перейти в полноэкранный режим для простоты и выберите объект, двигая курсор близко к границам объекта. После этого перейдите в меню «Редактирование>Выполнить заливку.. » Выберите в выпадающем списке «С учетом содержимого » и нажмите ОК. Photoshop зальёт выбранную область, и объект будет удален. Если объект, который вы хотите удалить очень большой, вам может понадобиться разбить его на меньшие части и обработать их отдельно.

  8. Инструмент «Марионеточная трансформация» (Puppet Warp Tool)

    Это чрезвычайно полезный инструмент, для внесения мелких изменений в редактируемое изображение. Сначала, загрузите изображение и очень аккуратно выделите нужный объект. С помощью инструмента «Перо » (Pen Tool), обведите область вокруг объекта как можно точнее, закончив обводку в начальной точке и сформировав петлю. При выбранном инструменте «Перо », щелкните правой кнопкой мыши на образованной фигуре и выберите в выпадающем меню пункт «Образовать выделенную область.. » (Make a Selection).

    Введите значение для параметра «Радиус растушевки » (Feather Radius), затем нажмите OK. Далее, выберите инструмент «Область » (Marquee Tool), нажав правой кнопкой мыши на выделении и выбрав пункт «Уточнить край.. » (Refine Edge) для окончательного выбора области.

    Точно выделите объект и нажмите «Новый слой с маской » (New Layer with Mask). Теперь у вас два слоя: на одном находится объект, а на другом – оригинальное изображение, из которого этот объект будет удален.Перейдите в меню «Редактирование>Марионеточная трансформация » (Edit>Puppet Warp) и трансформируйте объект, располагая нужным образом ключевые точки. Перетаскивайте их, используя комбинацию Alt + клик для изменения формы объекта требуемым образом.

  9. Инструмент «Область» (Marquee Tool)

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

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

  10. Инструмент «Штамп» (Clone Stamp Tool)

    Этот инструмент используется для ретуширования таких недостатков как, например, синяки и ссадины. Он использует выбранные пользователем пиксели и замещает ими области редактирования.

    Откройте редактируемое изображение и выберите инструмент «Штамп » с панели инструментов в режиме эксперта. После этого, выберите тип и размер кисти из выпадающего списка. Затем, выберите режим наложения на панели опций. Используйте слайдер «Непрозрачность » (Opacity) на панели опций для того, чтобы сделать клонированные элементы более прозрачными.

    Затем, отметьте опцию «Выравнивание » (Aligned) для постоянного смещения, относительно клонируемого источника клонирования. Выберите опцию «Брать образец со всех слоев » (Choose the Sample All layers), если хотите, чтобы образец для клонирования брался со всех видимых слоев.

    Вы также можете использовать кнопку «Клонирование подложки » (Clone Overlay) для выравнивания объекта с нижележащим изображением. Используйте клавишу Alt + клик на изображении для выбора объекта клонирования, а затем левой кнопкой мыши примените клонирование в нужной области. Не забудьте сохранить отредактированное изображение.

  11. Инструмент «Сохранить для Web и устройств» (Save for Web and Devices)

    Выбрав меню «Файл>Сохранить для Web и устройств.. » (File>Save for Web and Devices..), вы можете подготовить фото и изображения для просмотра на различных устройствах. Открыв файл в полноэкранном режиме, выберите данный инструмент. В левой части экрана вы увидите оригинал, а в правой – изображение с примененными настройками качества.

    Путем выставления настроек найдите оптимальный размер для web-изображения. Кроме этого, вы можете уменьшить размер файла в диалоговом окне сохранения файла (доступны форматы JPEG, GIF, PNG 24 и другие, а также настройки качества конечного изображения). Выберите уровень зума изображения или введите точное значение. Установите зум в значение 100% и переключайте различные настройки, чтобы получить наилучшее соотношение качество/размер.

  12. Инструмент «Рамка» (Crop Tool)

    Размер холста изображения может быть обрезан с помощью инструмента «Рамка ». Вы можете как увеличить, так и уменьшить его размер. Откройте изображение и выберите этот инструмент на соответствующей панели. Также можно нажать латинскую клавишу «C » для быстрого вызова рамки.

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

Редактор Adobe Photoshop (фотошоп) - компьютерная программа для работы с компьютерной графикой.

Основные возможности этой программы:

  • 1. Обработка цифровых и отсканированных фотоснимков, цветокоррекция, спецэффекты, устранение различных дефектов съемки.
  • 2. Возможность создания многослойного изображения. При этом каждый элемент иллюстрации может быть сохранен в собственном, отдельном слое, который может редактироваться отдельно, перемещаться относительно других слоев и т.д.
  • 3. Фотомонтаж, составление коллажей.
  • 4. Ретуширование и восстановление старых фотографий.
  • 5. Обработка эскизов, нарисованных вручную.
  • 6. Улучшенные инструменты для работы с текстом. Используя различные инструменты, эффекты и фильтры можно получить очень интересные эффекты. Создание текстур для 3D моделей.
  • 7. Создание графических элементов дизайна и оформления для сайтов, документов, печати и полиграфии.
  • 8. Подготовка изображений к печати или публикации в Интернете.
  • 9. Поддержка различных стандартов изображения (RGB, CMYK, Grayscale и т.д.);
  • 10. Поддержка различных графических форматов, как растровых (BMP, JPEG, GIF), так и векторных (AI, CDR).
  • 11. Раскрашивание фотографий. Можно подкрашивать участки изображения на черно-белых фотографиях.

Интерфейс

Интерфейс графического редактора прост. После запуска программы на экране появляется окно, аналогично окнам других программ, работающих в среде Windows (рис.1).

Рис.1

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

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

Палитры предоставляют дополнительные возможности работы с программой, имеют почти одинаковую структуру и несколько вкладок. Они содержат элементы управления, помогающие управлять изображением, и используются для выбора наборов цветов, кистей, слоев и т.д. Для отображения палитры необходимо выбрать в строке меню "Окно", и в появившемся меню отметить нужную палитру. Убрать палитру можно, если снять соответствующий флажок в пункте меню "Окно" или закрыть ее как обычное окно кнопкой. Большинство палитр имеют дополнительные настройки. Для отображения вспомогательного меню нужно нажать кнопку в правом верхнем углу палитры. В нижней части окна программы расположена Строка состояния. В левой ее части отображается текущий масштаб активного документа. Правее отображается информация о документе. Строка содержит вспомогательное меню, вызываемое щелчком по кнопке

В нем выбирается информация, которую необходимо отображать в строке состояния.

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

Изображения в программе Adobe Photoshop.

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

Разрешение.

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

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

Размер файла.

Размер файла любого изображения измеряется в байтах, килобайтах, мегабайтах или гигабайтах. Изображение имеет размеры - ширину и высоту.

Цветовые представления RGB и CMYK.

Для вывода цветного изображения на монитор используются красный, зеленый и синий (Red, Green, Blue - RGB) лучи. Если смешать эти три основных цвета в чистом виде, получится белый цвет.

При четырехцветной печати используются три основных краски: голубой (С, cyan), пурпурный (М, magenta) и желтый (Y, yellow).

При их смешивании получается темный, непрозрачный цвет. Для того чтобы получить насыщенный черный цвет, обычно в принтерах смешиваются черные чернила (К, black) с небольшим количеством голубых, пурпурных и/или желтых чернил.

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

Каждое изображение в программе Photoshop состоит из одного и более полупрозрачных рисунков определенного цвета, называемых каналами. Например, изображение в режиме RGB составлено из красного, зеленого и синего каналов. (Для получения наглядного представления о них откройте цветное изображение, а затем на палитре Channels щелкните по одному из элементов Red, Green, Blue, чтобы отображался только этот канал). Иногда корректировка цвета касается только отдельного канала, но обычно изменения проводятся и отображаются в многоканальном, композитном изображении (самый верхний элемент на палитре Channels) и влияют на все каналы изображения одновременно. Специальные полутоновые каналы, используемые для сохранения выделенной области в качестве маски, называются альфа-каналами, и их можно добавить к изображению (рис. 1.4). Редактировать допускается только выделенные в данный момент каналы.

Режимы изображения.

Изображение можно преобразовать, отобразить и отредактировать в любом из восьми режимов: Bitmap (Битовая карта), Grayscale (Полутоновый), Duotone (Двутоновый), Indexed Color (Индексированный цвет),RGB,CMYK,Lab и Multichannel (Многоканальный).

Для того чтобы воспользоваться недоступным режимом (его имя выглядит тусклым), сначала необходимо преобразовать изображение в другое представление. Например, если вы хотите преобразовать изображение в режим Indexed Color, оно должно находиться в режиме RGB или Grayscale.

Некоторые изменения режима изображения вызывают заметные сдвиги цвета; другие касаются лишь едва уловимых нюансов. Разительные перемены могут произойти при преобразовании изображения из режима RGB в режим CMYK, так как выводимые на печать цвета будут заменены насыщенными, яркими RGB-цветами. Точность соответствия цветов может уменьшиться, если многократно преобразовать изображение из режима RGB в CMYK и обратно.

Сканеры среднего и низкого класса обычно позволяют получить только RGB-изображения. Если вы создаете изображение, которое впоследствии будет распечатано, для ускорения редактирования и применения фильтров работайте с ним в режиме RGB, a затем, когда будете готовы вывести изображение на печать, преобразуйте его в представление CMYK. Для того чтобы предварительно просмотреть изображение в режиме CMYK таким, каким он будет на печати, воспользуйтесь командами подменю "Вид > Установки пробного отпечатка" в сочетании с командами "Вид > Цвета пробного отпечатка". Мы рассмотрим наиболее нужные для работы режимы.

В режиме Bitmap, пиксели либо на 100% белые, либо на 100% черные, нет доступа к слоям, фильтрам, а также командам подменю "Корректировки", кроме команды "Обратить". Прежде чем преобразовать изображение в это представление, необходимо, чтобы оно имело представление Grayscale.

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

Изображение в режиме Indexed Color содержит один канал, а в таблице цветов может быть максимум 256 цветов или оттенков (8-битовое представление цвета). Это максимальное число цветов, доступных в наиболее приемлемых для Web форматах GIF и PNG-8. Зачастую при использовании изображений в мультимедийных приложениях бывает полезно уменьшать число их цветов до 8-битового представления. Также можно преобразовать изображение в режим Indexed Color, чтобы создать художественные цветовые эффекты.

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

Photoshop - одна из немногих программ, которые позволяют отображать и редактировать изображение в режиме CMYK. Изображение можно преобразовать в этот режим, когда оно уже готово для печати на цветном принтере.

Режим Duotone соответствует методу печати, при котором используются две или более печатные формы для получения более насыщенного и глубокого цвета в полутоновом изображении.

Источники изображений.

Любое изображение можно создать, открыть, редактировать и сохранить в 12 различных форматах Photoshop. Но обычно используются только несколько форматов: TIFF, GIF, JPEG, EPS и собственный формат файла программы Photoshop. Благодаря тому, что программа Photoshop воспринимает такое множество форматов, изображение для нее можно получить практически из любого источника: со сканера, из графического редактора, с компакт-диска, фотоснимка, видеоизображения и даже из других операционных систем. Также изображение может быть полностью создано в самой программе Photoshop.

Работа с текстом.

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

Также допускается изменять содержание текста, применять к нему разные эффекты слоя, изменять режим смешивания и уровень непрозрачности. Что же можно сделать с редактируемым текстовым слоем? Можно применить фильтры, очертить текст или заполнить его градиентом или рисунком. Чтобы осуществить эти операции, необходимо преобразовать текстовый слой в растровый формат с помощью команды меню Layer > Rasterize > Туре (Слой > Преобразовать в растровый формат > Текст). Но все не так просто. Как только текст будет преобразован в растровый формат, его типографские атрибуты (например, шрифт или стиль) уже изменить нельзя. Любые типы текста (редактируемый и др.) создаются с помощью инструмента Туре (Текст), меню "Layer" (Слои), палитры Character (Шрифт).

Редактируемый текст можно перемещать, трансформировать, менять его положение относительно других слоев, словом, выполнять над ним различные операции, не влияя на другие слои. В Photoshop предусмотрена также проверка правописания. Чтобы вызвать данный модуль, щелкните правой кнопкой мыши по текстовому блоку и в появившемся контекстном меню выберите команду Check Spelling. При обнаружении слова, которое отсутствует в словаре, программа контроля правописания предложит заменить его, внести в словарь или проигнорировать.