Добавить материал и получить бесплатное свидетельство о публикации в СМИ
Эл. №ФС77-60625 от 20.01.2015
Инфоурок / Информатика / Рабочие программы / "Подготовка цифровых изображений для Web-сайтов"

"Подготовка цифровых изображений для Web-сайтов"



57 вебинаров для учителей на разные темы
ПЕРЕЙТИ к бесплатному просмотру
(заказ свидетельства о просмотре - только до 11 декабря)


  • Информатика

Поделитесь материалом с коллегами:


Курс «Подготовка цифровых изображений для Web-сайтов»



ПОЯСНИТЕЛЬНАЯ ЗАПИСКА




Цели курса:

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

  • развивать творческие и дизайнерские способности обучающихся.

Место и роль учебного курса

Курс имеет выраженную практическую направленность, которая и определяет логику построения материала учебных занятий. Предлагаемый подход можно сформулировать как «от задачи – к теории». Инструменты и средства программ Photoshop и Image Ready изучаются не изолированно, сами по себе, а в контексте практических задач, возникающих при обработке цифровых изображений для Web-сайтов.

Основной формой обучения является практикум. Для нормальной работы необходим персональный компьютер (один на каждого ученика), графический редактор Adobe Photoshop и: Corel Draw .

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

Планируемые результаты

В рамках данного курса обучающихся получают следующие знания и умения:

  • знакомятся с форматами растровых изображений, применяемых в сети Интернет (GIF, JPG, PNG)

  • умеют вводить графические изображения с помощью цифрового фотоаппарата и сканера

  • умеют грамотно выбирать формат, разрешение и степень сжатия в зависимости от свойств изображения

  • умеют применять средства коррекции программы Photoshop

  • умеют создавать анимационные ролики и баннеры с помощью программы Image Ready

СОДЕРЖАНИЕ ИЗУЧАЕМОГО КУРСА

Растровые и векторные изображения (1 ч )

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


Форматы изображений в Интернете (1 ч )

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


Графический редактор COREL DRAW ( 14 ч )

Программный комплекс CorelDRAW. Рабочее окно программы CorelDRAW. Рабочие инструменты CorelDRAW. Панель графики. Палитра цветов. Строка состояния. Рабочее окно программы CorelDRAW. Разнообразные методы закраски. Использование заливок из нескольких цветовых переходов, а также узоров и текстур. Операции над объектами: перемещение, масштабирование (изменение размеров), вращение, копирование, зеркальное отражение, удаление и др. Создание и редактировании кривой. Типы узлов: симметрические узлы, сглаженные узлы, острые узлы. Преобразование прямых в кривые и наоборот, добавление узлов, удаление узлов, масштабирование траектории, вращение траектории, разрыв кривой, объединение двух открытых траектории в одну. Окружность, дуга, сектор. Операции над объектами: перемещение, искажение, поворот, закрашивание. Сохранение рисунков. Создание логотипа по образцу. Средства работы с текстом. Надписи и заголовки. Изменение формы отдельных букв текста, масштабирование и перемещение.

Графический редактор Photoshop (11 ч)

Статические изображения. Цифровые фотоаппараты. Сканирование. Коррекция изображения. Сохранение изображений для Интернета. Изображения с прозрачными областями. Назначение редактора. Информация о документе. Панели инструментов. Изменение разрешения изображения. Просмотр изображения. Масштаб. 100%-ный размер изображения. Использование инструментов рисования прямых линий и линий произвольной формы. Использование градиентной заливки. Палитра слоев. Фильтры. Дизайн надписи. Эффект линзы. Свет , тень, цвета и перспектива. Освещение, прозрачность, перспектива и глубина. Анимированные изображения. Анимация по слоям. Ручная настройка анимации. Реакция на события мыши. Баннеры.

Выполнение проекта (7 ч )

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

  • личная страница

  • сайт фирмы

  • портал

  • информационный сайт

В качестве исходных материалов могут использоваться

  • снимки, сделанные цифровым фотоаппаратом

  • отсканированные фотографии

  • иллюстрации, полученные с помощью сети Интернет

  • рисунки, выполненные вручную

