вторник, 28 февраля 2017 г.

Урок 32-33. Каналы. Сохранение выделенной области в канале



Дата проведения занятия 1.03.2017
По теории смотрим презентацию «Компьютерная графика и анимация». Часть II слайды со 2 по 14.

Многослойные изображения

Зачем нужны слои? Слои помогают человеку избежать необратимых изменений в сложном изображении. Каждый содержательный с точки зрения человека объект рисуется на отдельном слое (слайд 3).
Каждый слой можно изменять и перемещать независимо от других. Однако, если смотреть на топку слоев сверху, то увидим полный рисунок.
Для управления слоями предназначено диалоговое окно Слои.
Структура диалогового окна Слои (слайд 4).
Список Режим определяет, как текущий слой влияет на изображение, полученное с нижних слоев (слайд 5).
Операции со слоями (слайд 6).
Текстовый слой создается при использовании инструмента Текст (слайд 7). этот слой существует в векторном формате, но может быть преобразован в растровое изображение.
Маска слоя позволяет сделать часть изображения на слое невидимой или полупрозрачной, ничего не удаляя (слайд 8-9).

Каналы

Канал - инструмент, с помощью которого показывается совокупность точек изображения с одинаковым эффектом. Каждый канал имеет тот же размер, что и все изображение. Смысл этого понятия зависит от типа канала.
Например, в цветовой модели RGB значение канала R означает количество красного цвета, добавляемого к другим цветам пикселей. Здесь канал — совокупность точек указанного цвета в изображении.
Цветовые каналы применяются ко всему изображению, а не к отдельному слою. Есть основные каналы — красный, зеленый и синий. Можно создавать свои каналы. (слайды 11-13)
Маска выделения. При выделении вы видите "муравьиную дорожку", которая вычерчивает его контур, который разделяет выделение и маску (закрытую область). Маска — это канал в градациях серого, покрывающий изображение.
Для управления каналами используется окно Диалог каналов (слайд 11).
Выделенную область можно сохранить с помощью Диалога каналов (слайд 14).

Каналы используются в двух целях, поэтому диалог каналов разделён на две части: первая часть для цветовых каналов и вторая для масок выделения.


Практическая работа

вторник, 14 февраля 2017 г.

Урок 30-31. Работа со слоями

Дата проведения занятия 15.02.2017

Анимированные изображения


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

Подробнее про слои смотрим  презентацию К. Полякова, слайд 1-9  «Компьютерная графика и анимация». Часть II
Лучше всего познакомиться с понятием слоя на практике.

Практическая работа

вторник, 7 февраля 2017 г.

Урок 28-29. Цветовые модели. Работа с выделенными областями


Дата проведения занятия 8.02.2017
Мы видим предметы, потому, что они излучают или отражают свет.
Свет — электромагнитное излучение.
Цвет — характеризует действие излучения на глаз человека.
Лучи света, попадая на сетчатку глаза, производят ощущение цвета.
Излучаемый свет — свет, исходящий из источника (солнце, лампочка).
Отражаемый цвет — свет, отраженный от поверхности объекта.
Излучаемый свет, идущий непосредственно от источника, сохраняет в себе все цвета, из которых он создан.
Отражаемый свет может измениться по сравнению с излучаемым.
 Существует много различных типов цветовых моделей, но в компьютерной графике, как правило, применяется не более трех. Эти модели известны под названиями: RGB, CMYK и HSB.

1. Система аддитивных цветов - цветовая модель RGB наиболее проста для понимания и очевидна. В этой модели работают мониторы и бытовые телевизоры. Любой цвет считается состоящим из трех основных компонентов: красного (Red), зеленого (Green) и синего (Blue). Эти цвета называются основными.  Эти цвета смешиваются (складываются). Яркость каждой составляющей кодируется числом от 0 до 255.

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

В системе субтрактивных цветов основными являются голубой (Cyan), пурпурный (Magenta) и желтый (Yellow).

3. Модель HSB (V) - Тон — Насыщенность — Яркость»

Системы RGB и CMYK базируются на ограничениях, накладываемых аппаратным обеспечением (экрана монитора и типографскими красками). Более интуитивным способом описания цвета является его представление в виде оттенка цвета (Hue),  насыщенности (Saturation) и яркости (Brightness). Обозначение этой системы — HSB,

