Урок 1. Изучение интерфейса программы. Обзор инструментов. - Анимированная поздравительная открытка - Мастер-классы - Методсовет
  Вторник | 06.12.2016 | 13:09
Методсовет
методический портал учителя
Приветствую Вас Гость | RSS

Меню сайта

Форма входа
Логин:
Пароль:

Категории раздела
Программируем на DELPHI [1]
Ведущий класса Дибиров Магомедшапи
Триггеры в создании тренажеров [6]
Ведущая класса Шевцова Светлана
Анимированная поздравительная открытка [6]
Ведущий класса Кривенцов Леонид
Создание анимированных картинок для учебных пособий на примере поздравительной открытки [6]
Ведущий класса Агибалов Сергей Константинович
Знакомство с платформой для ШДО [2]
Ведущий класса Шевцова Светлана Анатольевна и Ельшина Галина Валентиновна
Интерактивная раскраска в программе PowerPoint [2]
Ведущая класса Колямина Светлана Александровна
Cозданиe интерактивных тестов на основе шаблона А.Н. Комаровского [2]
Ведущая класса Костенко Наталья Владимировна
Интерактивный кроссворд в PowerPoint [2]
Ведущая класса Костенко Наталья Владимировна
Создание видеороликов в программе Photodex ProShow Producer [3]
Ведущая класса Костенко Наталья Владимировна

Поделиться

Статистика

Онлайн всего: 7
Гостей: 7
Пользователей: 0

Наша кнопка

Методсовет


 Мастер-классы 
Главная » Мастер-классы » Анимированная поздравительная открытка

Урок 1. Изучение интерфейса программы. Обзор инструментов.
14.04.2011, 07:22
Добрый день, уважаемые коллеги!

Я рад Вас приветствовать на мастер-классе «Анимированная поздравительная открытка».

Для начала познакомимся. Меня зовут Леонид, я - учитель информатики и ИКТ.
Работа с фотографией и другими графическими объектами в программе Adobe Photoshop – это моё хобби. На этих занятиях я бы хотел поделиться навыками своей работы и через ваши вопросы узнать что то новое.
На каждый урок будет отведено 5 дней (кроме первого). Я предлагаю 2 дня отводить на выполнение работы и 3 дня на обсуждения и возникающие вопросы.
Мастер-класс будет даваться в Adobe Photoshop версии 7.0 (язык русский), наиболее простой версии данной программы. В связи с этим будет проще и нам, и нашим компьютерам, т.к. эта версия раза в 2-3 менее требовательна к ресурсам оперативной памяти и процессора ПК.
Итак, я напоминаю, что растровый графический редактор Adobe Photoshop предназначен для работы с растровой графикой, т.е. с изображениями, построенными с помощью пикселей (точек). Наиболее распространёнными растровыми форматами являются: bmp - это формат изображения для операционной системы Windows, формат редактора изображений Microsoft Paint, jpg - один из популярных графических форматов, применяемый для хранения фотоизображений и подобных им изображений (в этом формате используется алгоритм сжатия JPEG, который в наибольшей степени пригоден для сжатия фотографий и картин, содержащих реалистичные сцены с плавными переходами яркости и цвета. Сжатие обычно осуществляется с потерей качества, поэтому не рекомендуется такие файлы многократно пересохранять), png - формат хранения графической информации, использующий сжатие без потерь (является хорошим форматом для редактирования изображений и даже для хранения промежуточных стадий редактирования, так как восстановление и пересохранение изображения проходят без потерь в качестве), gif – формат передачи растровых изображений по сетям, поддерживает анимационные изображения (они представляют из себя последовательность из нескольких статичных кадров, а также информацию о том, сколько времени каждый кадр должен быть показан на экране.), psd - внутренний графический формат программы Adobe Photoshop (применяется для хранения промежуточных результатов работы в виде набора слоев).
Работа в графическом редакторе Adobe Photoshop не ограничивается только обычной работой с изображением, которую мы привыкли с вами выполнять: исправления, перекраска, удаление ненужных элементов и т.д. Данная программа позволяет создавать анимационные объекты, а именно gif-анимации – динамические изображения (изображения с движением). Я уверен, что в сети Интернет Вы не мало их уже повстречали, а насколько сложно их создать самому нам предстоит с вами узнать.
Познакомимся с интерфейсом программы:


