Практическая работа Продвижение информационного ресурса в сети Интернет
 Скачать 242.56 Kb.
|
|
Практическая работа Продвижение информационного ресурса в сети Интернет Цель работы: Создать анимированный баннер для продвижения информационного ресурса в сети Интернет. Основные теоретические сведения Изначально сокращение «GIMP» означало англ. General Image Manipulation Program, а в 1997 году полное название было изменено на «GNU Image Manipulation Program», и программа официально стала частью проекта GNU. В течение продолжительного времени GIMP создавался с учётом пожеланий пользователей, но в основном согласно предпочтениям разработчиков и без привлечения экспертов по эргономике. Целостное видение проекта отсутствовало. Чтобы решить накопившиеся в результате этого проблемы, был принят ряд мер. В 2005 году проект GIMP был зарегистрирован участником программы OpenUsability. На конференции Libre Graphics Meeting в марте 2006 года состоялась первая встреча представителей OpenUsability и команды разработчиков GIMP, в ходе которой было определено видение GIMP как продукта для конечных пользователей: GIMP является свободным ПО; GIMP является высококачественным приложением для фоторетуши и позволяет создавать оригинальные изображения; GIMP является высококачественным приложением для создания экранной и веб-графики; GIMP является платформой для создания мощных и современных алгоритмов обработки графики учёными и дизайнерами; GIMP позволяет автоматизировать выполнение повторяющихся действий; GIMP легко расширяем за счёт простой установки дополнений. Эти тезисы определяют дальнейшее развитие GIMP. Осенью 2006 года в рамках проекта OpenUsability было проведено исследование, результаты которого постепенно оформляются в виде рекомендаций и спецификаций и реализуются. Типичные задачи, которые можно решать при помощи GIMP, включают в себя создание графики и логотипов, масштабирование и кадрирование фотографий, раскраска, комбинирование изображений с использованием слоёв, ретуширование и преобразования изображений в различные форматы. Работа с фотографиями В GIMP присутствует набор инструментов цветокоррекции: кривые; уровни; микшер каналов; постеризация; тон-насыщенность; баланс цветов; яркость-контраст; обесцвечивание. При помощи фильтров, инструментов, масок и слоёв с разными типами наложения (всего 22) можно: выравнивать заваленный горизонт; убирать искажения, вносимые оптикой; корректировать перспективу; выполнять клонирование объектов с учётом перспективы; кадрировать фотографии; удалять дефекты вроде пыли на матрице (штамп, лечебная кисть); имитировать использование различных цветофильтров; «вытаскивать» потерянную детализацию в тенях; многое другое. Реализовано управление цветом. Рисование несколько рисующих инструментов; свободно масштабируемые кисти; поддержка кистевой динамики; поддержка графических планшетов. Экранные фильтры Дополнительные возможности по коррекции изображений на протяжении всей работы реализованы в виде экранных фильтров. К ним относятся: имитация разных типов дальтонизма (протанопия, дейтеронопия, тританопия); гамма-коррекция; коррекция контраста; управление цветом. Настраиваемый интерфейс плавающие палитры легко группируются и перегруппируются; возможна полная перенастройка клавиатурных комбинаций, действий мыши, а также устройств ввода вроде Griffin Powermate; любое меню можно превратить в свободно перемещаемое окно (Linux/UNIX). Необходимый начальный вид главного окна программы Gimp изображен на рис. А.1. Задания к практической части 1. Получить индивидуальное задание у преподавателя (сфера деятельности компании, анимированный баннер товара или услуги которой нужно создать). 2. Запустить программу Gimp. 3. Если программа Gimp запущена первый раз, то в некоторых случаях она состоит из 3 окон, что не совсем удобно. Чтобы переключить программу в однооконный режим, нужно выбрать пу 4. Руководство пользователя к программе Gimp на русском языке доступно через пункт программы Gimp (URL: http://gimp.org). Если справка не доступна через пункт меню Справка, то её можно загрузить отдельно с сайтапрограммы и установить. ввести размер кнопку OK). 6. Залить всё изображение любым светлым цветом. Для этого выбрать цвет, нажав двойным кликом на прямоугольнике выбора цвета, расположенном ниже панели инструментов, и залить им всё изображение, нажав на кнопке Плоская заливка на панели инструментов, а затем нажав на изображении. 7. Инструментом Текст с панели инструментов написать название товара или услуги согласно индивидуальному заданию в центре изображения. Размер, цвет и выравнивание (выключка) текста задаются на панели настройки текущего инструмента в левом нижнем углу экрана. 9. Скрыть все слои кроме нового созданного прозрачного слоя, нажав на все значки с изображением глаза слева от названия каждого слоя, кроме нового прозрачного, в окне слоёв (или удерживая клавишу Shift нажать на значке с изображением глаза слева от названия нового прозрачного слоя). 10. Сделать активным новый прозрачный слой, нажав на его названии. 11. Выбрать инструмент Карандаш с панели инструментов, задать красный цвет на панели выбора цвета, задать размер (толщину) карандаша равным 1 на панели настройки текущего инструмента и, удерживая клавишу Shift, нарисовать стрелку по 8 точкам, как указано на схеме анимации в задании к этой лабораторной работе в кадре № 3. 12. Выделить внутреннюю часть стрелки. Для этого нужно выбрать инструмент Выделение смежных областей, задать режим "Заменить текущее выделение", порог "0,0" и нажать курсором мыши во внутреннюю часть стрелки. 13. Залить градиентной заливкой стрелку слева направо. Для этого выбрать инструмент Градиент, режим "Нормальный", градиент "Основной в фоновый (RGB)", форма "Линейная", указать цвет переднего плана "красный" и цвет фона "белый" на панели выбора цвета переднего плана и фона, нажать курсором мыши в левой части нарисованной стрелки и, не отпуская левой кнопки мыши, переместить курсор в правую часть стрелки и отпустить кнопку мыши. 15. Найти в интернете, например, через сервис для поиска изображений в интернете на сайте Яндекс-картинки (URL: http://images.yandex.ru/) или схематично нарисовать в редакторе Paint изображение товара или услуги согласно индивидуальному заданию и сохранить его в какую-нибудь папку на диске. 16. Вставить это изображение как нов 17. Если вставленное изображение по ширине больше половины всего изображения, то выбрать инструмент Масштаб (не путать с инструментом Лупа), задать параметры: направление "Обычное (вперёд)", режим "Сохранять пропорции", нажать курсором мыши на изображении и, потянув за любой угол изображения, уменьшить его, а затем нажать кнопку Изменить в окне Масштаб. 18. Переместить вставленное изображение в правую часть всего изображения, выбрав инструмент Перемещение, режим "Переместить активный слой" и переместив курсором мыши вставленное изображение. 19. Удалить однотонный фон (белый или любой другой) со вставленного изображения, чтобы через него был виден наш слой "Фон". Для этого выбрать инструмент Выделение по цвету, задать режим "Заменить текущее выделение", порог "0,0" или больше, если выделяется не весь фон, например, "15,0", нажать курсором мыши в точку вставленного изображения, имеющую цвет фона, и очистить выделение (пункт меню 21. Скрыть все слои кроме фона, нажав на значке с изображением глаза слева от названия слоя "Фон" в окне слоёв, удерживая клавишу Shift. 22. Инструментом Текст с панели инструментов написать в 2-3 строки фразу "Только от" и придуманное название компании согласно индивидуальному заданию вместе с видом организации, например:"Только от магазина женской одежды Модная штучка", "Только от салона оптики Оптик-стиль". Размер и цвет текста задать так, чтобы текст хорошо читался и был контрастным по отношению к фону. Выравнивание (выключку) текста задать по правому краю на панели настройки текущего инструмента в левом нижнем углу экрана. После слов "Только от" нажать клавишу Пробел несколько раз, чтобы внешне надпись выглядела в 2-3 строки следующим образом: первая строка "Только от" – выровненной по левому краю, а вторая и последующие строки с названием компании –по правому краю, как в кадре № 7 схемы анимации. 23. Сохранить полученное изображение, состоящее из 5 слоёв, в формате Gimp с ра нажать кнопку Сохранить). 24. Теперь нужно перейти к созданию анимации. Принцип создания анимации заключается в следующем: делаются видимыми только слои, которые должны присутствовать в первом кадре, остальные слои делаются не видимыми, создаётся слой из всех видимых слоёв (пункт меню делаются видимыми только слои, которые должны присутствовать во втором кадре,и опять создаётся слой из всех видимых слоёв и т.д. Когда будут получены все кадры анимации, нужно слой), оставив только слои с названием "Видимое ..." и сохранить анимацию в формате GIF. 25. Для создания кадра № 1 нужно сделать видимыми только слои: название товара или услуги и фон. 26. Для создания кадра № 2 нужно сделать видимыми только слои: фон и название товара или услуги, сделав его полупрозрачным (выделив слой и нажав курсором мыши на бегунке Непрозрачность в окне слоёв над списком слоёв, чтобы параметр Непрозрачность стал равен "30,0"). 27. Для создания кадра № 3 нужно сделать видимыми только слои: стрелка, изображение товара или услуги и фон. 28. Для создания кадра № 4 нужно сделать видимыми те же слои, что и для кадра № 3, но слой со стрелкой нужно переместить немного правее инструментом Перемещение (режим "Переместить активный слой"). 29. Для создания кадра № 5 нужно сделать видимыми те же слои, что и для кадра № 4, но слой со стрелкой нужно переместить ещё правее. 30. Для создания кадра № 6 нужно сделать видимыми только слои: фон и фразу "Только от ...", сделав её полупрозрачной (выделив слой и нажав курсором мыши на бегунке Непрозрачность в окне слоёв над списком слоёв, чтобы параметр Непрозрачность стал равен "30,0"). 31. Для создания кадра № 7 нужно сделать видимыми те же слои, что и для кадра № 6, но слой с фразой "Только от ...", нужно сделать непрозрачным (параметр Непрозрачность равен "100,0"). 32. Для создания кадра № 8 нужно сделать видимыми те же слои, что и для кадра № 7, но слой с фразой "Только от ...", нужно сделать полупрозрачным (параметр Непрозрачность равен "30,0"). 33. Итого должно получиться 13 слоёв (8 слоёв-кадров с названием "Видимое ..." и 5 исходных слоёв). 34. Удалить 5 исходных слоёв. Для этого нажать правой кнопкой мыши на названии каждого 3 ажать кнопку Начать воспроизведение). 36. Если при воспроизведении анимация идёт в не правильном порядке, то нужно изменить порядок слоёв, перетаскивая их курсором мыши в окне слоёв (анимация воспроизводитсяот нижнего слоя к верхнему). щение об ошибке, 38. Открыть сохранённый GIF файл и посмотреть анимацию. Если файл не открывается как анимация стандартной программой, то нужно открыть его с помощью браузера Internet Explorer, нажав на файле правой кнопкой мыши и выбрав пункт Открыть с помощью Контрольные вопросы: 1. Что такое баннер, какие бывают баннеры. 2. Что такое CTR баннера? В чём измеряется? 3. Как сделать эффективный баннер? 4. Что такое баннерные сети, как они работают? 5. В какой баннерной сети можно использовать ваш баннер? Индивидуальные задания к лабораторным работам 1 Продажа деловой одежды 2 Продажа кондитерских изделий 3 Продажа мобильных телефонов 4 Продажа быстрых завтраков 5 Продажа зимней обуви 6 Пошив и продажа одежды на заказ 7 Изготовление и продажа и очков 8 Продажа зоотоваров 9 Продажа фототоваров 10 Продажа автомобильных запчастей 11 Продажа часов 12 Продажа ювелирных украшений 13 Продажа цветов 14 Продажа книг 15 Продажа головных уборов 16 Продажа посуды 17 Продажа косметики 18 Продажа мягких игрушек 19 Продажа мебели 20 Продажа и установка пластиковых окон |