Графика для образовательного веб-сайта © Гаврилова Юлия, Калинина Яна, Борисова Анна, 2007 Преподаватель Николаева Вера Александровна © КАИТ 20, г. Москва, - презентация

1 Графика для образовательного веб-сайта © Гаврилова Юлия, Калинина Яна, Борисова Анна, 2007 Преподаватель Николаева Вера Александровна © КАИТ 20, г. Москва, 2007

2 © Гаврилова Ю., Калинина Я., Борисова А., 2007 Графика для образовательного веб-сайта Проблема Веб-сайт для сети Интернет должен иметь иллюстрации, которые определяют его дизайн, стиль, подчеркивает индивидуальность его автора и создают необходимый эмоциональный настрой пользователя. Рассмотрим проблему: Нужно ли применять различные эффекты к оформлению графических файлов, используемых на образовательных веб-сайтах?

3 © Гаврилова Ю., Калинина Я., Борисова А., 2007 Графика для образовательного веб-сайта Цель исследования и гипотеза Поставим цель исследования: Определим, как влияют эффекты на изменение образов графических файлов. Выдвинем гипотезу: Если использовать на страницах образовательных веб-сайтов графические файлы с эффектами, то можно придать веб-страницам единый стиль и оттенить (усилить) эмоциональное восприятие веб-сайта или подчеркнуть индивидуальность автора работы.

4 © Гаврилова Ю., Калинина Я., Борисова А., 2007 Графика для образовательного веб-сайта Задачи и ход исследования Исследуем влияние типов изображений и фильтров графического редактора на изменение образов графических файлов. Для этого проанализируем существующие образовательные веб-сайты, созданные учащимися нашего колледжа прошлых лет и представленные в сети Интернет. Рассмотрим как влияют цветовые модели и фильтры графического редактора Adobe PhotoShop на изменение образов графических файлов. Откроем страничку сети Интернет, где находится список веб-сайтов:

5 © Гаврилова Ю., Калинина Я., Борисова А., 2007 Графика для образовательного веб-сайта Влияние типов изображений Это удобно проследить на примере веб-сайта Сумеркиной Евгении «Основные понятия компьютерной графики»: Например, полноцветные изображения являются многоканальными, и чаще всего они используют цветовую модель RGB. Такие изображения, как видно, качественно передают фотографии. Интересно как изменится фотография, если для нее не создавать рамку? Она стала она потеряла свою яркость и стала не такая интересная как с рамкой, которую придумала для нее Женя, автор сайта.

6 © Гаврилова Ю., Калинина Я., Борисова А., 2007 Графика для образовательного веб-сайта Влияние типов изображений Индексированные цвета заметно ухудшают качество изображения, но иногда это удобно для применения эффектов к графике. Полутоновое изображение отбрасывает все цвета, кроме черного, серого и белого. Видно как сильно меняется при этом изображение. Такой рисунок создаст на веб-странице неповторимый колорит и явно изменит стиль веб-сайта.

7 © Гаврилова Ю., Калинина Я., Борисова А., 2007 Графика для образовательного веб-сайта Влияние типов изображений А теперь попробуем искусственно «состарить» фотографию: переведем полноцветное изображение в сепию. Как мы видим, получилась очень эффектная фотография. Сепия сделала малоцветное изображение более красочным и интересным, более веселым. Рамка, которая перекрасилась с самой фотографией, прекрасно сочетается с ней и придает ей дополнительную прелесть. Мы любим технику сепии!

8 © Гаврилова Ю., Калинина Я., Борисова А., 2007 Графика для образовательного веб-сайта Создание графических эффектов Посмотрим как влияют графические эффекты на изменение картинок. Зайдем на веб-сайт Козлова Павла «Во вселенной Beatles» по адресу: На страницах истории группы фотографии обработаны и имеют размытые контуры. Это придает им неповторимый стиль:

