Какие сложности у вас возникли? Как их можно преодолеть?
2. Постройте черно-белый рисунок шириной 8 пикселей, закодированный шестнадцатеричной последовательностью 2466FF6624 16 .
3. Постройте черно-белый рисунок шириной 5 пикселей, закодированный шестнадцатеричной последовательностью 3A53F88 16 .
4. Рисунок размером 10×15 см кодируется с разрешением 300 ppi. Оцените количество пикселей в этом рисунке. (Ответ: около 2 мегапикселей)
5. Постройте шестнадцатеричный код для цветов, имеющих RGB-коды (100,200,200), (30,50,200), (60,180, 20), (220, 150, 30). (Ответ: #64C8C8, #1E32C8, #3CB414, #DC961E)
6. Как бы вы назвали цвет, заданный на веб-странице в виде кода: #CCCCCC, #FFCCCC, #CCCCFF, #000066, #FF66FF, #CCFFFF, #992299, #999900, #99FF99? Найдите десятичные значения составляющих RGB- кода. (Ответ: (204,204,204), (255,204,204), (204,204,255), (0,0,102), (255.255,102), (104,255,255), (153,34,153), (153,153,0), (153,255,153))
7. Что такое глубина цвета? Как связаны глубина цвета и объем файла?
8. Какова глубина цвета, если в рисунке используется 65536 цветов? 256 цветов? 16 цветов? (Ответ: 16 бит; 8 бит; 4 бита)
9. Для желтого цвета найдите красную, зеленую и синюю составляющие при 12-битном кодировании. (Ответ: R=G=15, B=0)
10. Сколько места занимает палитра в файле, где используются 64 цвета? 128 цветов?
11. Сколько байт будет занимать код рисунка размером 40×50 пикселей в режиме истинного цвета? при кодировании с палитрой 256 цветов? при кодировании с палитрой 16 цветов? в черно-белом варианте (два цвета)? (Ответ: 6000, 2000, 1000, 250)
12. Сколько байт будет занимать код рисунка размером 80×100 пикселей в кодировании с глубиной цвета 12 бит на пиксель? (Ответ: 12000)
13. Для хранения растрового изображения размером 32×32 пикселя отвели 512 байтов памяти. Каково максимально возможное число цветов в палитре изображения? (Ответ: 16)
14. Для хранения растрового изображения размером 128 x 128 пикселей отвели 4 килобайта памяти. Каково максимально возможное число цветов в палитре изображения? (Ответ: 4)
15. В процессе преобразования растрового графического файла количество цветов уменьшилось с 1024 до 32. Во сколько раз уменьшился информационный объем файла? (Ответ: в 2 раза)
16. В процессе преобразования растрового графического файла количество цветов уменьшилось с 512 до 8. Во сколько раз уменьшился информационный объем файла?(Ответ: в 3 раза)
17. Разрешение экрана монитора – 1024 х 768 точек, глубина цвета – 16 бит. Каков необходимый объем видеопамяти для данного графического режима? (Ответ: 1,5 Мбайт)
18. После преобразования растрового 256-цветного графического файла в черно- белый формат (2 цвета) его размер уменьшился на 70 байт. Каков был размер исходного файла? (Ответ: 80 байт)
19. Сколько памяти нужно для хранения 64-цветного растрового графического изображения размером 32 на 128 точек? (Ответ: 3 Кбайта)
20. Какова ширина (в пикселях) прямоугольного 64-цветного неупакованного растрового изображения, занимающего на диске 1,5 Мбайт, если его высота вдвое меньше ширины? (Ответ: 2048)
21. Какова ширина (в пикселях) прямоугольного 16-цветного неупакованного растрового изображения, занимающего на диске 1 Мбайт, если его высота вдвое больше ширины? (Ответ: 1024)
Для начала давайте порассуждаем логически. Если вы делаете ресайз изображения, наверное вы хотите чтобы результат хотя бы отдаленно напоминал оригинал. Для этого нужно учесть как можно больше информации из исходного изображения. Вы слышали о методе «ближайшего соседа»? В этом методе для каждой точки конечного изображения просто берется какая-то одна точка из исходного изображения в неизменном виде.
Уменьшение изображения 4928×3280 до 256×170 ближайшим соседом.
Рекомендую смотреть примеры из статьи в браузере в масштабе 100% и без ретины. То есть по максимуму исключить ресайз при просмотре.
Результат не представляет ничего хорошего. Изображение дерганое, зернистое, даже трудно понять что на нем изображено. Особенно если на исходном изображении было много мелких деталей или оно само было зернистым. Почему так получается? Потому что в конечном изображении было учтено очень мало информации из исходного. Если условно отметить на исходном изображении те точки, которые попадают в конечное, получится вот такая сеточка:
Теперь визуально можно оценить, насколько мало информации об исходном изображении попадает в конечное. Согласитесь, маловероятно, что именно по этой сеточке будут располагаться пиксели, которые дадут хорошее представление об изображении на исходной картинке.
Совсем другой результат дает, например, ресайз с помощью сверток. В нем каждый пиксель исходного изображения вносит вклад в конечное, да еще и не раз. Поэтому изображение получается плавным, а при выборе хорошего фильтра, четким.
Уменьшение с 4928×3280 до 256×170 свертками с бикубическим фильтром.
Тем не менее у метода «ближайшего соседа» есть одно неоспоримое преимущество: он работает за константное время относительно размера исходного изображения. Это значит, что не важно, какое большое или маленькое было исходное изображение, время уменьшения до определенного размера будет одинаковым. Я буду приводить примеры на Питоне с библиотекой Pillow , но вы можете получить почти такой же результат с помощью любого языка и библиотек.
В реальности время не совсем константное, поскольку вмешиваются разные факторы вроде кэшей процессора и локальности данных, но даже для в 4 раза большего исходного изображения мы получили замедление лишь на 23%.
Скорость сверток же, напротив, линейно падает с увеличением исходного изображения.
Для в 4 раза большего исходного изображения время тоже возросло в 4 раза.
Некоторые приложения и библиотеки для работы с графикой пользуются такой хитростью: они как бы используют для ресайза те же фильтры, что и при ресайзе свертками (бывают, например, билинейный, бикубический и фильтр Ланцош), но при уменьшении изображения не увеличивают ядро фильтра адаптивно. В результате для построения любой точки конечного изображения используется только 4 пикселя исходного изображения при билинейном фильтре, при бикубическом - 16, с 3-лобным фильтром Ланцоша - 36. То есть время работы тоже получается константным относительно исходного размера.
Вот только такой подход работает для уменьшения примерно до 2 раз, а дальше результат мало чем отличается от «ближайшего соседа».
Из 4928×3280 в 256×170 с билинейным фильтром с фиксированным ядром.
И говоря «мало чем отличается от „ближайшего соседа“» я имею в виду не только то, что он такой же рваный и зернистый, я имею в виду, что он правда почти совпадает с результатом «ближайшего соседа». Откройте обе картинки в соседних вкладках браузера и попереключайте между ними, картинки почти совпадают. Может даже показаться, что где-то ошибка, что так быть не должно, потому что с фиксированным ядром интерполируется 4 пикселя, а не тупо берется первый попавшийся, и результат должен быть ближе к оригиналу. Но ошибки тут нет и вот почему:
Точки, которые будут интерполироваться при уменьшении до 20×13.
Это точки исходного изображения, по которым строится конечное. Их стало больше в 4 раза, но они расположены все в тех же местах, что и при методе ближайшего соседа. То есть скорее всего, мы не получим новой информации об изображении. Можно попытаться еще увеличить количество точек исходного изображения, участвующих в процессе, применив бикубический фильтр, но результат снова будет почти таким же и даже еще чуть-чуть более рваным , потому что в бикубическом фильтре крайние пиксели берутся с отрицательными коэффициентами.
Из 4928×3280 в 256×170 с бикубическим фильтром с фиксированным ядром.
Как не сложно догадаться, сложность и время выполнения при использовании фильтров с большим охватом значительно растет, в то время как конечное изображение почти не меняется. Все три следующие примера дают примерно одинаковую картинку, а вот время работы у них отличается до 20 раз.
Тут я симулировал ресайз с фиксированным ядром с помощью аффинных преобразований. Но некоторые приложения и библиотеки правда делают это: используют для уменьшения более дорогие фильтры, результат которых почти равен методу ближайшего соседа. Так делает OpenCV, так делают , так делают видеокарты при текстурировании без mip-уровней. Потому что хоть время и большее, но оно константное относительно разрешения исходного изображения. Ну а качество? Для качества есть свертки.
Вы наверное думаете, для чего я вообще вам это все рассказываю, всё же ясно: если нужна скорость - нужно брать «соседа» или фиксированное ядро, если качество - свертки. А дело в том, что, оказывается, уменьшение с фиксированным ядром можно исправить так, что его результат будет радикально лучше. Настолько лучше, что возможно, для ваших задач, этого окажется достаточно и не понадобятся свертки. Причем сложность не просто будет константой относительно размера исходного изображения, это будет та же самая константа , что и при использовании фиксированного ядра.
Результат ресайза 4928×3280 в 256×170 за константное время.
Как видите, результат этого алгоритма не идет ни в какое сравнение с разноцветной размазней, получающейся после «ближайшего соседа» или фиксированного ядра. Для примеров к этой статье я намеренно взял довольно большую картинку с мелкой сеткой, с большим количеством деталей (посмотрите на отражение в шлеме астронавта) и очень сильно её уменьшаю. Я сделал все возможное, чтобы на результате вылезло как можно больше артефактов, но алгоритм все равно справляется! Когда я первый раз узнал об этом методе от , подумал, что метод скорее всего дает лишь незначительное улучшение по сравнению с фиксированным ядром, ведь количество задействованных пикселей такое же. Но результат сильно превзошел мои ожидания.
Секрет в том, чтобы брать для обработки не точки, скучковавшиеся по 4 штуки, как при фиксированном ядре, а использовать равномерную сетку в 2 раза большего разрешения, чем должно получиться в итоге. И из неё уже интерполировать конечное изображение.
Точки, которые будут использоваться при уменьшении до 20×13.
Как видите, все еще берется довольно мало точек исходного изображения. Но из-за того, что они распределены равномерно, они более репрезентативные. А из-за того, что их ровно в 4 раза больше, они все вносят одинаковый вклад в конечное изображение.
А теперь самое интересное: для использования этого метода не нужно ничего программировать! Все что нужно у вас уже есть. Первым шагом можно сделать равномерную сетку пикселей в 2 раза большего разрешения методом «ближайшего соседа», а на втором шаге сжать её в 2 раза хоть фиксированным фильтром, хоть свертками, хоть бокс-фильтром (смотря что есть в вашей библиотеке). Единственное, для сверток я бы посоветовал брать фильтр Хэмминга или бикубический, но не билинейный.
Данное улучшение впечатляет, но можно не останавливаться на достигнутом. Кто сказал, что для построения нужно использоваться именно в 2 раза большее изображение? Почему бы не взять в 3 раза или 4 для лучшего качества. Правда невозможно будет использовать ресайз с фиксированным ядром для второго шага, потому что вылезут те же проблемы, от которых мы пытаемся избавиться. А вот свертки - пожалуйста. При этом время останется константным, просто константа будет побольше.
Ресайз из 4928×3280 в 256×170 используя 2x и 4x промежуточные изображения.
Возможно, на таком масштабе различия не сильно видны, но они достаточно сильные. Чтобы их заметить, посмотрите гифку с зумом:
Ну и время:
Как видно, вариант с 2x промежуточным изображением работает за время, примерно равное билинейному фильтру с фиксированным ядром, а вариант с 4x промежуточным изображением за время бикубического. Ну и вообще говоря, можно использовать не целое кол-во точек.
Возникает вопрос: если этот метод дает настолько лучшие результаты и работает со скоростью фиксированного ядра, зачем вообще использовать фиксированное ядро для уменьшения? У этого метода конечно есть область применимости - его лучше не использовать при уменьшении меньше чем в 2 раза . И это совпадает с границей применимости фиксированного ядра, которое лучше не использовать при уменьшении больше чем в 2 раза . Получается, комбинируя методы, возможно получить ресайз приемлемого качества за фиксированное время при любом масштабе.
В комментариях верно указывает, что этот метод правильно называть суперсемплингом. Суперсемплинг часто используется в играх для устранения алиасинга. По сути игровая сцена - это изображение бесконечного разрешения, потому что мы могли бы отрисовать её в любом разрешении. Для суперсемплинга сцена рисуется в большем разрешении чем нужно и несколько соседних пикселей усредняются в один. То есть аналогия полная. Но это не отменяет факта, что такой метод очень редко применяется в ПО несмотря на его достоинства.
И напоследок несколько примеров с другими изображениями. Слева направо:
1) фиксированное ядро, билинейный фильтр (то, что многие используют сейчас)
2) бикубические свертки в качестве эталона
3) суперсемплинг с 2x увеличением
4) суперсемплинг с 4x увеличением
Главное при просмотре помнить, что третье изображение генерируется ровно за такое же время, что и первое, а четвертое хоть и дольше в ≈3 раза, но тоже за константное время и часто до 20 раз быстрее, чем второе.
Уменьшенное в 15,625 раз.
Изображение 2448×3264 уменьшенное в 9,5625 раз.
Изображение 2000×2000 уменьшенное в 7,8125 раз.
Я по образованию программист, но по работе мне пришлось столкнуться с обработкой изображений. И тут для меня открылся удивительный и неизведанный мир цветовых пространств. Не думаю, что дизайнеры и фотографы узнают для себя что-то новое, но, возможно, кому-нибудь это знание окажется, как минимум полезно, а в лучшем случае интересно.
Основная задача цветовых моделей – сделать возможным задание цветов унифицированным образом. По сути цветовые модели задают определённые системы координат, которые позволяют однозначно определить цвет.
Наиболее популярными на сегодняшний день являются следующие цветовые модели: RGB (используется в основном в мониторах и камерах), CMY(K) (используется в полиграфии), HSI (широко используется в машинном зрении и дизайне). Существует множество других моделей. Например, CIE XYZ (стандартные модели), YCbCr и др. Далее дан краткий обзор этих цветовых моделей.
В модели RGB (от англ. red – красный, green – зелёный, blue – голубой) все цвета получаются путём смешения трёх базовых (красного, зелёного и синего) цветов в различных пропорциях. Доля каждого базового цвета в итоговом может восприниматься, как координата в соответствующем трёхмерном пространстве, поэтому данную модель часто называют цветовым кубом. На Рис. 1 представлена модель цветового куба.
Чаще всего модель строится так, чтобы куб был единичным. Точки, соответствующие базовым цветам, расположены в вершинах куба, лежащих на осях: красный – (1;0;0), зелёный – (0;1;0), синий – (0;0;1). При этом вторичные цвета (полученные смешением двух базовых) расположены в других вершинах куба: голубой - (0;1;1), пурпурный - (1;0;1) и жёлтый – (1;1;0). Чёрный и белые цвета расположены в начале координат (0;0;0) и наиболее удалённой от начала координат точке (1;1;1). Рис. показывает только вершины куба.
Цветные изображения в модели RGB строятся из трёх отдельных изображений-каналов. В Табл. показано разложение исходного изображения на цветовые каналы.
В модели RGB для каждой составляющей цвета отводится определённое количество бит, например, если для кодирования каждой составляющей отводить 1 байт, то с помощью этой модели можно закодировать 2^(3*8)≈16 млн. цветов. На практике такое кодирование избыточно, т.к. большинство людей не способно различить такое количество цветов. Часто ограничиваются т.н. режимом «High Color» в котором на кодирование каждой компоненты отводится 5 бит. В некоторых приложениях используют 16-битный режим в котором на кодирование R и B составляющих отводится по 5 бит, а на кодирование G составляющей 6 бит. Этот режим, во-первых, учитывает более высокую чувствительность человека к зелёному цвету, а во-вторых, позволяет более эффективно использовать особенности архитектуры ЭВМ. Количество бит, отводимых на кодирование одного пиксела называется глубиной цвета. В Табл. приведены примеры кодирования одного и того же изображения с разной глубиной цвета.
Например, бумага, покрытая жёлтым красителем не отражает синий свет, т.е. можно сказать, что жёлтый краситель вычитает из отражённого белого света синий. Аналогично голубой краситель вычитает из отражённого света красный, а пурпурный краситель вычитает зелёный. Именно поэтому данную модель принято называть субтрактивной. Алгоритм перевода из модели RGB в модель CMY очень прост:
При этом предполагается, что цвета RGB находятся в интервале . Легко заметить, что для получения чёрного цвета в модели CMY необходимо смешать голубой, пурпурный и жёлтый в равных пропорциях. Этот метод имеет два серьёзных недостатка: во-первых, полученный в результате смешения чёрный цвет будет выглядеть светлее «настоящего» чёрного, во-вторых, это приводит к существенным затратам красителя. Поэтому на практике модель СMY расширяют до модели CMYK, добавляя к трём цветам чёрный (англ. black).
Чаще всего люди оперируют следующими понятиями: цветовой тон, насыщенность и светлота. При этом, говоря о цветовом тоне, обычно имеют в виду именно цвет. Насыщенность показывает насколько описываемый цвет разбавлен белым (розовый, например, это смесь красного и белого). Понятие светлоты наиболее сложно для описания, и с некоторыми допущениями под светлотой можно понимать интенсивность света.
Если рассмотреть проекцию RGB-куба в направлении диагонали белый-чёрный, то получится шестиугольник:
Все серые цвета (лежащие на диагонали куба) при этом проецируются в центральную точку. Чтобы с помощью этой модели можно было закодировать все цвета, доступные в RGB-модели, необходимо добавить вертикальную ось светлоты (или интенсивности) (I). В итоге получается шестигранный конус:
При этом тон (H) задаётся углом относительно оси красного цвета, насыщенность (S) характеризует чистоту цвета (1 означает совершенно чистый цвет, а 0 соответствует оттенку серого). Важно понимать, что тон и насыщенность не определены при нулевой интенсивности.
Алгоритм перевода из RGB в HSI можно выполнить, воспользовавшись следующими формулами:
Цветовая модель HSI очень популярна среди дизайнеров и художников, т.к. в этой системе обеспечивается непосредственный контроль тона, насыщенности и яркости. Эти же свойства делают эту модель очень популярной в системах машинного зрения. В Табл. показано изменение изображения при увеличении и уменьшении интенсивности, тона (выполняется поворот на ±50°) и насыщенности.
При описании цвета значения X,Y,Z называют стандартными основными возбуждениями, а полученные на их основе координаты – стандартными цветовыми координатами. Стандартные кривые сложения X(λ),Y(λ),Z(λ) (см. Рис.) описывают чувствительность среднестатистического наблюдателя к стандартным возбуждениям:
Помимо стандартных цветовых координат часто используют понятие относительных цветовых координат, которые можно вычислить по следующим формулам:
Легко заметить, что x+y+z=1, а это значит, что для однозначного задания относительных координат достаточно любой пары значений, а соответствующее цветовое пространство может быть представлено в виде двумерного графика:
Множество цветов, задаваемое таким способом, называют треугольником CIE.
Легко заметить, что треугольник CIE описывает только цветовой тон, но никак не описывает яркость. Для описания яркости вводят дополнительную ось, проходящую через точку с координатами (1/3;1/3) (т.н. точку белого). В результате получают цветовое тело CIE (см. Рис.):
Это тело содержит все цвета, видимые среднестатистическим наблюдателем. Основным недостатком этой системы является то, что используя её, мы можем констатировать только совпадение или различие двух цветов, но расстояние между двумя точками этого цветового пространства не соответствует зрительному восприятию различия цветов.
В системе CIE L*a*b координата L означает светлоту (в диапазоне от 0 до 100), а координаты a,b – означают позицию между зелёным-пурпурным, и синим-жёлтым цветами. Формулы для перевода координат из CIE XYZ в CIE L*a*b* приведены ниже:
где (Xn,Yn,Zn) – координаты точки белого в пространстве CIE XYZ, а
На Рис. представлены срезы цветового тела CIE L*a*b* для двух значений светлоты:
По сравнению с системой CIE XYZ Евклидово расстояние (√((L1-L2)^2+(a1^*-a2^*)^2+(b1^*-b2^*)^2)) в системе CIE L*a*b* значительно лучше соответствует цветовому различию, воспринимаемому человеком, тем не менее, стандартной формулой цветового различия является чрезвычайно сложная CIEDE2000.
Популярность этих цветовых систем обусловлена в первую очередь появлением цветного телевидения. Т.к. компонента Y по сути содержит исходное изображение в градациях серого, сигнал в системе YIQ мог быть принят и корректно отображён как на старых чёрно-белых телевизорах, так и на новых цветных.
Вторым, возможно более важным плюсом, этих пространств является разделение информации о цвете и яркости изображения. Дело в том, что человеческий глаз весьма чувствителен к изменению яркости, и значительно менее чувствителен к изменению цветности. Это позволяет передавать и хранить информацию о цветности с пониженной глубиной. Именно на этой особенности человеческого глаза построены самые популярные на сегодняшний день алгоритмы сжатия изображений (в т.ч. jpeg). Для перевода из пространства RGB в YIQ можно воспользоваться следующими формулами:
Цели урока:
Образовательная:
Развивающая:
Воспитательная:
Задачи урока:
Тип урока: изучение нового материала.
Оборудование: ПК, программное обеспечение – графический редактор Paint, проектор, экран, карточки с вопросами, карточки с алгоритмом выполнения практической работы, буклеты.
Формы: коллективная, групповая.
Виды работы: беседа, работа с раздаточным материалом, работа за ПК.
Этапы урока:
– Здравствуйте, ребята, садитесь. Итак, мы начинаем урок. Скажите, чем мы с вами занимались на прошлом уроке?
– На прошлом уроке мы познакомились с графическим редактором Paint. Рисовали рисунки, используя объекты, расположенные на панели инструментов.
– Да, верно. Но оказывается, что над рисунком можно выполнять какие-либо действия. Подумайте и скажите, какие действия можно выполнять над рисунком?
– Рисунок можно копировать, вставлять, изменять размеры рисунка, т.е. увеличивать или уменьшать.
– Правильно. Но вы назвали лишь часть действий, которые можно производить над рисунком. Еще рисунок можно поворачивать, наклонять, отражать. А каким одним словом можно назвать эти действия?
– Все эти действия можно назвать словом преобразование.
– Да, верно. А теперь, из всего сказанного, попробуйте сами сформулировать тему нашего урока.
– Тема нашего урока “Преобразования рисунка”.
– Да, тема нашего урока "Графический редактор Paint: преобразование рисунка". Сегодня на уроке мы с вами научимся преобразовывать рисунки, т.е. изменять размеры рисунка, копировать, поворачивать, наклонять. Затем вы выполните небольшую практическую работу. Но сначала мы с вами вспомним материал, изученный на прошлом уроке.
1. Фронтальный опрос.
2. Работа с раздаточным материалом.
Работа в парах на карточках.
1. Закончите предложение: Графический редактор – это … А) устройство для создания и редактирования рисунков; Б) программа для создания и редактирования рисунков; В) программа для создания и редактирования текстовых документов; Г) устройство для печати рисунков на бумаге. 2. Подпишите кнопки панели инструментов: 3. Определить, что получиться в результате выполнения следующих действий:
|
1. Повторяющие элементы (команда Правка – Копировать)
– Ребята, посмотрите, пожалуйста, на экран. Что вы видите? <Приложение 1 >
– Веточки различных растений: рябина, виноград и т.д .
– Да, правильно. На экране изображены веточки растений. А теперь подумайте и скажите, что есть общего у всех этих веточек?
– Каждая веточка состоит из каких-то повторяющихся деталей: листьев, ягод .
– Верно. А где еще можно встретить повторяющиеся элементы?
– Различные геометрические построения, сооружения .
– Таким образом, можно сделать вывод, что повторяющиеся элементы можно увидеть не только в геометрических построениях, но и в окружающем нас мире. Посмотрите вокруг себя. Листья на деревьях, ягоды, плоды – все это повторения, созданные природой. Жилые дома, автомобили, созданные человеком, при всем их многообразии также имеют повторяющиеся элементы. (Демонстрация слайдов с изображениями ягод, плодов, деревьев и т.д.). А в творчестве мы можем встретить повторяющиеся объекты?
– В рисунках, изображениях .
– Верно. Повторяющийся фрагмент может стать основой художественной композиции. Давайте рассмотрим веточку рябины. (Демонстрация слайда с изображением веточки рябины). Чтобы нарисовать ее, нужно сделать заготовку только одной ягоды, а затем составить из копий гроздь. Листья также получены из одного маленького листа. Но как расположить листья в разных направлениях? Они должны быть одинаковы, но ведь абсолютно одинаковые объекты нарисовать невозможно. А в данном случае, они должны быть не только одинаковыми, но и их нужно расположить симметрично относительно ветки. Оказывается, выделенный фрагмент можно повернуть или создать его зеркальное отражение (Отразить) . Эти возможности обеспечиваются специальной командой Отразить – Повернуть из меню Рисунок . На рисунке показаны листья, полученные из одного листа с помощью команд отражения и поворота. При выборе этой команды появляется окно диалога. (Показать слайд с изображением данного диалогового окна). Посмотрите, как выполняются эти команды на рисунке. (Следующий слайд – “примеры выполнения команд отражения и поворота”).
Давайте запишем в своих тетрадях тему урока, которую вы сами сформулировали: “Графический редактор Paint: преобразование рисунка”.
Вспомните, где в повседневной жизни можно увидеть отражение слева направо, сверху вниз? Придумайте примеры использования команды Отразить – Повернуть в рисунках. И запишите по одному примеру в свою тетрадь.
– Ребята записывают в тетрадь, затем проверяем .
В графическом редакторе Paint можно отражать фрагмент рисунка относительно вертикальной или горизонтальной оси симметрии выделяющего прямоугольника. Для этого выделяем рисунок и выполняем команду Рисунок – Отражение и поворот. Появится окно данного вида: <Рисунок 1 >
В этом окне мы выбираем действие, которое необходимо произвести над рисунком: отразить слева направо, отразить сверху вниз или повернуть на угол. Посмотрите на экран и скажите, какие изменения произошли с котятами? <Рисунок 2 >, <Рисунок 3 >
– На первом рисунки над снеговиками выполнили преобразование: отражение слева направо. На втором – отражение сверху вниз.
– Да, верно. Еще одно преобразование – это поворот. Поворот фрагмента относительно центра симметрии выделяющего прямоугольника можно выполнить в окне Отражение и поворот, которое вызывается из меню Рисунок. Выбираем команду: Повернуть на угол. Далее из предложенных углов выбираем нужный нам угол. <Рисунок 4 >
2. Великаны и карлики (команды Растяжение и сжатие)
– Мы с вами познакомились только с одним преобразованием рисунка: отражением и поворотом. Но существуют еще и другие. Как вы думаете, какие?
– Рисунок можно наклонять, увеличивать или уменьшать, т.е. изменять размеры рисунка.
– Да, именно эти преобразования и можно выполнять над рисунком. Я сейчас вам прочитаю небольшой отрывок, а вы мне скажите, о каком преобразовании идет речь. Итак, внимательно слушаем: "Над крышами летали мухи величиной со слона. Лошадей держали в домах вместо собачек. В лесу росли гигантские травы, а березы и осины зеленели на подоконниках. Дети в этой стране рождались большими, как великаны. С возрастом они уменьшались в размерах, пока не исчезали вовсе… Так фантазировал один мальчик".
– Здесь речь идет об изменениях размеров рисунка. Об увеличении и уменьшении.
– Конечно, в данном отрывке одни объекты у нас имели очень большие размеры, другие – маленькие. Оказывается, в графическом редакторе можно легко растянуть или сжать выделенный фрагмент, т.е. изменить размеры рисунка: увеличить или уменьшить. <Рисунок 5 >
В данном случае, мы уменьшили снеговика в 2 раза. Для этого сначала нужно выделить снеговика, затем выполнить команду Рисунок – Растяжение и наклон. Появилась окно следующего вида: <Рисунок 6 >
Для уменьшения рисунка в 2 раза указываем значения 50 по горизонтали и вертикали.
Менять размеры выделенного фрагмента можно не только из меню Рисунок. Можно делать это, потягивая мышкой за маркеры размеров, которые располагаются на границе выделенной области. Иногда так бывает удобнее, но изменение размеров выполняется “на глаз”. Когда нужна точность, без меню не обойтись.
3. Наклон, отражение, поворот.
В окошке Растяжение и наклон , которое вызывается из меню Рисунок , можно задать в градусах наклоны выделенного фрагмента: <Рисунок 7 >
При выполнении данной команды наш котенок немного наклонится: <Рисунок 8 >
4. Физкультминутка.
Чтоб здоровья нам набраться –
Надо спортом заниматься.
Чтобы сильными расти –
На зарядку – раз, два, три.
Руки на пояс, ноги шире…
Наклоны вперед – Раз, два, три, четыре.
Ноги вместе, руки вниз,
Прыгай на месте и садись.
– Сейчас вы выполните небольшую практическую работу. На партах у вас лежат карточки с алгоритмом выполнения практической работы. Но перед тем как вы сядете за компьютеры, давайте повторим с вами правила техники безопасности.
– Ребята перечисляют правила техники безопасности в компьютерном классе по цепочке.
– Правила техники безопасности вы вспомнили. А теперь потихонечку присаживаемся за компьютеры и начинаем выполнять работу. У кого возникают вопросы, поднимаем руку и я подойду.
Практическая работа
|
1. В графическом редакторе Paint нарисуйте произвольный рисунок. И выполните над ним все преобразования, которые мы сегодня изучили.
2*. Нарисовать гроздь винограда, используя команды Копировать – Вставить и Отразить – Повернуть . Написать в тетрадь алгоритм выполнения данной работы.
Наш урок подошел к концу. И мне бы очень хотелось узнать ваше мнение о проделанной работе. Естественно, что если я буду выслушивать мнение каждого, то нам не хватит времени, ведь до конца урока осталось совсем немного. Но мы сегодня выполняли практическую работу и поэтому оценку должен получить каждый ученик, ведь все вы старались и работали. Я предлагаю оценить себя самостоятельно и для этого использовать смайлики.
Смайлик – это картинка, составленная из букв и специальных знаков, которая выражает какое-то чувство или настроение.
На экране слайд с изображением смайликов:
