Министерство образования и науки Российской Федерации

Государственное образовательное учреждение

высшего профессионального образования

«Уральский государственный педагогический университет»

Институт музыкального и художественного образования

Кафедра художественного образования

Дизайн-проект сайта детской художественной школы

Выпускная квалификационная работа

Исполнитель:

Ермолаева Ксения Сергеевна

студентка 4 курса, 405 группы

Допущена к защите дневного отделения

« » 2011 г. профиль «Дизайн и

компьютерная графика» (050608)

Зав. кафедрой

(Перевышина Н.Ю.) Научный руководитель:

старший преподаватель кафедры

художественного образования

Фахреев Т.Р.

Екатеринбург, 2011

Техническое задание

В соответствии с проектированием сайта художественной направленности необходимо учитывать ряд требований:

1. Функциональность и доступность размещенной на сайте разноплановой информации.

2. Основное направление деятельности учреждения в сфере дополнительного художественного образования.

3. Возрастная группа пользователей: учащиеся – 12-15 лет; родители учащихся – от 30 лет.

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

СОДЕРЖАНИЕ

ТЕХНИЧЕСКОЕ ЗАДАНИЕ 2

ВВЕДЕНИЕ 7

1.1 Анализ аналогов 17

Всемирная паутина состоит из миллиардов Интернет-сайтов различной направленности. Компания Netcraft, занимающаяся подсчетом ресурсов в Интернете, в декабре 2009 выпустила последний аналитический отчёт по количеству сайтов во всемирной сети. По последним данным насчитывается 233 848 493 ресурса. В это число по словам сотрудников компании вошли промо-сайты, веб-сервисы, игровые порталы, блоги и блогосфера в целом. 17

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

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

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

Информационно-коммуникативные сайты учреждений, которые ориентированы на предоставление комплексных сервисов, включая «Электронный журнал», «Электронный дневник», «Переписка между родителями и педагогами», «Электронные цифровые ресурсы» и так далее [14]. 17

Анализируя многообразие сайтов учреждений дополнительного образования художественной направленности, можно утверждать, что художественные школы уже давно имеют свои представительства в интернете. Эти ресурсы стали востребованы у посетителей интернета. В связи с этим, многие школы, стали заказывать разработку сайта у специалистов, в студиях web-дизайна, и это правильно, ведь сайты созданные профессионалами на уровень выше тех, которые были разработаны неквалифицированными специалистами. 18

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

1. Доменное имя - адрес на котором располагается сайт. 19

2. Главная страница. Оценивается структура , информативность. 19

3. Структура сайта. Оценивается удобство навигации, функциональность. 19

4. Дизайн. Оценивается оригинальность, нестандартность подачи информации, соответствие тематике сайта. 19

5. Количество и качество контента. Оценивается наполнение сайта информацией, оригинальность текстов, частота обновления информации. 19

6. Посещаемость. Востребованность ресурса, как часто на сайт заходят пользователи. 19

Так же в процессе анализа выявлялись достоинства и недостатки ресурса. 19

Аналог№1 19

Детская школа искусств имени М.А. Балакирева 19

Главная страница сайта детской школы искусств имени М.А. Балакирева размещена в интернете по адресу – http://balakirevschool.ru/, адрес достаточно полно отражает фактическое название организации, но не учитывается то, что это школа искусств. 20

Сайт был создан в 2007 году дизайн студией Пларсон – http://plarson.ru/. 20

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

Рассмотрим основной титульный элемент сайта – так называемую «шапку». В шапке сайта располагают такие основные элементы макета, как логотип, меню навигации, слоган, контактные данные. В данном случае, в шапке сайта размещено название организации «Детская школа искусств имени М.А. Балакирева», логотип, тематическая фотография, контактная информация. Так же, к шапке сайта отнесен еще один важный элемент – навигационный интерфейс, т.е. меню сайта. В целом главная страница достаточно информативна и отвечает всем основным требованиям. 20

Структура сайта определяется двумя навигационными интерфейсами: первое меню – основное, расположено горизонтально под шапкой сайта, второе меню – списочное, расположено вертикально слева. Это позволяет усовершенствовать систему навигации. 20

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

Информация на сайте постоянно обновляется, за счет этого ресурс достаточно востребован среди учащихся. 20