Обязательные элементы страницы (должны быть выполнены автором самостоятельно)

  • логотип

  • фотография (возможно, с художественной обработкой)

  • главное меню, реагирующее на наведение мыши

  • рекламный баннер

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

2.Содержание учебного предмета

Наименование разделов и тем

Количество часов

1

Растровые и векторные изображения

1

2

Форматы изображений в ИНТЕРНЕТЕ

1

3

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

16

4

Что такое COREL DRAW

1

5

Понятия окна и страницы

1

6

Масштаб.

1

7

Прямая, кривая и ломанная линия

1

8

Рисуем домик

1

9

Кривая Безье. Рисуем каплю.

1

10

Окружность, дуга, сектор. Мультяшная гусеница. Виноград.

1

11

Перемещение, искажение, поворот, закрашивание. Сохранение рисунков.

1

12

Создание логотипа по образцу.

1

13

Размещение надписи по кругу. Текст. Искривление надписи. Стильная и готическая надпись.

1

14

Ночное свечение. Создание макетов.

1

15

Макет в макете.

1

16

Зачетная работа.

4

17

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

11

18

Назначение редактора Adobe Photoshop. Панели инструментов.

1

19

Перемещение или движение объекта или изображения.

1

20

Распылитель краски. Рисование кистью. Рисование линий. Градиент.

1

21

Смазывание границ изображения. Увеличение яркости.

1

22

Работа со слоями. Задание: Монограмма

1

23

Фотомонтаж.

1

24

Работа с текстом. Фильтры.

1

25

Эффект линзы.

1

26

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

1

27

Создание анимации в программе Image Ready.

4

28

Баннеры.

1

29

Выполнение проекта

4

30

Сдача проектов.

1


ИТОГО

36

3.КАЛЕНДАРНО − ТЕМАТИЧЕСКОЕ ПЛАНИРОВАНИЕ


Календарные сроки

Наименование тем и разделов

Количество

часов

Содержание по темам

Виды деятельности обучающихся

1

02.09

Растровые и векторные изображения

1

Изучаются методы кодирования графической информации в растровых и векторных форматах.

Занятие проходит в виде лекции с использованием мультимедийного проектора.

2

9.09

Форматы изображений в ИНТЕРНЕТЕ

1

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

Занятие проходит в виде лекции с использованием мультимедийного проектора.

3

16.09

Что такое COREL DRAW

1

Программный комплекс CorelDRAW. Рабочее окно программы CorelDRAW. Рабочие инструменты CorelDRAW. Панель графики. Палитра цветов.

Знакомство с рабочими инструментами CorelDRAW: геометрические фигуры — прямоугольники, эллипсы, многоугольники и прямые. Использование залипвок. Знакомство с панелью графики.

4

23.09

Понятия окна и страницы

1

Строка состояния. Рабочее окно программы CorelDRAW. Разнообразные методы закраски. Использование заливок из нескольких цветовых переходов, а также узоров и текстур.

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

5

30.09

Масштаб.

1

Операции над объектами: перемещение, масштабирование (изменение размеров), вращение, копирование, зеркальное отражение, удаление и др.

Создание рисунков в векторной программе. Реализация операций – масштабирования (изменение размеров), вращения, копирования, зеркального отражения, удаления и др.

6

7.10

Прямая, кривая и ломанная линия

1

 Создание и редактировании кривой. Типы узлов: симметрические узлы, сглаженные узлы, острые узлы. Преобразование прямых в кривые и наоборот, добавление узлов, удаление узлов, масштабирование траектории, вращение траектории, разрыв кривой, объединение двух открытых траектории в одну.

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

7

14.10

Рисуем домик

1

 Создание и редактировании ломанной. Типы узлов: симметрические узлы, сглаженные узлы, острые узлы. Преобразование прямых в кривые и наоборот, добавление узлов, удаление узлов, масштабирование траектории, вращение траектории, разрыв кривой, объединение двух открытых траектории в одну.

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

8

21.10

Кривая Безье. Рисуем каплю.

