Методическая разработка урока по информатике и ИКТ по теме «Web-дизайн. Юзабилити», 10 класс
Предпросмотр материала:
Выберите файл для просмотра:
Всего файлов: 15
Íèêèôîðîâ Þ.Â.
Задание архитекторам
Вы – информационные архитекторы.
Ваша задача – ответить на вопросы и заполнить технологическую карту.
На выполнение всех заданий дается 15 минут.
Распределите задания среди участников группы.
Выберите представителя группы, который представит отчет.
Отчет сохранить в сетевом окружении, в папке документы на teacher (teacher (301)) - «отчет» - «веб-архитектор».
План представления отчета:
1. Коротко изложить информацию о профессии, где можно получить данную профессию.
2. Представить результаты работы над технологической картой.
1 слайд: Название профессии
2 слайд:
1. Чем занимаются Web-архитекторы?
Перейдите по ссылкам и поместите нужную информацию на слайд.
2) http://www.redbee.ru/articles/detail.php?ID=966
3) http://www.webmascon.com/topics/planning/01a.asp
3 слайд:
2. Где можно получить специальность web - архитектора?
Перейдите по ссылкам и поместите нужную информацию на слайд.
2) http://spb.designschool.ru/study/web-dizajn/
3. Заполните технологическую карту:
Оценочный лист
Оцените каждый критерий по пятибалльной системе
|
Критерий |
взаимооценка |
Оценка учителя |
|||||
|
Web-дизайнеры |
Юзабилити специалисты |
Web - программисты |
Web-дизайнеры |
Юзабилити специалисты |
Web - программисты |
Web архитекторы |
|
|
Выбор нужной информации. Умение кратко изложить информацию |
|
|
|
|
|
|
|
|
Анализ информации (заполнение тех. карты или таблицы) |
|
|
|
|
|
|
|
|
Четкость и грамотность представления ответа (выступление) |
|
|
|
|
|
|
|
|
Всего баллов |
|
|
|
|
|
|
|
|
оценка |
|
|
|
|
|
|
|
|
13-15 баллов – «5» 10-12 баллов – «4» 7-9 баллов – «3» |
|||||||
Задание для Web-дизайнеров
Вы – web-дизайнеры.
Ваша задача ответить на поставленные вопросы, используя источники Интернет.
На выполнение всех заданий дается 15 минут.
Распределите задания среди участников группы.
Выберите представителя группы, который представит отчет.
Отчет сохранить в сетевом окружении, в папке документы на teacher (teacher (301)) - «отчет» - «веб-дизайнер».
План представления отчета:
1. Коротко изложить информацию о профессии, где можно получить данную профессию.
2. Представить результаты работы над технологической картой.
1 слайд: Название профессии
2 слайд:
1. Чем занимаются Web-дизайнеры?
Перейдите по ссылкам и поместите нужную информацию на слайд.
http://www.ucheba.ru/prof/40.html
http://otvet.mail.ru/question/52140478/
3 слайд:
2. Где можно получить специальность web дизайнера?
Перейдите по ссылкам и поместите нужную информацию на слайд.
http://www.ucheba.ru/vuz/9309/prof/8055.html
http://pda.teron.ru/index.php?showtopic=658162
3. Заполните технологическую карту, перейдя по ссылке:
Оценочный лист
Оцените каждый критерий по пятибалльной системе
|
Критерий |
взаимооценка |
Оценка учителя |
|||||
|
Web-дизайнеры |
Юзабилити специалисты |
Web - программисты |
Web-дизайнеры |
Юзабилити специалисты |
Web - программисты |
Web архитекторы |
|
|
Выбор нужной информации. Умение кратко изложить информацию |
|
|
|
|
|
|
|
|
Анализ информации (заполнение тех. карты или таблицы) |
|
|
|
|
|
|
|
|
Четкость и грамотность представления ответа (выступление) |
|
|
|
|
|
|
|
|
Всего баллов |
|
|
|
|
|
|
|
|
оценка |
|
|
|
|
|
|
|
|
13-15 баллов – «5» 10-12 баллов – «4» 7-9 баллов – «3» |
|||||||
Задание специалистам по юзабилити
Вы – юзабилити специалисты.
Ваша задача используя данные источники Интернет, ответить на поставленные вопросы и заполнить технологическую карту.
Распределите задания среди участников группы.
На выполнение всех заданий дается 15 минут.
Выберите представителя группы, который представит отчет.
Отчет сохранить в сетевом окружении, в папке документы на teacher (teacher (301)) - «отчет» - «юзабилити специалист».
План представления отчета:
1. Коротко изложить информацию о профессии, где можно получить данную профессию.
2. Представить результаты работы над технологической картой.
1 слайд: Название профессии
2 слайд:
1. Чем занимаются юзабилити специалисты?
Перейдите по ссылкам и поместите нужную информацию на слайд.
http://planetahr.ru/publication/3773
http://www.facebook.com/note.php?note_id=208378145890697
http://www.webeffector.ru/wiki/%D0%AE%D0%B7%D0%B0%D0%B1%D0%B8%D0%BB%D0%B8%D1%82%D0%B8
3 слайд:
2. Где можно получить специальность юзабилити специалиста? Перейдите по ссылкам и поместите нужную информацию на слайд.
http://shkolazhizni.ru/archive/0/n-16813/
http://www.edu-all.ru/vc_scripts/selinfo.asp?ident=5936&type=6
3. Дайте оценку сайтам с точки зрения юзабилити специалиста. Если пункт отсутствует на сайте, то поставьте прочерк. (эл.вариант технологической карты на рабочее столе в папке «задания» - «юзабилити специалист»).
Технологическая карта
Юзабилити специалист
Проведите анализ сайта г.Губахи. Перейдите по ссылке, заполните таблицу. Если данный критерий отсутствует, то поставьте прочерк. Результаты анализа представить на обсуждение.
|
№ п/п |
критерии |
|
|
1. |
место сайта в общем рейтинге |
|
|
2. |
количество просмотренных веб-страниц, количество посетителей; |
|
|
3. |
аудитория сайта (уникальные, постоянные посетители и т. д.) |
|
|
4. |
время, проведенное на веб-странице посетителем, |
|
|
5. |
удобство навигации сайта для посетителей (да, нет) |
|
|
6. |
индекс популярности |
|
Оценочный лист
Оцените каждый критерий по пятибалльной системе
|
Критерий |
взаимооценка |
Оценка учителя |
|||||
|
Web-дизайнеры |
Юзабилити специалисты |
Web - программисты |
Web-дизайнеры |
Юзабилити специалисты |
Web - программисты |
Web архитекторы |
|
|
Выбор нужной информации. Умение кратко изложить информацию |
|
|
|
|
|
|
|
|
Анализ информации (заполнение тех. карты или таблицы) |
|
|
|
|
|
|
|
|
Четкость и грамотность представления ответа (выступление) |
|
|
|
|
|
|
|
|
Всего баллов |
|
|
|
|
|
|
|
|
оценка |
|
|
|
|
|
|
|
|
13-15 баллов – «5» 10-12 баллов – «4» 7-9 баллов – «3» |
|||||||
Web- программист
Вы – web-программисты.
Ваша задача ответить на поставленные вопросы и заполнить таблицу.
На выполнение всех заданий дается 15 минут.
Распределите задания среди участников группы.
Выберите представителя группы, который представит отчет.
Отчет сохранить в сетевом окружении, в папке документы на teacher (teacher (301)) - «отчет» - «веб-программист».
План представления отчета:
1. Коротко изложить информацию о профессии, где можно получить данную профессию.
2. Представить результаты работы над технологической картой.
Форма отчета web-программистов:
1) Презентация (1 слайд - деятельность веб-программиста, 2 слайд - где можно получить специальность веб-программиста);
2) Заполненная таблица.
1 слайд: Название профессии
2 слайд:
1. Чем занимаются Web-программисты?
Перейдите по ссылкам и поместите нужную информацию на слайд.
http://www.profi.ua/prof/view/7/
http://prof.biografguru.ru/about/programmist/?q=3000&dp=130
3 слайд:
2. Где можно получить специальность web программиста?
Перейдите по ссылкам и поместите нужную информацию на слайд.
http://itstudy.ru/news.php?tip=3&id=1164
http://www.ucheba.ru/prof/497.html
3. Используя материалы сайтов:
http://joomlovod.ru/xxx/329-texnicheskij-analiz-sajta.html
http://swsait.ru/s-chego-nachat-sozdanie-sajta/sposoby-sozdaniya-sajta.html
заполните таблицу:
(эл.вариант технологической карты на рабочее столе в папке «задания» - «web- программист»).
|
№ п/п |
Способы создания сайта |
плюсы |
минусы |
Какой критерий выбрали бы вы? |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Оценочный лист
Оцените каждый критерий по пятибалльной системе
|
Критерий |
взаимооценка |
Оценка учителя |
|||||
|
Web-дизайнеры |
Юзабилити специалисты |
Web - программисты |
Web-дизайнеры |
Юзабилити специалисты |
Web - программисты |
Web архитекторы |
|
|
Выбор нужной информации. Умение кратко изложить информацию |
|
|
|
|
|
|
|
|
Анализ информации (заполнение тех. карты или таблицы) |
|
|
|
|
|
|
|
|
Четкость и грамотность представления ответа (выступление) |
|
|
|
|
|
|
|
|
Всего баллов |
|
|
|
|
|
|
|
|
оценка |
|
|
|
|
|
|
|
|
13-15 баллов – «5» 10-12 баллов – «4» 7-9 баллов – «3» |
|||||||
ЮЗАБИЛИТИ
СПЕЦИАЛИСТЫ
WEB-дизайнеры
WEB – архитекторы
WEB – программисты
План-конспект урока
Автор разработки: С.Н. Россахацкая, учитель информатики МБОУ «СОШ №14» (НОЦ);
Класс: 10
Предмет: информатика;
Тема: «Web-дизайн. Юзабилити»
Этап обучения по данной теме (начальный, основной, завершающий): завершающий;
Тип урока: урок - исследование;
Цели урока:
Развивающие цели:
1. Развитие социокультурной компетенции через знакомство со сведениями о некоторых профессиях.
2. Развитие учебно-познавательной компетенции через устное выступление о результатах своего исследования.
3. Развитие коммуникативной компетенции через работу в группе.
4. Развитие информационной компетенции через умение работать с информацией в сети Интернет (поиск, анализ и отбор информации).
Образовательные цели:
1. Познакомить учащихся с понятием Юзабилити.
2. Формировать практические навыки учащихся при работе с Интернет – ресурсами.
Воспитательные цели:
Воспитание информационной культуры, ответственности за общее дело.
Оборудование:
Компьютеры, мультимедийный проектор, сопровождающая презентация, технологическая карта урока.
Оценочная деятельность на уроке: взаимооценка учащихся, оценка учителя (оценочный лист).
Основные источники информации:
1. http://planetahr.ru/publication/3773
2. http://www.facebook.com/note.php?note_id=208378145890697
3. http://www.webeffector.ru/wiki/%D0%AE%D0%B7%D0%B0%D0%B1%D0%B8%D0%BB%D0%B8%D1%82%D0%B8
4. http://shkolazhizni.ru/archive/0/n-16813/
5. http://www.edu-all.ru/vc_scripts/selinfo.asp?ident=5936&type=6
9. http://www.ucheba.ru/prof/40.html
11. http://www.ucheba.ru/vuz/9309/prof/8055.html
12. http://pda.teron.ru/index.php?showtopic=658162
15. http://www.redbee.ru/articles/detail.php?ID=966
16. http://www.webmascon.com/topics/planning/01a.asp
18. http://spb.designschool.ru/study/web-dizajn/
19. http://www.profi.ua/prof/view/7/
20. http://prof.biografguru.ru/about/programmist/?q=3000&dp=130
21. http://itstudy.ru/news.php?tip=3&id=1164
22. http://www.ucheba.ru/prof/497.html
23. http://joomlovod.ru/xxx/329-texnicheskij-analiz-sajta.html
24. http://swsait.ru/s-chego-nachat-sozdanie-sajta/sposoby-sozdaniya-sajta.html
Технологическая карта урока
|
этап |
Деятельность учителя, педагога |
Деятельность ученика, воспитанника |
Формируемые компетенции, универсальные учебные действия |
Методические, технологические приёмы |
Прогнозируемый результат |
|
Организационный момент. |
Приветствует учащихся с целью создания благоприятной атмосферы урока. |
Слушают, наблюдают, настраиваются на восприятие материала урока. |
беседа |
Понимание темы и цели урока. |
|
|
Актуализация знаний |
Организует деятельность обучающихся по выявлению способов решения учебной задачи: определению способа получения недостающих знаний и перечня тех источников, в которых они могут быть найдены. Побуждает к принятию наиболее рационального способа действий |
Ищут способы решения учебной задачи: выявляют источники получения недостающих знаний, способы разработки новых знаний; определяют план дальнейших действий |
коммуникативная компетенция, через диалог Социокультурная компетенция, через знакомство с профессиями
|
Проблемная беседа |
Составленный школьниками вместе с учителем план действий. |
|
Основной этап |
1. Организует самостоятельную деятельность школьников по приобретению ими необходимых знаний.
|
осуществляют самостоятельную деятельность по приобретению необходимых знаний. |
Учебно-познавательная, через организацию планирования, оформление результатов деятельности. коммуникативная компетенция, через работу в микрогруппе. Информационная компетенция через самостоятельный анализ, отбор, систематизацию информации. |
Работа в группах. Организация самостоятельной деятельности, работа с интернет - ресурсами; общение друг с другом с целью обмена учебной информацией. |
Необходимая информация выбрана. Содержание представленных сайтов проанализировано, составлен отчет. Познакомлены с профессиями и найдена информация о том, где можно получить эту профессию. |
|
2. Предлагает выступить представителям групп и оценить работу учащихся в соответствии с критериями.
|
От каждой группы выступает представитель с итогами своей работы Учащиеся оценивают друг друга.
|
коммуникативная компетенция через представление результатов деятельности в форме устного сообщения |
Взаимооценка, представление итогов деятельности |
Представлены итоги работы и оценена деятельность друг друга. |
|
|
Итог урока |
Вновь предлагает вернуться к проблемному вопросу От чего зависит успех сайта? |
Предлагают варианты ответов |
Учебно-познавательная компетенции, через формулирование выводов |
проблемный вопрос |
Ответили на вопрос. |
План-конспект урока информатики
10 класс
Тема урока
«Web-дизайн. Юзабилити»
Цели урока:
Развивающие цели:
1. Развитие социокультурной компетенции через знакомство со сведениями о некоторых профессиях.
2. Развитие учебно-познавательной компетенции через устное выступление о результатах своего исследования.
3. Развитие коммуникативной компетенции через работу в группе.
4. Развитие информационной компетенции через умение работать с информацией в сети Интернет (поиск, анализ и отбор информации).
Образовательные цели:
1. Познакомить учащихся с понятием Юзабилити.
2. Формировать практические навыки учащихся при работе с Интернет – ресурсами.
Воспитательные цели:
Воспитание информационной культуры, ответственности за общее дело.
Ход урока:
1. Орг. момент
2. Актуализация знаний
1. (слайд 2) Возьмем стакан и кружку. Нальем в них горячий чай. Из чего вы предпочтете выпить чай? Почему?
Ответы детей
Вот один умный и хороший человек и придумал к ней ручку. Современные разработчики пошли дальше, и сделали эту ручку ребристой, чтобы не скользила в ладони, т.е. сделал кружку удобную в использовании. В переводе на английский язык "использование" – usability.
(слайд 2) В настоящее время в сфере компьютеров и интернет понятие Юзабилити получило широкое распространение. Например, про удобство меню сайта или интерфейса программы можно сказать, что программа имеет качественный юзабилити.
(слайд 3) Скажите пожалуйста, чему равна
ü площадь городских земель Губахи в пределах городской черты;
ü численность населения города Губахи;
ü состояние здоровья населения города
Затрудняетесь ответить, а где мы можем получить эту информацию?
Ответы детей (библиотека, музей, Интернет).
Правильно, в интернете на различных сайтах.
А в чем заключается юзабилити сайтов? (удобство в обращении, дружественный интерфейс, в сети юзабилити сайта является одним из главных условий выживания. Если с сайтом трудно работать, посетители просто уходят с него).
Современный web-дизайн становится более четким и лаконичным. Однако часто заказчик стремится к красоте, нежели к удобству. Возможно ли совместить в дизайне сайта удобство и красоту, и разрешить извечный конфликт физиков и лириков? Любой сайт должен быть удобным для пользователя, т.е. быть в юзабилити и популярным.
3. Основной этап
(слайд 4) Давайте представим, что мы с вами сотрудники веб - студии, специализирующейся на разработке web-сайтов. Разработка web-сайта – это интересный, но, в то же время сложный и трудоёмкий процесс, в котором принимают участие различные web-специалисты.
Вам предстоит:
1) побывать в роли таких специалистов, узнать их функционал и значимость в успехе сайта, где можно получить данную профессию
2) с помощью анализа оценить некоторые сайты Губахи согласно необходимым требованиям.
(слайд 5) Сайтов о Губахе достаточное количество, но все ли они востребованы и имеют качественный юзабилити?
От чего зависит успех сайта?
ЗАДАНИЕ
1. Разбейтесь на микрогруппы по 3 человека в каждой, согласно профессии (по цветным карточкам)
Красные Программист.
Зеленые Специалист по юзабилити.
Желтые Web-дизайнер.
Синие Архитектор.
2. Каждая группа будет выполнять определённые задания, справиться с которыми вам поможет технологическая карта. В своей микрогруппе распределите выполнение заданий, согласно тех. карте
3. После выполнения всех заданий группы отчитываются о проделанной работе, обсуждают результаты работы.
1) Работа в группах
Задание специалистам по юзабилити
Вы – юзабилити специалисты. Ваша задача ответить на поставленные вопросы и заполнить технологическую карту.
1. Чем занимаются юзабилити специалисты?
http://planetahr.ru/publication/3773
http://www.facebook.com/note.php?note_id=208378145890697
http://www.webeffector.ru/wiki/%D0%AE%D0%B7%D0%B0%D0%B1%D0%B8%D0%BB%D0%B8%D1%82%D0%B8
2. Где можно получить специальность юзабилити специалиста?
http://shkolazhizni.ru/archive/0/n-16813/
http://www.edu-all.ru/vc_scripts/selinfo.asp?ident=5936&type=6
3. Дайте оценку сайтам с точки зрения юзабилити специалиста. Если пункт отсутствует на сайте, то поставьте прочерк. (тех.карта, эл.вариант в сетевом окружении-«отчет»-«юзабилити специалист»). Сделайте вывод.
Форма отчета юзабилити специалиста:
1) Презентация (1 слайд - деятельность юзабилити специалиста, 2 слайд - где можно получить специальность юзабилити специалиста);
2) Заполненная тех. карта.
Отчет сохранить в сетевом окружении, в папке «отчет» - «юзабилити специалист».
Технологическая карта
Юзабилити специалист.
Проведите анализ одного из сайтов г.Губахи. Переходя по ссылкам, заполните таблицу. Если данный критерий отсутствует, то поставьте прочерк. Результаты анализа представить на обсуждение.
|
№ п/п |
критерии |
|||
|
1. |
место сайта в общем рейтинге |
|
|
|
|
2. |
количество просмотренных веб-страниц, количество посетителей; |
|
|
|
|
3. |
аудитория сайта (уникальные, постоянные посетители и т. д.) |
|
|
|
|
4. |
время, проведенное на веб-странице посетителем, |
|
|
|
|
5. |
удобство навигации сайта для посетителей (да, нет) |
|
|
|
|
6. |
индекс популярности |
|
|
|
Задание для Web-дизайнеров
Вы – web-дизайнеры. Ваша задача ответить на поставленные вопросы и заполнить технологическую карту.
1. Чем занимаются Web-дизайнеры?
http://www.ucheba.ru/prof/40.html
2. Где можно получить специальность web дизайнера?
http://www.ucheba.ru/vuz/9309/prof/8055.html
http://pda.teron.ru/index.php?showtopic=658162
3. Заполните технологическую карту.
4. В оценочном листе выполните самооценку.
Форма отчета веб-дизайнеров:
1) Презентация (1 слайд - деятельность веб-дизайнера, 2 слайд - где можно получить специальность веб-дизайнера);
2) Заполненная тех. карта.
Отчет сохранить в сетевом окружении, в папке «отчет» - «веб-дизайнер».
3) В оценочном листе выполните самооценку
Дизайн сайта – это совокупность графических элементов, шрифтов и цветов, реализованных на сайте.
Любой сайт предназначен для людей, поэтому эффективность и успешность разработанного дизайна будет определяться удобством и комфортабельностью его использования. Примеры хороших, грамотных сайтов: http://sitecritic.ru/kriterii-kachestvennogo-dizajna-sajta/
Основная задача дизайна сайта - объединение всех информационных
блоков и формирование у посетителя приятного впечатления. По сути, дизайн
задаёт общий стиль вашего сайта, помогает посетителю с первого взгляда понять,
что его здесь ждёт. Грамотно разработанный дизайн является одним из важнейших
факторов, определяющих посещаемость вашей веб-страницы.
задание архитекторам
Вы – информационные архитекторы.
Ваша задача – ответить на поставленные вопросы и заполнить технологическую карту.
1. Чем занимаются Web-архитекторы?
2) http://www.redbee.ru/articles/detail.php?ID=966
3) http://www.webmascon.com/topics/planning/01a.asp
2. Где можно получить специальность web архитектора?
2) http://spb.designschool.ru/study/web-dizajn/
3. Заполните технологическую карту:
Технологическая карта web-архитекторы
Форма отчета web-архитекторов:
4) Презентация (1 слайд - деятельность веб-архитектора, 2 слайд - где можно получить специальность веб-архитектора);
5) Заполненная тех. карта.
Отчет сохранить в сетевом окружении, в папке «отчет» - «веб-архитекторы».
6) В оценочном листе выполните самооценку.
Web- программист
Вы – web-программисты. Ваша задача ответить на поставленные вопросы и заполнить таблицу.
1. Чем занимаются Web-программисты?
http://www.profi.ua/prof/view/7/
http://prof.biografguru.ru/about/programmist/?q=3000&dp=130
2. Где можно получить специальность web программиста?
http://itstudy.ru/news.php?tip=3&id=1164
http://www.ucheba.ru/prof/497.html
Критерии влияющие на работоспособность веб ресурса
используя материалы сайтов заполните таблицу:
http://joomlovod.ru/xxx/329-texnicheskij-analiz-sajta.html
http://swsait.ru/s-chego-nachat-sozdanie-sajta/sposoby-sozdaniya-sajta.html
|
№ п/п |
критерий |
плюсы |
минусы |
Какой критерий выбрали бы вы? |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Форма отчета web-программистов:
1) Презентация (1 слайд - деятельность веб-программиста, 2 слайд - где можно получить специальность веб-программиста);
2) Заполненная таблица.
Отчет сохранить в сетевом окружении, в папке «отчет» - «веб-программисты».
3) В оценочном листе выполните самооценку.
Оценочный лист
Оцените каждый критерий по пятибалльной системе
|
Критерий |
самооценка |
Оценка учителя |
|
Выбор нужной информации. Умение кратко представить . Анализ информации. |
|
|
|
Создание презентации, дизайн. |
|
|
|
Четкость и грамотность представления ответа. |
|
|
|
13-15 баллов – «5» 10-12 баллов – «4» 7-9 баллов – «3» |
|
|
Вернемся к вопросу: от чего же зависит успех сайта?
Ответы детей
Успех вашей совместной деятельности зависел от грамотной, слаженной работы в команде. И вы добились хороших результатов. Вы оценили работу каждой группы, результаты я посмотрю, и передам Наталье Алексеевна.
Ответы учеников.
Кого то заинтересовали профессии связанные с сайтостроением? Все материалы вашей работы я сохраню и если возникнет желание ознакомиться с ними, приходите.
Спасибо. До свидания.
Профессия: Преподаватель математики и информатики
В каталоге 7 738 курсов по разным направлениям