Все окна в программе могут скрываться или показываться и находятся в меню Окно.
Для работы в программе необходимо изучить Основное меню и инструменты, находящиеся в Панели инструментов. Значок инструмента с маленьким чёрным треугольничком внизу раскрывается нажатием правой кнопки мыши. Когда инструмент становится активным, под Основным меню появляются настройки для него. Познакомимся с основными инструментами:
1. Выделение области;
2. Перемещение;
3. Лассо (выделение произвольной области);
4. Волшебная палочка (автоматическое выделение по цвету области);
5. Кадрирование (обрезка изображения, выполняется нажатием клавиши Enter);
6. Кисть, карандаш;
7. Клонированный штамп, штамп (копирует выделенную область в указанное место). Для копирования выбрать размер и вид кисти в настройках, навести на нужную часть изображения, зажать клавишу Alt и нажать левую кнопку мыши. Затем переместить в нужное место и просто нажать левую кнопку мыши.
8. Ластик (обычное удаление), ластик фона (удаление фона), волшебный ластик (удаление фрагмента одного выбранного цвета).
9. Заливка (одним цветом), градиент (заливает область плавным переходом от одного цвета к другому);
10. Размытие (смазывание границ изображения), резкость (повышения четкости), палец (смазывание по траектории);
11. Осветление области, затемнение области, губка (изменяет насыщенность цветов);
12. Инструмент для печати текста на изображении.
13. Рисование фигур;
14. Пипетка (выбор цвета);
15. Инструмент лупа (увеличение, уменьшение масштаба изображения). Удобно увеличивать масштаб одновременным нажатием клавиш ctrl и +, а уменьшать ctrl и -.
16. Установки цвета фона (сверху слева – цвет переднего плана, снизу справа – цвет фона). Цвета выбираются в окне цвета, образцы, стили;
17. Переход в приложение Adobe ImageReady (создание анимации).
Клавиша Tab убирает все открытые окна в программе (повторное нажатие возвращает к исходному интерфейсу).
Любое создаваемое изображение в программе сначала состоит из фона, т.е. если Вы работаете с одним изображением оно и является фоном (фоновым слоем). На фоновый слой можно перенести любое количество других изображений, которые будут называться слоями. Текст, напечатанный в программе, также хранится на отдельном слое. Над каждым слоем работа проводится отдельно. Таким образом, Вы можете изменять и перемещать содержимое любого слоя, не затрагивая при этом объекты, расположенные на других слоях. Окно Слои выглядит следующим образом:

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

Для выполнения работы нам необходимо запастись графическими элементами, которые будут присутствовать на нашей открытке.
Нам понадобятся: красивая картинка в формате .jpg размером не менее 400х300 – горизонтальная или 300х400 – вертикальная (желательно с цветами), которая будет основным фоном нашей открытки; несколько бабочек на ваш вкус (размером не меньше 100х100). Желательно найти бабочку в формате .png, потому что в этом формате она уже будет без фона и с хорошим качеством изображения. Или найти такую картинку, на которой бабочка будет находиться на фоне одного цвета, который не сливается с цветом бабочки. Как убрать фон мы тоже узнаем. Кроме этого будут необходимы любые объекты на Ваш вкус: плюшевые мишки, букеты цветов, звёздочки и т.д. Думаю что не составит особого труда найти все это в сети Интернет.

1-й урок

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

Желаю всем успешного поиска!

Файл-архив: (445.1Kb)
Добавил: Root_l | Автор: Кривенцов Леонид Александрович E W
Просмотров: 2417 | Рейтинг: 5.0/7
Всего комментариев: 461 2 »
Оценить комментарий  0   Спам
45 br42ap47   (29.04.2011 22:42)
Леонид Александрович! У меня не загружается программа. Почему? Что я делаю не так? smile

Оценить комментарий  0   Спам
46 Root_l   (30.04.2011 13:40)
Программу я уже удалил из сети, т.к. версия пиратская. Теперь вам придется ее искать в другом месте. Могу посоветовать только официальный сайт http://www.adobe.com/ru/products/photoshopfamily.html?promoid=BPCEY

Оценить комментарий  0   Спам
41 Валерий   (15.04.2011 22:32)
Зайдите на http://metodsovet.su/forum/34-154-1#13344 Я сделал видеоролик по обработке фотографий. Перед МК начинающим фотошоперам должно быть интересно. Записано без звука (спешил). Если заинтересует, объясню письменно что да как.