Главная страница сайта «Детская школа искусств имени М.А. Балакирева» 20

Рисунок 1.1.1 20

21

Страница отделения изобразительного и декоративно-прикладного искусства 21

Рисунок 1.1.2 21

Страница раздела «Виртуальный тур» 24

Рисунок 1.1.3 24

25

Аналог№2 25

Британская высшая школа дизайна 25

Официальный сайт Британской высшей школы дизайна расположен по адресу http://www.britishdesign.ru/. Доменное имя подобрано грамотно, сразу обращает на себя внимание пользователя. 26

Сайт создан в 2003 году одной из ведущих креативных дизайн студий России - FankyPunky. 26

Главная страница представляет собой анимированную заставку, на которой изображены интерьеры школы. На первый взгляд классы кажутся безлюдными, но по прошествии нескольких секунд интерьер оживает : то и дело мимо пробегают спешащие по своим неотложным делам студенты и студентки, сотрудники школы несут на подпись важные документы, а кто-то просто забегает сыграть партию в настольный теннис. Главное меню расположено слева, и состоит из следующих разделов: Новости – О школе Образовательные программы – Заявление на обучение – Вакансии и карьера – Мастер-классы – Вопросы и ответы – Контакты. Так же на главной странице присутствуют ссылки на самые интересные события в жизни школы. 26

Навигация на сайте организована грамотно, при открытии какого-либо раздела в основном навигационном блоке появляется дополнительное меню с расположенными там подразделами, это очень удобно и помогает быстро ориентироваться в информации. Уникальный дизайн сайта соответствует современным трендам: 26

используется motion - дизайн, 26

классическая цветовая схема, с добавлением ярких розовых акцентов, 26

технология Google api maps. 26

Ресурс предоставляет полную информацию для студентов и абитуриентов, а содержание разделов постоянно обновляется, благодаря всем этим достоинствам у сайта большая аудитория пользователей. 26

Главная страница сайта «Британская высшая школа дизайна» 26

Рисунок 1.1.4 27

Рисунок 1.1.5 27

Страница раздела «Образовательные программы» 27

Рисунок 1.1.6 28

Страница раздела «Контакты» 28

Рисунок 1.1.7 28

Страница раздела «Графический дизайн. Базовый курс.» 29

Рисунок 1.1.8 29

1.2 Анализ прототипов 30

Прототип №1 31

Первое, что мы видим, заходя на главную страницу – это основная информация о школе искусств, направления ее деятельности, информация о событиях, происходящих в жизни учащихся, дополнительные сервисы различного содержания. 31

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

Классический дизайн сайта, с использованием всех базовых элементов, сдержанная цветовая схема, эффективная навигация, позволяют быстро ориентироваться в представленной информации. 31

Главная страница сайта «Детская художественная школа № 1 им. Чистякова» 32

Рисунок 1.2.1 32

32

Страница раздела «Методический фонд» 33

Рисунок 1.2.2 33

33

Прототип №2 34

Днепропетровская детская художественная школа №1 34

Сайт-прототип Днепропетровской детской художественной школы№1 34

расположен по адресу http://www.artschool.dp.ua/– общий домен первого уровня для персональных сайтов. Имя краткое, лаконичное, отражающее суть. Проект был создан в 2010 году дизайн - студией «Свой стиль». 34

Главная страница уникальна по своему оформлению, дизайн полностью соответствует тематике. 34

Дизайн сайта запоминающийся и яркий, для декорирования главной страницы используются элементы художественной направленности. На сайте подробная информация о школе и её более чем 60-летней истории, работы учеников школы, информация для будущих абитуриентов об условиях приема в школу. 34

Навигация организована главным меню, расположенным слева. Меню имеет вкладки основных разделов, которые так же имеют деление на более частные подразделы. Подобная навигация позволяет легко ориентироваться во всем составе информации на сайте. 34

На сайте имеются дополнительные интерактивные модули: раздел «Написать письмо», возможность оставить комментарии. 34

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

Главная страница сайта «Днепропетровская детская художественная школа» 35

Рисунок 1.2.3 35

36

Страница раздела «Живопись» 37

Рисунок 1.2.4 37

37

Страница раздела «О школе» 37

Рисунок 1.2.5 37

52