Тон — конкретный оттенок цвета — красный, желтый, зеленый и т.д.

Насыщенность  характеризует чистоту цвета: уменьшая насыщенность, мы разбавляем его белым цветом.


Яркость  зависит от количества черной краски, добавленной к выбранному цвету: чем меньше черноты, тем больше яркость.
Более полно  - Теория в документе. 


По теории смотрим в презентации «Компьютерная графика и анимация». Часть I слайды с 11 по 16 .

Работа с выделенными областями

Смотреть слайды 38 - 42 презентации «Компьютерная графика и анимация». Часть I

Инструменты выделения



Часто нужно работать с некоторой областью изображения, а пиксели вне этой области не должны меняться. Для выделения областей в редакторе GIMP предназначены несколько инструментов (слайды 39 - 40). 
Если в момент выделения области была нажата клавиши Shift, новая область добавляется к уже выделенной. Если в момент выделения области была нажата клавиша CTRL, новая область вычитается из  уже выделенной.
Таким образом можно строить сложные выделенные области.

Сглаживание и растушевка

Любой пиксель может быть выделен частично, например на 25. Это значит, что для такого пикселя эффект, примененный к области, будет ослаблен в 4 раза (слайд 41). 
Частичное выделение получается при использовании двух параметров  - сглаживания и растушевки
Эти параметры задаются в окне параметров выбранного инструмента выделения (слайд 42).

Практическое задание и Домашнее задание

вторник, 24 января 2017 г.

Урок 26-27. Изменение размеров изображения в Gimp

Дата проведения занятия 25.01.2017

Размеры изображения при просмотре

В презентации К. Полякова Презентация GIMP Ч.1 смотрим  слайды 2-10 
При выводе изображения  нужно указать  его размеры на экране монитора  или на бумаге. 
Связь между шириной и высотой изображения  в пикселях и его размерами в см или мм устанавливает разрешение, т.е. число пикселей на единицу размера изображения. Например, разрешение измеряется в пикселях на дюйм (ppi -  pixel per inch, 1 дюйм = 2,54 см примерно). Чем больше разрешение,  тем выше качество изображения, но тем больше места оно занимает в памяти. 
При выводе на экран изображение размером 10х15 см имеет следующие размеры в пикселях при разрешении 96 ppi:
высота: 10х96 / 2,54 = 378 пикселей 
ширина: 15х96 / 2,54 = 567 пикселей
Печатающие устройства могут обеспечить значительно большее разрешение, чем экран.
Для получения отпечатков среднего качества  требуется разрешение около 300 ppi. При этом размер изображения в пикселях:
высота: 10х300 / 2,54 = 1181 пикселей 
ширина: 15х300 / 2,54 = 1772 пикселей
В редаторе GIMP размер изображения на экране меняется в диалоговом окне Смена размера изображения. Чтобы попасть в это окно, щелкните правой клавишей по изображению и выберите: Изображение - Размер изображения
При этом для управления качеством преобразования используйте параметр Интерполяция
Размер изображения для печати меняется в  диалоговом окне Смена разрешения при печати. Чтобы попасть в это окно, щелкните правой клавишей по изображению и выберите: Изображение - Размер при печати.

Ввод изображений

Растровые изображения чаще всего вводятся с цифровых фотоаппаратов и сканера. 
В фотоаппарате фотографии сохраняются на встроенной карте памяти в форматах RAW  и JPEG. Для загрузки изображений с фотоаппарата в компьютер эти устройства соединяются  кабелем через порт USB. После подключения фотоаппарат появляется как новый съемный диск.
Сканировать изображение можно прямо из приложения GIMP (Меню - Файл - Создать (2) - Сканер). При этом рекомендуется параметр Разрешение установить несколько большим, чем потом предполагается  применять. Если изображение сканируется для вывода на экран (с разрешением 72 - 96 ppi), то для сканирования рекомендуется выбрать разрешение 150 - 200 ppi. 

Кадрирование

После сканирования полученное изображение обычно нужно выполнить  кадрирование, т.е. выбрать нужные границы и обрезать лишнее. Для кадрирования выбираем инструмент  Изображение - Автокадрирование или   Изображение - Усердное кадрирование. 

