Реферат по информатике на тему

Реферат по информатике на тему

Графический редактор

 

 

Ученика 11^A класса школы №9 города Гатчины

Уварова Дмитрия

 

Оглавление

 

· Введение

· Словарь

· Основные принципы работы

· Интерфейс программы. Запуск, выход и первое знакомство

· Открытие документа, создание нового и сохранение

· Обзор основной панели инструментов

· Работа с объектами

· Работа с палитрами. Описание и примеры использования

· Дополнительные возможности

· Список литературы

Введение

 

Программа Adobe ImageStyler, созданная известной фирмой Adobe Systems Incorporated, предназначена для создания графического дизайна web-страниц (т.е. вы просто “рисуете” web-страницу так, как вам хотелось бы её видеть) и просто для создания качественных иллюстраций. Объединение мощи ее родственника Adobe Photoshop и простоту использования делает ее необычайно полезной для продуктивной работы.

Здесь мы рассмотрим основные возможности программы, ее специфику, и в конце покажем пример использования Adobe ImageStyler.

 

Словарь

 

· bitmap - точечное изображение.

· цветовая модель - способ представления изображения, которое может видеть человеческий глаз, на основе заданных характеристик цвета. Мы будем рассматривать RGB модель, где каждый элемент изображения представлен в виде наборов трех составляющих: красного(R), синего(B) и зеленого(G).

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

· маска (mask) - это как бы трафарет, который можно наложить на изображение, в результате образуются видимые и невидимые части. Используя альфа-канал, можно создать полупрозрачные изображения с различной степенью прозрачности для различных участков изображения.

· слой (layer) - изображение в определенной цветовой модели, имеющий альфа-канал, который формирует слой-маску.

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

· палитра (palettes) - в данном понимании, дополнительные окна инструментов, которые предназначены для помощи в наблюдении над объектом и его изменении. Несколько палитр может быть собрано в группы палитр, тем самым убирается необходимость иметь множество активных окон на одном экране (все палитры в группе находятся в одном окне, а переключаться между ними можно выбрав соответствующую закладку в окне).

· скрипт (script) - набор команд, написанных на псевдо-языке программирования. Эти команды затем интерпретируются интерпретатором скрипта. Здесь используется понятие о JavaScript – стандартном скриптовом языке для сети Интернет.

Основные принципы работы.

 

Основная особенность Adobe ImageStyler (IS), которая отличает его от других графических редакторов, заключается в том, что каждый графический элемент является отдельным объектом, над которым могут совершаться определенные действия. Документ представляется не в виде точечного изображения, а как набор независимых объектов. IS физически не изменяет содержание объекта (имеется в виду изменение самого bitmap), а лишь совершает над ним набор действий, заданных свойствами объекта, для получения конечного изображения. В связи с этим каждый объект наделен рядом свойств (информацией об его изменениях) и любое из этих свойств может быть в любое время изменено. Это значит, что в IS нет необратимых действий, любое действие может быть отменено, либо все свойства могут быть удалены полностью для возвращения к первоначальному состоянию.

 

В IS существует три типа объектов:

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

· текстовые объекты - объекты, которые можно создать при помощи Type tool (рисование текста) или импортировать из другого документа.

· графические объекты - это bitmap изображения и векторные изображения формата EPS.

 

Каждый объект в IS имеет контур (shape), или, иными словами, маску.

Геометрические объекты имеют прямоугольный, многоугольный или эллипсоидный контур.

Текстовые объекты имеют контур, составленный из набора символов текста.

Bitmap изображения обычно имеют прямоугольный контур, либо могут использовать alpha channel или active

matte (см. описание палитры Properties).

EPS векторные изображения имеют тот контур, который им был задан в редакторе данного формата. Т.е., например, векторное изображение цветка будет иметь контур цветка.

Каждый объект составлен из слоев (от 1 до 5), причем каждый слой имеет контур основного объекта. В отличие от других программ, таких, как Adobe Photoshop или Adobe Illustrator, слои применяются для отдельных объектов, а не для всего документа сразу. После создания простого объекта, он имеет только один слой. Затем можно добавлять, удалять, перемещать и перегруппировывать слои в любое время. При рисовании объект строится, начиная с самого нижнего слоя.

