Нестандартний урок «Графіка для веб-середовища» (10-11 клас)

Про матеріал
Розділ курсу: Графіка та мультимедіа для веб-середовища Тема уроку: Нестандартний урок «Графіка для веб-середовища» (10-11 клас) Мета: навчальна: сформувати знання учнів про графіку для веб-середовища, сформувати поняття про типи графічних файлів для веб-середовища, які застосовуються у веб-дизайні. виховна: виховувати інформаційну культуру, формувати позитивне ставлення до навчання розвивальна: розвивати пізнавальний інтерес учнів, комп'ютерну грамотність учнів Тип уроку: урок засвоєння нових знань.
Перегляд файлу

Розділ курсу: Графіка та мультимедіа для веб-середовища

Тема уроку: Нестандартний урок «Графіка для веб-середовища»

Мета:

навчальна: сформувати знання учнів про графіку для веб-середовища, сформувати поняття про типи графічних файлів для веб-середовища, які застосовуються у веб-дизайні.

виховна: виховувати інформаційну культуру, формувати позитивне ставлення до навчання

розвивальна: розвивати пізнавальний інтерес учнів, комп'ютерну грамотність учнів

Тип уроку: урок засвоєння нових знань.

Форма проведення уроку: індивідуальна.

Обладнання: телефон/ноутбук/комп’ютер з підключенням до мережі Інтернет, сайт з завданнями «Графіка для веб-середовища», конспект.

Програмне забезпечення: Google Chrome

Підручник: Речич Н.В. Інформатика : вебтехнології (вибірковий модуль для 10-11 класів, рівень стандарту) / Н.В. Речич. - Харків: Вид-во «Ранок» , 2020

Етапи уроку:

  1. Організаційний момент.
  2. Мотивація веб-квесту.
  3. Організація роботи у веб-квесті.
  4. Основна частина:
  1. Завдання 1.
  2. Завдання 2.
  3. Завдання 3.
  4. Завдання 4.
  5. Завдання 5.
  6. Завдання 6.
  1. Представлення результатів роботи.
  2. Підведення підсумків уроку. Оцінювання учнів.
  3. Рефлексія.

Хід уроку

  1. Організаційний момент. (5 хв.)

Привітання з учня. Відмічення хто присутній на уроці. Перевірка готовності учнів до уроку.

Вчитель: Діти, перед тим як ви розпочнете проходити веб-квест, згадаємо правила роботи за комп'ютером (учні по одному відповідають на питання вчителя).

Вчитель: Ви молодці! А зараз розпочинаємо урок, сьогоднішній урок ми проведемо у вигляді веб-квесту.

  1. Мотивація веб-квесту. (3 хв.)

Посилання на сайт веб-квесту: https://sites.google.com/view/webquest-graphicsinaweb/%D0%B3%D0%BE%D0%BB%D0%BE%D0%B2%D0%BD%D0%B0-%D1%81%D1%82%D0%BE%D1%80%D1%96%D0%BD%D0%BA%D0%B0

Веб-сторінка мертва без графіки. Графічні зображення використовуються для ілюстрації текстів упродовж багатьох століть. Ще на перших рукописних пергаментних свитах, виявлених вченими-археологами в руїнах міст старовини, були знайдені зроблені рукою давноминулих в небуття художників малюнки, що несуть як пояснювальну, так і чисто декоративну функцію. З винаходом друкарства ілюстрації стали невід'ємною частиною практично будь-яких книг, не лише художніх, але і наукових. Пройшовши нелегкий шлях від багатосторінкових рукописів до перших книг, віддрукованих на друкарських машинах, в другій половині XX століття носії інформації набули ще однієї форми, на сьогодні найзручнішої для зберігання і представлення людських знань, - електронної, перенісши з собою у світ двійкових чисел і графіку. А з появою мережі Інтернет, що дозволила зробити цю інформацію доступною для усього людства, графічні ілюстрації, що супроводжують текст, отримали своє друге народження, оскільки автор кожного мережевого ресурсу може сам вибирати для свого проекту будь-яке оформлення, що відповідає його естетичним смакам.

Безумовно, перші сайти, що з'явилися ще в епоху становлення Всесвітньої мережі, були строгими текстовими документами, головним і єдиним компонентом яких було їх змістовне інформаційне наповнення. Йшов час, і у міру того, як складалися загальноприйняті нині в Інтернеті стандарти на графічні зображення, чаша дизайнерських вагів схилялася убік добре ілюстрованих ресурсів, що притягають відвідувачів своєю барвистістю і яскравим оформленням. В ті часи це було в новинку, і подібно до строкатої вітрини магазину, такі сайти привертали увагу глядача неординарністю представлення контенту і нестандартністю оформлення. Деякі ресурси виявилися буквально переобтяжені графікою, якій іноді було навіть більше, ніж власне тексту.

Саме тому сьогодні у цьому веб-квесті, ви дізнаєтеся про те, яка буває графіка у веб-середовищах, поради від фахівців як гарно створити графіку і не тільки, наше заняття ми присвятимо темі «Графіка у веб-середовищах». Спробуємо дослідити позитивні і негативні наслідки графік.

  1. Організація роботи у веб-квесті. (2 хв.)

