18 практика

Практическое занятие 18 Тема: Применение интернет-технологий в образовательной деятельности учителя   Задание 1. Создайте интеллект-карту  1) по одному из примеров, 2) по теме своего творческого задания.  Опубликуйте интеллект-карты на отдельных страницах сайта и на слайдах презентации. 

• 1. Перейти. Е.А. Еремин, К.Ю. Поляков, Применение карт взаимосвязи понятий учебного материала // Информатика, № 9, 2015, с. 24-28.

  2. Перейти. К.Ю. Поляков, Е.А. Еремин. Компьютерные сети // Информатика, № 5, 2015, с. 16-28.

  3. Перейти. К.Ю. Поляков, Е.А. Еремин. Мультимедиа // Информатика, № 5, 2015, с. 4-15.

Бесплатные онлайн-ресурсы для создания интеллект-карт:  а) MindMeister (www.mindmeister.com); б) MindMup (https://www.mindmup.com); в) XMind (http://www.xmind.net); г) MindJet Mindmanager (http://www.mindjet.com); д) iMindMap (https://imindmap.com).  Задание 2. Изучить онлайн среду Web-разработки codepen.io

• 1. Создать 2 примера с фрагментами своего сайта. Опубликовать ссылки на примеры на главной странице своего сайта на Web-хостинге.

  2. Перейти: codepen.io Онлайн-редактор кода HTML, CSS, JavaScript

Задание 3. В отчете указать использованные команды HTML, CSS, назначение этих команд.

• 1. Практическая работа 9. Табличная верстка сайта в шаблоне документа table.htm

  2. Перейти. Веб-дизайн: практикум

  3. Скачать. Шаблоны сайтов для практикума по веб-дизайну.

  4. Опубликовать сайт на Web-хостинге. Организовать систему навигации с главной страницей сайта.

План занятий 16 - 19 1. Эффект параллакса 2. Интеллект-карта 3. codepen.io 4. Canvas: http://ifizmat.000webhostapp.com/canvas/lab-01.htm 5. FlexBox 6. CSS: template 7. SVG 8. MAnim

Дополнительное задание

Изучите систему математической анимации по следующим ссылкам. Создайте несколько примеров анимации математических понятий, законов или решений задач.

• 1. youtube.com. Manim tutorial | Introduction: What is Manim?

  2. Скачать. tutorial_english.zip

  3. github.com. AnimationsWithManim

Источники

Основные

• 1. Перейти. SVG Visual Cheat Sheet.

  2. Перейти. SVG cheat sheet.

  3. Перейти. SVG — Scalable Vector Graphics.

  4. Перейти. Структура SVG-файла.

  5. Перейти. SVG – Scalable Vector Graphics.

  6. Перейти. Рисунки SVG чистым кодом.

  7. Перейти. SVG: группировка и переиспользование элементов.

  8. Перейти. Рисуем стрелки при помощи Marker.

  9. sourceforge.net: XAMPP - Browse /XAMPP Windows at SourceForge.net

  10. apachefriends.org: Download XAMPP

  11. ipipe.ru: Установка XAMPP. Пошагово: скачивание, установка, запуск.

  12. artlebedev.ru: .ру/Ководство — студия дизайна Артемия Лебедева

  13. html5book.ru: HTML, CSS, JavaScript и jQuery

  14. htmlbook.ru: Для тех, кто делает сайты

  15. Роботландский университет: Дуванов А.А.

  16. robotlandia.ru: Роботландский университет Дуванов А.А.

  17. ucoz.ru: Роботландский университет Дуванов А.А.

  18. css.manual.ru: HTML, CSS

  19. codepen.io: Онлайн-редактор кода HTML, CSS, JavaScript

  20. jsfiddle.net: Онлайн-редактор кода HTML, CSS, JavaScript

  21. nic.ru: Whois сервис

  22. reg.ru: Регистрация доменов

Дополнительные

• 1. w3schools.com: W3.CSS Template. Примеры дизайна сайтов.

  2. ruseller.com: Топ 10 бесплатных хостингов

  3. ruseller.com: 20 ресурсов для прототипирования

  4. ruseller.com: Простая техника эффекта параллакса

  5. ruseller.com: 28 сайтов с эффектом параллакса

  6. thisstartupdoesnotexist.com: Neural network web designer

  7. thiscatdoesnotexist.com: Neural network cats photo-artist

  8. thispersondoesnotexist.com: Neural network people photo-artist

  9. hi-tech.mail.ru: Нейросеть начала создавать «фейковые» сайты

  10. hi-tech.mail.ru: Нейросеть научилась создавать фотографии фейковых котов

  11. hi-tech.mail.ru: Нейросеть научилась создавать фотографии несуществующих людей

  12. emosurf.com: Мы готовим детей к позавчерашнему миру

  13. pravmir.ru: Людмила Петрановская: Мы готовим детей к позавчерашнему миру