Каждый слой в объекте имеет собственный набор атрибутов. Задавая различные атрибуты каждому из слоев можно создавать различные эффекты (например, тень)

При обсуждении набора инструментов для редактирования мы будем упоминать только термин объект, но надо помнить, что нас самом деле работа ведется над выбранным слоем в объекте.

 

Как только вы закончили работу с документом, его можно сохранить как документ ImageStyler, как отдельный графический документ (bitmap изображение), который затем можно поместить на web-страницу в Интернет, или в формате HTML как готовую web-страницу.

 

Открытие документа, создание нового и сохранение.

 

Для открытия документа нужно выбрать команду Open из меню File (File->Open), или нажать комбинацию клавиш CTRL+O. Перед нами возникнет окно, в котором будет предложено выбрать файл. Справа можно видеть активное окно предварительного просмотра, где будет отображаться уменьшенная версия документа. Для открытия документа нужно выбрать его из списка и нажать на кнопку Open.

 

 

Для создания нового документа нужно выбрать File->New. Перед нами сразу же окажется пустое окно, с которым можно начать работать. Можно изменить размеры документа, используя меню Edit->Canvas Size.

Для сохранения документа нужно выбрать File->Save или File->Save As, после чего появится окно, аналогичное окну открытия документа, где будет предложено ввести имя документа, под которым он будет сохранен на диске.

 

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

 

Каждый объект имеет описывающий его прямоугольник (рамка), который высвечивается при выборе объекта. Рамка имеет 8 квадратных точек - по углам и по середине с каждой стороны. Это управляющие точки. При помощи них можно изменять размеры объекта простым нажатием кнопки мышки и последующим перетаскиванием точки. Двигая боковые точки можно изменять один из размеров – вертикальный или горизонтальный. Двигая левую верхнюю, левую нижнюю или правую нижнюю угловые точки можно изменять размеры сразу по двум измерениям. Если при этом удерживать кнопку SHIFT, то соотношение размеров объекта останется неизменным (x/y=const), а будет меняться только масштаб. При нажатии на правую верхнюю точку можно вращать объект вокруг его оси.

 

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

 