Для проходження веб-квесту учні проходять індивідуально. Завдання веб-квесту є окремими блоками питань, в яких є перелічені інтернет-ресурси, де можна отримати необхідну інформацію. Питання сформульовані так, що при перегляді сайту учень був вимушений робити підбір матеріалу, виділивши головне з тієї інформації, яку він знаходить і читає. Після завершення роботи над квестом проводиться оцінювання роботи учня і рефлексія.

  1. Основна частина. (30 хв.)

На сайті ви бачите завдання, які потрібно виконати. Тому ви вже можете розпочати виконувати веб-квест. Якщо у вас виникають якісь питання, то питайте. Удачі вам!

Завдання 1. Виконайте завдання:

- Складіть пазл, зробіть скріншот і перешліть його на електронну скриньку вчителя інформатики

Це завдання - на швидкість виконання. Але зверніть увагу: повнота відповіді при цьому не повинна постраждати!

Виграє найповніша і тоді вже найшвидша відповідь.

Посилання: https://www.jigsawplanet.com/?rc=play&pid=37dbdec5633b

Завдання 2. Перегляньте презентацію і дайте письмові відповіді на запитання.

Презентація: https://drive.google.com/file/d/1UinIZ0xH9X1OAxqebG2w_TPivFV-Nfzp/view

Питання:

  1. Для чого використовують графіку на web-сторінках?
  2. Які є основні формати графічних файлів у веб-дизайні?
  3. Що таке формат JPEG?
  4. Що таке формат GIF?
  5. Що таке формат PNG?
  6. Що таке формат SVG?
  7. Які основний синтаксис додавання зображень на сторінку?
  8. Графічні файли яких форматів використовують для розміщення на веб сторінках в інтернеті?
  9. Які переваги та недоліки растрових і векторних зображень?

Завдання 3. Дайте відповіді на запитання тесту

Посилання: https://forms.gle/7CHd3CL7jg6qhuSPA

Завдання 4. Розгадай ребус!

Хто зображений на картинці і що ця людина створила?

Відповідь: Les Horribles Cernettes, одне з перших зображень в Інтернеті

Завдання 5. Перегляньте статтю та сформулюйте поради щодо створення графіки для веб-середовища.

Посилання: https://alexsmokinof.lviv.ua/%D1%81%D1%82%D0%B2%D0%BE%D1%80%D0%B5%D0%BD%D0%BD%D1%8F-%D1%81%D0%B0%D0%B9%D1%82%D1%83-7-%D0%BF%D0%BE%D1%80%D0%B0%D0%B4-%D0%B4%D0%BB%D1%8F-%D1%82%D0%B8%D1%85-%D1%85%D1%82%D0%BE-%D0%B2%D0%B8%D1%80/

Завдання 6. Підготуйте презентацію (або реферат, або публікацію, бюлетень) на тему " Графіка для веб-середовища " і розмістить на інтерактивну дошку, яка знаходиться нижче (натиснути "+ " і завантажити файл), не забудьте підписати роботу. Бажаю успіхів!

Посилання: https://padlet.com/sofianastusenko/padlet-xo1obnrzmqyexips

  1. Представлення результатів роботи. (1 хв.)

Критерії оцінювання

Завдання 1. Пазл - від 0 до 6 балів

Всього: 6 б

Завдання 2. Кожне завдання 1 балу.

Всього: 9 б

Завдання 3. Тест - 12 балів

Завдання 4. Ребус і людина – 12 балів

Завдання 5. Поради - 16 балів

Завдання 6. Виконання роботи і розміщення на дошці - 25 балів

Максимальна кількість балів за квест - 80 балів.

Оцінка:

0-20 балів - початковий рівень    (1-3 б.)

21-40 балів - середній рівень       (4-6 б.)

41-60 балів - достатній рівень     (7-9 б.)

61-80 балів - високий рівень       (10-12 б.)

  1. Підведення підсумків. Оцінювання учнів. (3 хв.)

Ось ви пройшли веб-квест «Графіка для веб-середовища». Ви молодці! Вчитель оцінює роботи учнів і каже оцінки.

  1. Рефлексія. (1 хв.)

Анкета «Зворотний зв'язок». Діти відповідають на запитання вчителя в Google Формі.

Середня оцінка розробки
Структурованість
5.0
Оригінальність викладу
5.0
Відповідність темі
5.0
Загальна:
5.0
Всього відгуків: 1
Оцінки та відгуки
  1. Літвінова Ірина Леонідівна
    Доброго дня! трохи не зрозуміли ребус. На фото зображений Сільвано Дженнаро, а у відповіді до ребусу зовсім інша назна на англ. мові. Чи можна трохи роз'яснити? Дякую!
    Загальна:
    5.0
    Структурованість
    5.0
    Оригінальність викладу
    5.0
    Відповідність темі
    5.0
docx
Додано
29 червня 2023
Переглядів
1225
Оцінка розробки
5.0 (1 відгук)
Безкоштовний сертифікат
про публікацію авторської розробки
Щоб отримати, додайте розробку

Додати розробку