HTML Academy. Интерактивные онлайн-курсы по HTML и CSS

Доклад для конференции ИТМО, в котором рассказывается об основных особенностях HTML Academy. Подробно описаны интерактивные обучающие интерфейсы курсов.

Transcript

1. http://htmlacademy.ru ИНТЕРАКТИВНЫЕ ОНЛАЙН-КУРСЫ ПО HTML И CSS Першин А.А. 2013 Cанкт-Петербургский национальный исследовательский университет информационных технологий, механики и оптики
2. http://htmlacademy.ru ЭВОЛЮЦИЯ СОДЕРЖАНИЯ ОНЛАЙН- КУРСОВ Текст и изображения (Moodle) Видеокурсы (Coursera) Интерактивные курсы (Codeacademy) Видео плюс интерактив (Treehouse)
3. http://htmlacademy.ru MOODLE moodle.org
4. http://htmlacademy.ru COURSERA coursera.org
5. http://htmlacademy.ru CODEACADEMY codecademy.com
6. http://htmlacademy.ru TREEHOUSE teamtreehouse.com
7. http://htmlacademy.ru HTML ACADEMY htmlacademy.ru
8. http://htmlacademy.ru АКТУАЛЬНОСТЬ Нехватка квалифицированных верстальщиков и фронтэнд-разработчиков Верстальщик — HTML, CSS Фронтэнд-разработчик — HTML, CSS, JavaScript
9. http://htmlacademy.ru АКТУАЛЬНОСТЬ
10. http://htmlacademy.ru ПРИНЦИПЫ Учить работать с реальным кодом На задачах, приближены к реальным Заинтересовывать и увлекать Пропагандировать веб-технологии От новичка до трудоустроенного профессионала
11. http://htmlacademy.ru ОСОБЕННОСТИ Упор на практику Интерактивность Работа в режиме реального времени Использование игровых механик
12. http://htmlacademy.ru ИНТЕРАКТИВНОЕ ЗАДАНИЕ
13. http://htmlacademy.ru ИНТЕРАКТИВНОЕ ЗАДАНИЕ Краткая теория
14. http://htmlacademy.ru ИНТЕРАКТИВНОЕ ЗАДАНИЕ Цели задания
15. http://htmlacademy.ru ИНТЕРАКТИВНОЕ ЗАДАНИЕ Редакторы кода
16. http://htmlacademy.ru ИНТЕРАКТИВНОЕ ЗАДАНИЕ ] Мини-браузер
17. http://htmlacademy.ru ИНТЕРАКТИВНОЕ ЗАДАНИЕ Исходное состояние
18. http://htmlacademy.ru ИНТЕРАКТИВНОЕ ЗАДАНИЕ 1 цель выполнена
19. http://htmlacademy.ru ИНТЕРАКТИВНОЕ ЗАДАНИЕ Задание выполнено
20. http://htmlacademy.ru ИСПЫТАНИЕ Интерфейс испытания
21. http://htmlacademy.ru ИСПЫТАНИЕ Процент выполнения
22. http://htmlacademy.ru ИСПЫТАНИЕ Образец
23. http://htmlacademy.ru ИСПЫТАНИЕ Испытание пройдено
24. http://htmlacademy.ru ИСПЫТАНИЕ Различия
25. http://htmlacademy.ru ИСПЫТАНИЕ Идеальное прохождение
26. http://htmlacademy.ru СТРУКТУРЫ КУРСА Только задания З-З-З Курс с итоговым испытанием З-З-З-И Курс с промежуточными испытаниями З-З-И-З-З-И
27. http://htmlacademy.ru ИНТЕРАКТИВНАЯ ДЕМОНСТРАЦИЯ Вкладка HTML
28. http://htmlacademy.ru ИНТЕРАКТИВНАЯ ДЕМОНСТРАЦИЯ Вкладка CSS
29. http://htmlacademy.ru ИНТЕРАКТИВНАЯ ДЕМОНСТРАЦИЯ Выделена часть кода
30. http://htmlacademy.ru ИНТЕРАКТИВНАЯ ДЕМОНСТРАЦИЯ Выделена часть кода
31. http://htmlacademy.ru ТЕХНИЧЕСКАЯ РЕАЛИЗАЦИЯ JavaScript Ace editor http://ace.ajax.org <iframe> CutyСapt (обёртка для WebKit) http://cutycapt.sourceforge.net LAMP
32. http://htmlacademy.ru ИГРОВЫЕ МЕХАНИКИ (ИГРОИЗАЦИЯ) Задания —> квест Испытание —> босс, перфекционизм Достижения —> награда Рейтинг —> статус Очки —> награда, валюта
33. http://htmlacademy.ru ЭКСПЕРИМЕНТ Проверить, влияют ли игровые механики на процесс обучения и если влияют, то насколько сильно. Можно измерять: Количество времени, потраченное на курс Процент прохождения курса Качество прохождения (как выполнены испытания) Скорость прохождения курса
34. http://htmlacademy.ru ПРАКТИЧЕСКОЕ ПРИМЕНЕНИЕ У студентов 3 курса НИУ ИТМО на дисциплине "Информационные технологии" В открытом доступе для всех желающих
35. http://htmlacademy.ru ТЕКУЩАЯ СТАТИСТИКА 8 из 16 курсов базового цикла 2 демонстрации более 250 пользователей выполнено более 8500 заданий получено более 1300 достижений
36. http://htmlacademy.ru Спасибо за внимание