вторник, 17 января 2017 г.

Урок 24-25. Графические редакторы. Графический редактор Gimp

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

  • Что такое растровый редактор, для чего предназначен, с какими форматами работает
  • Примеры растровых изображений
  • Что такое векторный редактор, для чего предназначен, с какими форматами работает
  • Примеры векторных изображений
  • Сравнение двух типов редакторов. Достоинства и недостатки
А теперь создайте новое сообщение в своем блоге и поместите туда ответы на эти вопросы.
Не забудьте вставить ссылки на используемые интернет-ресурсы!
Название сообщения в блоге: Графические редакторы. 
Ярлык сообщения: ИКТ

вторник, 20 декабря 2016 г.

Урок 20-21. Ссылки на страницах сайта

Итак, мы добрались до объекта, который впервые появился именно на WEB-страницах с легкой руки  Тима Бернерс-Ли, а уж потом перекочевал в другие приложения, например, в презентации и текстовые документы. Речь идет о гиперссылках.
Гиперссылка — это часть электронного документа, которая ссылается на другой элемент самого документа или на другой объект (файл, каталог, приложение), расположенный на локальном диске или в компьютерной  сети. Посмотрите, как определяет гиперссылку наша любимая Википедия.
А вот что писал по поводу гипертекстовых документов А. А. Дуванов.
Обычный текст имеет линейную структуру. И хотя пользователь может читать любые его страницы и строчки, листая документ, автор предполагает, что текст читается по порядку. Сначала первая страница, потом вторая и так далее.
Некоторое нарушение линейности обычной книги вносят сноски, ссылки на другие страницы и ссылки на другую литературу.
Из массы линейной текстовой продукции выделяются словари, справочники, энциклопедии. Предполагается, что читатель обращается к такой книге для справки, а не читает ее всю подряд от корки до корки.
Возможности компьютера рождают принципиально новую идею: почему бы изначально не проектировать текст в расчете на возможность чтения не по-порядку, а по контексту. Такой подход позволяет разным пользователям просматривать текст, ориентируясь на свои вкусы, уровень владения темой и поставленные задачи.
Структура компьютерной книги становится существенно нелинейной, она даже перестает быть иерархической, а скорее напоминает спутанную рыболовную сеть или порцию спагетти, опрокинутую на пол.
Для навигации по такой сети предусматривается простой способ: те фрагменты документа, которые имеют переходы на другие его части, каким-то образом выделены. Простое интерфейсное действие на такой ссылке (нажатие на Enter или мышиный щелчок) перебрасывают пользователя в другой информационный узел.
Посмотрел, вернулся обратно, или, не возвращаясь, продолжил путешествие по новой ссылке.

Как отличить гиперссылку в тексте и воспользоваться ею? 

  • гипертекстовые ссылки среди других элементов текста выделяются цветом (практически всегда) и подчеркиванием (иногда); 
  • мышиный курсор на ссылке меняет свою форму и превращается в указующий перст (всегда!); 
  • для перехода по ссылке необходимо щелкнуть по ней мышкой; 
  • для возврата из ссылки можно использовать навигационную кнопку браузера Назад (Back). 
  • ссылка может быть внутренней (переход внутри данного документа)
  • ссылка может быть внешней (на объект вне данного документа)

Что может использоваться в качестве гиперссылки?

  • фрагмент текста
  • изображение

Практическая работа с сайтом


  1. При создании ссылки в поле Отображаемый текст помещается тот текст, который становится ссылкой. В поле Связать с Веб-адресом помещается адрес WEB-страницы или документа. Каждая внешняя ссылка должна открываться
    В НОВОМ ОКНЕ
  2. Перед тем, как нажать ОК, проверьте ссылку
  3. На страницах ВУЗы и Потенциальные работодатели необходимо сделать ссылки на страницы соответствующих сайтов. Ссылкой может быть название вуза (Работодателя) или изображение!
  4. На странице Ссылки необходимо привести ссылки на все сайты и документы, которые вы использовали при создании данного сайта. Возможно, какие-то ссылки уже встречались на ваших страницах - значит, их можно просто скопировать.
  5. Оформите страницу Ссылки как список
  6. Покажите работу учителю