1

 Создание и редактировании кривой. Типы узлов: симметрические узлы, сглаженные узлы, острые узлы. Преобразование прямых в кривые и наоборот, добавление узлов, удаление узлов

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

9

28.10

Окружность, дуга, сектор. Мультяшная гусеница.

Виноград.

1

Окружность, дуга, сектор. Мультяшная гусеница. Виноград. Яблоко

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

10

11.11

Перемещение, искажение, поворот, закрашивание. Сохранение рисунков.

1

Операции над объектами: перемещение, искажение, поворот, закрашивание. Сохранение рисунков.

Сhello_html_4832145f.jpgоздание рисунка пустыни.

11

18.11

Создание логотипа по образцу.

1

Создание логотипа по образцу.

Рисование знака радиации в Corel Draw. Рисование простого объекта в Corel Draw на примере логотипа Тойоты.

12

25.11

Размещение надписи по кругу. Текст. Искривление надписи. Стильная и готическая надпись.

1

Средства работы с текстом. Надписи и заголовки. Изменение формы отдельных букв текста, масштабирование и перемещение.

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

13

02.12

Ночное свечение. Создание макетов.

1

Операции над объектами: перемещение, искажение, поворот, закрашивание. Сохранение рисунков.

hello_html_4141d067.jpg Ночное свечение. Создание макетов.

14

9.12

Макет в макете.

1

Операции над объектами: перемещение, искажение, поворот, закрашивание. Сохранение рисунков.

Сохранение рисунков.

15

16.12

Зачетная работа:

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

1

Операции над объектами: перемещение, искажение, поворот, закрашивание. Сохранение рисунков.

Сохранение рисунков.

16

23.12

Зачетная работа:

Стенгазета

1

Операции над объектами: перемещение, искажение, поворот, закрашивание. Сохранение рисунков.

Сохранение рисунков.

17

30.12

Назначение редактора Adobe Photoshop. Панели инструментов.

1

Назначение редактора. Информация о документе. Панели инструментов. Изменение разрешения изображения.

Запустить программу Adobe Photoshop. Выбор инструментов. Работа с панелями-вспомогательными окнами.

18

13.01

Перемещение или движение объекта или изображения.

1

Просмотр изображения. Масштаб. 100%-ный размер изображения.

Увеличить масштаб просмотра изображения. Увеличить масштаб просмотра фрагмента изображения. Уменьшить масштаб просмотра изображения. Переместить изображение в пределах окна.

19

20.01

Распылитель краски. Рисование кистью. Рисование линий. Градиент.

1

Использование инструментов рисования прямых линий и линий произвольной формы. Использование градиентной заливки.

Инструменты рисования в Photoshop — «кисти» различного вида, «карандаш», «ластик», заливки.

20

27.01

Смазывание границ изображения. Увеличение яркости.

1

Увеличение резкости и размытие изображений. Смазывание границ изображения.

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

21

03.02

Работа со слоями. Задание: Монограмма

1

Палитра слоев.

Разделение изображения на слои. Создание нового слоя. Порядок слоев. Связь и копирование слоев.

.22

10.02

Фотомонтаж.

1

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

Цветовая коррекция, изменение цветовых оттенков фотографий.

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

23

17.02

Работа с текстом. Фильтры.

1

Фильтры. Дизайн надписи.

Создание эффекта текста из снега, каменно-огненный текст, каменный текст, карандашный эскиз надписи и др

24

24.02

Эффект линзы.

1

Эффект линзы.

Имитация эффекта широкоугольной линзы средствами Photoshop

25

03.03

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

1

Свет , тень, цвета и перспектива.

Создание пейзажа с рассветом. С использованием различной техники: свет, тень, цвета и перспектива.

26

10.03

Создание анимации в программе Image Ready.

1

Освещение, прозрачность, перспектива и глубина.

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

27

17.03

Создание анимации в программе Image Ready.

1

Освещение, прозрачность, перспектива и глубина.

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

28

31.03

Создание анимации в программе Image Ready.

1

Освещение, прозрачность, перспектива и глубина.

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

29

7.04