9 © Гаврилова Ю., Калинина Я., Борисова А., 2007 Графика для образовательного веб-сайта Создание графических эффектов Сравним фотографии, обработанные в редакторе Adobe PhotoShop и не обработанные: Правая фотография более высокого качества, но не обработанная в соответствии со стилем всего сайта, явно проигрывает левой фотографии по художественной выразительности.

10 © Гаврилова Ю., Калинина Я., Борисова А., 2007 Графика для образовательного веб-сайта Создание графических эффектов В таком же стили обработаны и картины в галерее Барановой Натальи на веб-сайте «Искусство, как жизнь!»: Медальоны из картин смотрятся очень стильно, интересно. Мы обязательно возьмем себе этот прием на вооружение при создании своих образовательных веб-сайтов для сети Интернет.

11 © Гаврилова Ю., Калинина Я., Борисова А., 2007 Графика для образовательного веб-сайта Использование фильтров Просматривая образовательные веб-сайты прошлых лет, мы обнаружили очень интересный проект Наумовой Евгении «Полный Finish»: Один заголовок чего стоит: сразу понятно, что веб-сайт расскажет нам о чем-то тяжелом. Скорее всего, о тяжелой музыке. Видно, как с букв стекает кровь и сразу у пользователей создается нужное настроение. Бр-р-р-р!

12 © Гаврилова Ю., Калинина Я., Борисова А., 2007 Графика для образовательного веб-сайта Использование фильтров Заглянем на следующие страницы этого сайта. Здесь мы увидим ангела Гентского алтаря, который тоже почему-то истекает кровью. О, а вот это уже веселее: такие симпатичные парни сфотографированные на пленку! По их виду понятно, что и ребята не совсем обычные и сайт имеет явное авторское лицо.

13 © Гаврилова Ю., Калинина Я., Борисова А., 2007 Графика для образовательного веб-сайта Использование фильтров Ну вот, наконец-то мы добрались до красот. Взгляните на эти фотографии. Правда, фильтры PhotoShop-а использованы по делу? Понятно, что мы попали в какую-то зимнюю страну. А-а- а, да это Финляндия! Мы так и поняли сразу, лишь чуть- чуть взглянув на фотографии.

14 © Гаврилова Ю., Калинина Я., Борисова А., 2007 Графика для образовательного веб-сайта Опрос одноклассников Просмотрев веб-сайты прошлых лет, мы провели анкетирование одноклассников. Мы задали им два вопроса: 1. Нужно ли обрабатывать фотографии перед тем, как разместить их на веб-сайте? 2. Удастся ли этим придать веб-сайту индивидуальность и авторский почерк? Подсчитав голоса, мы получили результаты, которые нас совсем не удивили: 85% опрошенных сказали «да» на первый вопрос, 78% сказали «да» на второй вопрос. Но почему же цифры не 100%-ые?

15 © Гаврилова Ю., Калинина Я., Борисова А., 2007 Графика для образовательного веб-сайта Опрос одноклассников Итак, почему же цифры не 100%-ые? Вероятно потому, что не все ребята знают Adobe PhotoShop настолько хорошо, чтобы сделать какие-то эффекты. А еще одна причина – банальная лень. Под девизом: «Может быть, и так сойдет, а?»

16 © Гаврилова Ю., Калинина Я., Борисова А., 2007 Графика для образовательного веб-сайта Выводы Исследовав проблему подготовки графических файлов для образовательного веб-сайта сделаем вывод: Использование на страницах образовательных веб- сайтов графических файлов с эффектами придает веб-страницам нужный автору стиль и усиливает эмоциональное восприятие веб-сайта пользователем. Если вы хотите сделать ваш сайт действительно авторским, не жалейте времени для обработки графики, создавайте графические элементы оформления сами. Именно так можно сделать дизайн вашего сайта неповторимым, непохожим на другие и интересным.

17 © Гаврилова Ю., Калинина Я., Борисова А., 2007 Графика для образовательного веб-сайта Наши результаты С нашими веб-проектами, при создании которых мы использовали материалы этого исследования, вы можете познакомиться на страницах:

18