Оценить комментарий  0   Спам
44 Root_l   (16.04.2011 11:53)
Валерий, спасибо за помощь.

Оценить комментарий  0   Спам
40 zaika   (15.04.2011 22:24)
Здравствуйте, Леонид Александрович! Программу скачала, но почему-то получилось 50/50: половина на русском , а половина на англ. Что делать?

Оценить комментарий  0   Спам
43 Root_l   (16.04.2011 11:51)
Полностью меню не русифицируется. Все правильно. Только самые основные инструменты. Не переживайте, в уроках я буду в скобках указывать и команды английских версий на английском языке. Как только будут вопросы - сразу же задавайте.

Оценить комментарий  0   Спам
39 ИринаМатвеевна   (15.04.2011 19:21)
Леонид Александрович! Не могу идти против всех, но, если можно, больше сроки уроков не сдвигать, пожалуйста!

Оценить комментарий  0   Спам
42 Root_l   (16.04.2011 11:49)
Больше не будет сдвигов точно, поэтому я прописал во введении с какого числа по какое будет каждый урок.

Оценить комментарий  0   Спам
38 Marina   (15.04.2011 16:40)
Добрый день, Леонид! Фотошоп установила, картинки нашла. Можно приступить и ко второму занятию.
С уважением, М.Н.

Оценить комментарий  0   Спам
32 kuzichkina73   (14.04.2011 22:49)
Добрый вечер, Леонид. Пока всё понятно и доступно. Спасибо за подробный инструктаж.

Оценить комментарий  0   Спам
31 Руфия   (14.04.2011 22:01)
Здорово! Я все подготовила! Не терпится начать. Может не стоит на первый урок отводить 5 дней?

Оценить комментарий  0   Спам
33 Root_l   (15.04.2011 06:41)
Руфия, не торопитесь. Изучите Основное меню, попробуйте выполнить с помощью инструментов какие-либо действия с изображением. Надо дать возможность всем желающим присоединиться к мастер-классу, некоторые еще программу не скачали.

Оценить комментарий  0   Спам
28 Валерий   (14.04.2011 21:18)
Леонид, и все-таки давая уроки, используя русскую версию, в скобках пишите английский перевод команд. Кому-то это будет нужно

Оценить комментарий  0   Спам
30 Root_l   (14.04.2011 21:29)
Хорошо, Валерий.

Оценить комментарий  0   Спам
27 irinap73   (14.04.2011 21:16)
Добрый день Леонид Александрович! Я Второй день пытаюсь загрузить программу, но она загружается только частично,Почему

Оценить комментарий  0   Спам
29 Root_l   (14.04.2011 21:23)
Скорее всего это сбой загрузки. Попробуйте найти другую версию или попробуйте снова.

Оценить комментарий  0   Спам
25 Валерий   (14.04.2011 21:00)
В версиях фотошоп CS3 и выше Adobe ImageReady уже встроен. Достаточно открыть Окно и нажать Анимация. CS3 - самая удобная, пока, версия (хотя у меня есть и CS4).

Оценить комментарий  0   Спам
37 Alex   (15.04.2011 16:23)
Спасибо за информацию. Не знал про это, у меня версия CS2, а с CS3 и CS4 пока не работал. biggrin

Оценить комментарий  0   Спам
21 YuliaG   (14.04.2011 19:45)
Уважаемый Леонид Александрович!
Пока все ясно.
Только у меня версия другая - 10.0. Не нашла Переход в приложение Adobe ImageReady.
С уважением, Юлия.

Оценить комментарий  0   Спам
22 Root_l   (14.04.2011 19:49)
Не переживайте, все выясним когда дойдём до анимации.

Оценить комментарий  0   Спам
23 YuliaG   (14.04.2011 19:51)
Спасибо!
Нужные для работы картинки уже нашла. smile

Оценить комментарий  0   Спам
24 Root_l   (14.04.2011 19:52)
Загляните в меню Окно-Анимация.

Оценить комментарий  0   Спам
36 Alex   (15.04.2011 16:17)
Попробуйте сочетание клавиш (т.н. "горячие клавиши")
Shift+Ctr+M

Оценить комментарий  0   Спам
16 Руфия   (14.04.2011 18:54)
Уважаемый Леонид Александрович. У меня версия Adobe Photoshop CS, Русская. Нашла все инструменты. единственное, я не нашла Перехода в приложение Adobe ImageReady (создание анимации).