Объекты находятся в документе в определенном порядке, отсортированные по "глубине". Т.е. если данный объект находится "ближе", то он будет перекрывать более дальние. "Приблизить" объект можно, нажав CTRL-], а "удалить" - CTRL-[.

 

Объекты можно копировать и вставлять. Для быстрого создания дубликата (копии) объекта, нужно его выделить и нажать CTRL-D (Edit->Duplicate).

Можно создать альясный (alias - связанный с данным) объект Alias объекты - это копии данных, но в отличие от обычных копий, все aliases связаны с оригиналом. При изменении оригинала изменяются и все связанные с ним объекты. Для создания Alias нужно выбрать объект и нажать CTRL-M (Edit->Make Alias). Связь можно в любой момент оборвать, выделив объект и выбрав Edit->Break Alias.

 

Объекты можно объединять в группы. Для этого необходимо выделить все объекты и нажать CTRL-G (Object->Group). Достоинство групп в том, что их группы объектов легче перемещать по документу. Группу можно в любой момент разбить обратно на объекты, если выбрать ее и нажать CTRL-U (Object->UnGroup).

 

Можно создать новый объект из нескольких имеющихся (соединить объекты). Для этого нужно выделить нужные объекты и воспользоваться командой из меню Object->Combine. Доступны несколько способов соединения:

· Unite - простое объединение.

· Unite with color - объединить, но сохранить информацию о цвете.

· Minus front - вычесть передний объект из заднего.

· Intersect - оставить только область пересечения объектов.

· Exclude - оставить не пересекающуюся область.

В любой момент можно снова вернуться к первоначальному состоянию, если выбрать Object->UnCombine.

 

Есть так же и несколько других операций, которые доступны через меню Object.

 

Работа с палитрами. Описание и примеры использования.

 

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

 

Начнем рассматривать палитры с самого верха (в порядке расположения в меню Window):

 

Пример №1

 

Для демонстрации возможностей этой группы создадим новый документ File->New. Выберем синий цвет, как основной, черный - как цвет фона и выберем инструмент Ellipce Tool. Нарисуем произвольный эллипс (рис.1). Откроем палитру Properties. В окне появился список свойств для объекта Ellipce. Изменим способ нарисовки с обычного заполнения (Fill) на контур (Outline) и зададим ширину (Width) 6 точек. (рис.2). Теперь откроем палитру Opacity и выберем метод Linear, угол наклона - 140 градусов (рис.3). Сделаем две копии (нажав CTRL-D два раза) и выберем для каждой из них отдельный цвет. Расположим получившиеся объекты друг возле друга. Получилось красивое радужное оформление для какой-нибудь надписи. (рис.4).

Пример №2

 

Создадим объемную надпись с мягкой тенью.

Откроем новый документ. Зададим основной цвет красным, а фон - белым. Выберем Type tool и создадим объект с текстом (рис.1). Откроем палитру 3d и выберем эффект Emboss (выпуклость), Light = 130, Edge = Plateau (возвышающиеся стороны) (рис.2). Теперь делаем тень. Тенью будет служить увеличенный и смещенный контур объекта. Создадим копию слоя и сделаем ее активной. Сделаем новый слой черного цвета (если он уже не черный). Откроем палитру Layer. Зададим Wid th=2 (относительное увеличение объекта), Softness=6 (размытие), XOffset=-4, YOffset=-4 (смещение слоя по горизонтали и вертикали). Объемная надпись с тенью готова (рис.3).

 

Пример №3

 

Теперь на основе полученных знаний о возможностях Adobe ImageStyler, создадим демонстрационную картинку:

Создадим новый документ. Сделаем фон активным, щелкнув на нижний квадрат на панели инструментов. Зададим для фона текстуру, для этого откроем палитру Textures и выберем нужную. Теперь вставим в документ картинку, для этого воспользуемся возможностью Windows Drag-and-drop, т.е. "перетащим" картинку из Windows Explorier в документ IS:

 Растянем картинку по вертикали так, чтобы она имела высоту 246 (это значение взято из дальнейшего расчета пропорции), а инструментом Crop урежем ее до ширины 240. Теперь надо присвоить картинке форму кляксы. Откроем палитры Properties (для нашего объекта) и Shapes. В свойствах выберем Alpha Channel = Active Matte (маска прозрачности на основе заданного контура). Наша картинка сразу приняла форму круга, т.к. по умолчанию установлен круглый контур. В маленьком окошке снизу видим черный круг – это и есть заданный контур. В палитре Shapes ищем контур с названием Blob 4 (переключить в моду показа с названиями можно нажав черную стрелку в левом верхнем углу и выбрав Names view). Затем перетаскиваем его в окошко в палитре Properties, в котором находится круг.

Теперь наша картинка имеет новую маску (см. образец в описании палитры Properties). Но картинка находится не совсем так, как хотелось бы. Используя Crop tool, выровняем положение картинки:

Создадим эффект объема, для этого зададим в 3d палитре эффект Emboss (выпуклый), Depth=13 (глубина), Softness=1 (размытие). Теперь немного исказим картинку, для этого откроем палитру Distort, зададим Spherize (сферическое искажение), Magnification=100 (увеличение), Amount=-83 (глубина):

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

Создадим второй слой и присвоим ему текстуру в виде шахматной доски. Откроем палитру Distort и зададим тип Twirl (закрутить), Turns=27 (количество оборотов), Band size=2 (размер сегмента). Чтобы сделать текстуру помягче, откроем палитру Opacity и зададим прозрачность слоя в 40%. Пока нашего клетчатого фона не видно, потому что передний слой непрозрачен. Сделаем активным первый слой и откроем палитру Opacity. Установим тип Linear (линейное изменение прозрачности), угол=13, правый ползунок Opacity Bar передвинем на середину.

Все, наша картинка готова.

 

Дополнительные возможности

 

IS позволяет создавать из сделанного документа готовые web-страницы для Internet.

Для этого необходимо создать страницу так, как бы вам хотелось её видеть, затем выбрать File->Export, File->Export As, или File->Export Selection и ввести в появившемся окне имя файла, в котором будет сохранен документ на диске. IS создаст готовый HTML файл и набор графических файлов, которые будут лежать на диске в директории Images. При генерации изображений, IS помещает все объекты, которые соприкасаются друг с другом, в один файл. Остальные же объекты записываются в отдельные файлы. Фоновое изображение так же записывается в отдельный файл.

 

Для Internet немаловажен размер графических файлов, по этому IS предоставляет возможность выбрать, в каком формате будут сохранены графические изображения и степень сжатия изображений (для JPEG формата). Эти установки можно сделать в палитре Export settings.

Она вызывается из меню File->Export Settings.

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

· Entrie Composition - весь документ рисуется как единая картинка и записывается в один графический файл.

· Trimmed Comp osition - из документа выбирается прямоугольный участок минимального размера, охватывающий все объекты, и затем он, аналогично предыдущей опции, записывается один графический файл.

· Auto Slice - картинки (объекты IS) помещаются в HTML документ в порядке следования из левого верхнего угла в правый нижний.

· Auto Layout - IS создает автоматически таблицу в HTML файле и размещает в ней графические объекты для того, чтобы готовый документ выглядел так, как было запланировано при его создании. Это наиболее предпочтительный вариант.

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

 

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

Существует три типа событий, по которым может произойти изменение картинки:

· onMouseOver - активизируется, когда курсор мыши находится непосредственно над объектом.

· onMouseDown - активизируется при нажатии на картинку.

· onMouseOut - активизируется, когда курсор мыши "уводят" с картинки.

По умолчанию каждый объект не имеет установленных событий (noAction в палитре JavaScript).

Можно добавлять, копировать и удалять события, используя три кнопки внизу палитры.

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

 

 

IS может автоматически "оформлять" уже созданные HTML документы, заменяя обычный текст картинками. Эта функция называется Batch Replace и доступна из меню File->Batch Replace HTML. Перед ее использованием, нужно создать заготовку. Для этого создается новый документ и в нем создается набор объектов (эти объекты должны быть текстовыми, и из этих объектов затем берется информация о стиле). Затем, используя палитру Web, каждому объекту задается тип данных, которые им будут заменены (список Replace). При создании HTML документа, каждому текстовый элемент в нем присваивается определенный тип (так же, как и в программе MS Word тексту можно присваивать тип заголовка, обычного текста и т.д.), т.е. заголовки и обычный текст имеют разные типы. Т.о., создав объект и указав ему в поле Replace тип, который был присвоен заголовку в HTML документе, можно заменить заголовок красиво оформленной надписью.

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

 

Список литературы

 

Adobe ImageStyler On-line help.

Product Guides: Batch Generation

Layers and attributes

Working with images

Другие примеры дизайна можно найти в Интернет по адресам

http://www.imagestyler.com       - сайт поддержки

http://codexorg.webjump.com   - сайт, созданный автором реферата.

Реферат по информатике на тему

Графический редактор

 

 

Ученика 11^A класса школы №9 города Гатчины

Уварова Дмитрия

 

Оглавление

 

· Введение

· Словарь

· Основные принципы работы

· Интерфейс программы. Запуск, выход и первое знакомство

· Открытие документа, создание нового и сохранение

· Обзор основной панели инструментов

· Работа с объектами

· Работа с палитрами. Описание и примеры использования

· Дополнительные возможности

· Список литературы

Введение

 

Программа Adobe ImageStyler, созданная известной фирмой Adobe Systems Incorporated, предназначена для создания графического дизайна web-страниц (т.е. вы просто “рисуете” web-страницу так, как вам хотелось бы её видеть) и просто для создания качественных иллюстраций. Объединение мощи ее родственника Adobe Photoshop и простоту использования делает ее необычайно полезной для продуктивной работы.

Здесь мы рассмотрим основные возможности программы, ее специфику, и в конце покажем пример использования Adobe ImageStyler.

 

Словарь

 

· bitmap - точечное изображение.

· цветовая модель - способ представления изображения, которое может видеть человеческий глаз, на основе заданных характеристик цвета. Мы будем рассматривать RGB модель, где каждый элемент изображения представлен в виде наборов трех составляющих: красного(R), синего(B) и зеленого(G).

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

· маска (mask) - это как бы трафарет, который можно наложить на изображение, в результате образуются видимые и невидимые части. Используя альфа-канал, можно создать полупрозрачные изображения с различной степенью прозрачности для различных участков изображения.

· слой (layer) - изображение в определенной цветовой модели, имеющий альфа-канал, который формирует слой-маску.

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

· палитра (palettes) - в данном понимании, дополнительные окна инструментов, которые предназначены для помощи в наблюдении над объектом и его изменении. Несколько палитр может быть собрано в группы палитр, тем самым убирается необходимость иметь множество активных окон на одном экране (все палитры в группе находятся в одном окне, а переключаться между ними можно выбрав соответствующую закладку в окне).

· скрипт (script) - набор команд, написанных на псевдо-языке программирования. Эти команды затем интерпретируются интерпретатором скрипта. Здесь используется понятие о JavaScript – стандартном скриптовом языке для сети Интернет.

Основные принципы работы.

 

Основная особенность Adobe ImageStyler (IS), которая отличает его от других графических редакторов, заключается в том, что каждый графический элемент является отдельным объектом, над которым могут совершаться определенные действия. Документ представляется не в виде точечного изображения, а как набор независимых объектов. IS физически не изменяет содержание объекта (имеется в виду изменение самого bitmap), а лишь совершает над ним набор действий, заданных свойствами объекта, для получения конечного изображения. В связи с этим каждый объект наделен рядом свойств (информацией об его изменениях) и любое из этих свойств может быть в любое время изменено. Это значит, что в IS нет необратимых действий, любое действие может быть отменено, либо все свойства могут быть удалены полностью для возвращения к первоначальному состоянию.

 

В IS существует три типа объектов:

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

· текстовые объекты - объекты, которые можно создать при помощи Type tool (рисование текста) или импортировать из другого документа.

· графические объекты - это bitmap изображения и векторные изображения формата EPS.

 

Каждый объект в IS имеет контур (shape), или, иными словами, маску.

Геометрические объекты имеют прямоугольный, многоугольный или эллипсоидный контур.

Текстовые объекты имеют контур, составленный из набора символов текста.

Bitmap изображения обычно имеют прямоугольный контур, либо могут использовать alpha channel или active

matte (см. описание палитры Properties).

EPS векторные изображения имеют тот контур, который им был задан в редакторе данного формата. Т.е., например, векторное изображение цветка будет иметь контур цветка.

Каждый объект составлен из слоев (от 1 до 5), причем каждый слой имеет контур основного объекта. В отличие от других программ, таких, как Adobe Photoshop или Adobe Illustrator, слои применяются для отдельных объектов, а не для всего документа сразу. После создания простого объекта, он имеет только один слой. Затем можно добавлять, удалять, перемещать и перегруппировывать слои в любое время. При рисовании объект строится, начиная с самого нижнего слоя.

Каждый слой в объекте имеет собственный набор атрибутов. Задавая различные атрибуты каждому из слоев можно создавать различные эффекты (например, тень)

При обсуждении набора инструментов для редактирования мы будем упоминать только термин объект, но надо помнить, что нас самом деле работа ведется над выбранным слоем в объекте.

 

Как только вы закончили работу с документом, его можно сохранить как документ ImageStyler, как отдельный графический документ (bitmap изображение), который затем можно поместить на web-страницу в Интернет, или в формате HTML как готовую web-страницу.