Создание анимации в программе Image Ready.

1

Освещение, прозрачность, перспектива и глубина.

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

30

14.04

Баннеры.

1

Наложение градиента,  смешивание, умножение. Временная шкала.

Создаём анимированный баннер в Фотошоп.

31

21.04

Выполнение проекта

1

Фильтры. Дизайн надписи.

Свет , тень, цвета и перспектива.

Освещение, прозрачность, перспектива и глубина.

Наложение градиента,  смешивание, умножение. Временная шкала. Палитра слоев. Увеличение резкости и размытие изображений. Смазывание границ изображения.

Создание рисунка с использованием различных средств Adobe Photoshop. Разработка стартовой страницы Web-сайта выбранной тематики с использованием статических и анимированных изображений.

32

28.04

Выполнение проекта

1

33

5.05

Выполнение проекта

1

34

12.05

Выполнение проекта

1

35

19.0

Выполнение проекта

1

36

26.05

Сдача проекта

1


Обсуждение всех выполненных проектов на конференции.



4. Материально-техническое обеспечение образовательного процесса


Печатные пособия

  1. Шерри Х. Photoshop для Web-дизайна. – Минск: Кудиц-Образ, 2006.

  2. Печников В. Н. Adobe Photoshop для Web. – Минск: Лучшие книги, 2005.

  3. Вайнман Л., Стейплз Т. Практикум по Adobe Photoshop CS и ImageReady CS для Web-дизайна (с CD-ROM). – Вильямс, 2005.

  4. Кубарева М.В., Третьяк Т.М. Практикум Web-дизайна (с CD-ROM). – М.: Солон-пресс, 2006.

  5. Смирнова И. Начала Web-дизайна (с CD-ROM). СПб: BHV-Питер, 2003.

  6. Ульрих Л. Photoshop 7 для Web-дизайна. – Минск: Кудиц-Образ, 2002.

  7. Белобородова Е., Солоницын Ю. Photoshop 7 для подготовки Web-графики. Учебный курс. – СПб: Питер, 2002.

Дополнительная литература

  1. Левковец Л. Б. Уроки компьютерной графики. Photoshop CS. – СПб: Питер, 2004.

  2. Пономаренко С.И. Adobe PhotoShop CS. — СПб.: БХВ-Петербург, 2004.

  3. Карасева Э. В., Чумаченко И. Н. Photoshop CS. — М.: НТ Пресс, 2004.

  4. Леонтьев В. П. Adobe Photoshop - ваша цифровая фотостудия. – СПб: ОЛМА-Пресс, 2005.

  5. Бурлаков М. Photoshop CS2 для пользователя. – М.: Бином, 2006.

  6. Залогова Л.А. Компьютерная графика. Элективный курс. Учебное пособие. – М.: "Бином", 2005.

  7. Леготина С. Графический редактор Photoshop. Элективный курс по информатике. 9-11 классы. 1 и 2 части. – Корифей, 2005.

Литература для школьников

  1. Поляков К.Ю. Уроки по Adobe Photoshop CS2. Электронное учебное пособие, 2005.

  2. Луций С.A. Изучаем Photoshop. – СПб: Питер, 2003.

  3. Луций С.A. Самоучитель Photoshop CS. – СПб: Питер, 2005.


Технические средства обучения:


Цифровые образовательные ресурсы


  1. http://www.adobe.com

  2. http://photoshop.ru

  3. http://psd.ru

  4. http://graphics.ru

  5. http://pslab.ru

  6. http://maste.ru/photoshop/

  7. http://www.whatis.ru/psd/

  8. http://www.cc-studio.ru/lessons.html

  9. http://demiart.ru/tutorials/index.shtml

5. КИМ и критерии оценки.

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


4



57 вебинаров для учителей на разные темы
ПЕРЕЙТИ к бесплатному просмотру
(заказ свидетельства о просмотре - только до 11 декабря)


Автор
Дата добавления 10.03.2016
Раздел Информатика
Подраздел Рабочие программы
Просмотров79
Номер материала ДВ-514627
Получить свидетельство о публикации
Похожие материалы

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