Оценить комментарий  0   Спам
18 Root_l   (14.04.2011 19:03)
У меня дома версия 7.0 а на работе CS4, поэтому я вам завтра напишу в какое меню зайти точно. Посмотрите меню окно, там должна быть анимация.

Оценить комментарий  0   Спам
20 Руфия   (14.04.2011 19:13)
Спасибо! да в меню Окно есть Анимация. просто я за сомневалась

Оценить комментарий  0   Спам
34 Alex   (15.04.2011 16:14)
Можно попробовать сочетание клавиш (т.н. "горячие клавиши")
Shift+Ctr+M

Оценить комментарий  0   Спам
12 Lana   (14.04.2011 18:03)
Уважаемый Леонид Александрович, является ли обязательным использование изображений с цветами, бабочками, медвежатами и т.д.? biggrin

Оценить комментарий  0   Спам
13 Root_l   (14.04.2011 18:08)
Если у вас есть другое решение - можно. Просто создание анимации я приведу на примере махающей крыльями бабочки. Если брать в пример другой объект, то действия возможно будут несколько отличаться, а значит и вопросы возникнут другие. Но, если Вы настаиваете, я не против, выбирайте что хотите, но соблюдайте рекомендации по формату искомых изображений, пожалуйста.

Оценить комментарий  0   Спам
14 Lana   (14.04.2011 18:15)
Леонид Александровия, ни в коем случае не настаиваю. Появилась идея для создания открытки на определнную тематику, поэтому, задумалась, справлюсь ли? biggrin

Оценить комментарий  0   Спам
15 Root_l   (14.04.2011 18:32)
Я думаю что можно начать с простого, а потом применить свои знания для реализации любых идей - это реально. Я сам так начинал. Поэтому я просто предлагаю не торопиться. Если Вы знакомы с программой можете не зацикливаться на материале урока и воплощать свои идеи в реальность. Я обязательно Вам помогу.

Оценить комментарий  0   Спам
17 Lana   (14.04.2011 18:58)
В программе работала чуть-чуть: убрать фон, осветлить-затемнить... Вообщем, ищу изображения с бабочками и ... другие. Важно понять принцип работы, которому Вы нас научите, а потом будем реализовывать идеи.

Оценить комментарий  0   Спам
19 Root_l   (14.04.2011 19:08)
Только у меня к Вам всем большая просьба: если я, не дай бог, что то не верно выскажу или преподнесу - сразу же делайте мне замечание, не стесняйтесь. Я тоже не профессионал biggrin .

Оценить комментарий  0   Спам
9 Татьяна8730   (14.04.2011 17:07)
Леонид Александрович, спасибо за файл! Дело в том, что текс задания здесь с этой страницы не выделяется для того чтобы скопировать. Я уже пробовала, а потом вам написала. К работе уже приступила.

Оценить комментарий  0   Спам
10 Root_l   (14.04.2011 17:39)
Странно, у меня выделяется. А какой у Вас браузер? Хотя может быть выделяется у меня потому что я администратор этой странички ... В следующий раз буду сразу прикреплять урок. Будут вопросы - задавайте.

Оценить комментарий  0   Спам
26 ToGooZoff   (14.04.2011 21:07)
Татьяна Николаевна, копирование текста ничем не ограничено, попробуйте использовать другой браузер.

Оценить комментарий  0   Спам
5 Евгений   (14.04.2011 15:33)
Я нашел уже все. А когда переходишь в приложение Adobe ImageReady, становится во по анг., на него русификатора нет?

Оценить комментарий  0   Спам
6 Root_l   (14.04.2011 16:17)
Да, Евгений, там нам придётся чуть сложнее, но я постараюсь подробнее все объяснить. Русификатора нет. Но это приложение нам понадобится только на 5-м уроке - вся подготовка осуществляется в программе Фотошоп.

1-15 16-18
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]

Мы "ВКонтакте"

Поиск

Наши планы
Приглашаем Вас ознакомиться
с планами нашего портала

Афоризм дня
Кто привык быть неискренним с другими, тот в конце концов перестает быть искренним с собой.
/Ф. Ларошфуко/


Реклама

Рейтинг@Mail.ru
"Методсовет" © 2010 - 2016
My-shop.ru - Магазин учебной и деловой литературы