6. Funkcjonowanie e-lekcji
6.1. Poruszanie się po kolejnych lekcjach
Wygląd głównej strony internetowej przedstawia poniższy rysunek. Jest to widok „okładki” e-lekcji, gdzie główną uwagę zwraca temat pracy.
Rysunek 9. Strona główna e-lekcji
Rysunek 10. Menu główne e-lekcji
Kliknięcie w napis „e-lekcja fizyki | elektrostatyka”
spowoduje przejście do strony głównej e-lekcji.
Funkcjonowanie e-lekcji
4 0
Główne menu e-lekcji fizyki zostało umieszczone na górze strony. Pozwala ono w szybki i łatwy sposób na poruszad się po witrynie. Oferuje ono dostęp do trzech działów:
Po wejściu w tryb nauki za pomocą przycisku „rozpocznij naukę”
znajdującego się na głównej stronie pojawia się również dodatkowe menu, w którym uzyskujemy dostęp do kolejnych części lekcji.
Menu rozwija się kolejno wraz ze stopniem zaawansowania nauki.
Rysunek 11. Menu boczne
Na rysunku powyżej przedstawione jest „zwinięte” menu boczne e-lekcji. Po kliknięciu na którykolwiek z tematów menu rozwija się, ukazując tematy związane z danym zagadnieniem do których możemy dostad się po kliknięciu na nich
Funkcjonowanie e-lekcji
4 1
Dodatkowo na każdej stronie został umieszczony prosty system nawigacji, pozwalający w szybki sposób na poruszanie się do przodu/tyłu po dostępnych lekcjach.
Rysunek 12. Dwa dodatkowe sposoby poruszania się po e-lekcji
Sposób poruszania się po e-lekcji, jej wygląd oraz specyficzne rozwiązania są wynikiem współpracy autora z Joanną Niedźwiedzką. Ciągłe konsultacje treści oraz strony technicznej przedsięwzięcia pozwoliły na osiągnięcie obecnego stanu, w jakim znajduje się omawiana e-lekcja.
Funkcjonowanie e-lekcji
4 2
6.2. Zawartość e-lekcji
Opisywana e-lekcja składa się z 5 rozdziałów, w których znajduje się łącznie 17 podrozdziałów. Poniżej przedstawiono schematycznie mapę witryny z zaznaczonymi rozdziałami głównymi e-lekcji oraz mapę trybu nauki.
Rysunek 13. Skrócona mapa witryny Strona główna
Funkcjonowanie e-lekcji
4 3
Rysunek 14. Mapa trybu nauki Nauka
Funkcjonowanie e-lekcji
4 4
6.3. Prezentacja zagadnień i sposoby korzystania z kursu
Cały materiał e-lekcji, jak już wspomniano wcześniej został podzielony na 5 rozdziałów, w których znajdują się poszczególne lekcje. Student powinien studiowad je po kolei i przechodzid do następnego rozdziału dopiero gdy upewnił się, że rozumie materiał z poprzedniego. Ma to istotne znaczenie bo z wniosków i informacji z danego rozdziału będzie wielokrotnie korzystał w następnych lekcjach.
Podczas czytania student powinien zwrócid uwagę na specjalne oznaczenia (ikonki, kolorystykę) umieszczone w tekście. Mają one na celu zwrócid jego uwagę na najistotniejsze elementy takie jak:
Definicje
Prawa, zasady, twierdzenia Jednostki.
Dodatkowo elementy najistotniejsze dla zrozumienia i opanowaniu materiału zostały wyszczególnione pogrubioną czcionką. Należy zwrócid na nie szczególną uwagę.
6.3.1. Multimedia
Prezentowane materiały są ilustrowane zdjęciami,
prostymi animacjami komputerowymi, filmami oraz bardziej rozbudowanymi
programami (symulacjami komputerowymi).
Funkcjonowanie e-lekcji
4 5
O ile animacje komputerowe zostały przygotowane w możliwie prostej formie, tak że ich rozmiar pozwala na oglądanie ich "przez Internet" w czasie rzeczywistym, to programy są znacznie pokaźniejsze i uruchomienie ich z serwera może byd kłopotliwe. Istnieje jednak możliwośd zapisania ich (ściągnięcia) na lokalnym dysku i uruchomienia z własnego komputera. Program
„Pole elektrostatyczne” został napisany przez Bartosza Dudę, autora niniejszej pracy dyplomowej.
6.3.2. Zadania
W omawianej e-lekcji zostały również zamieszczone zadania podzielone na dwie kategorie: zadania testowe oraz dłuższe zadania z treścią. Mają one różny charakter i różny stopieo trudności. Poprawnie zrobione zadanie stanowi cenne uzupełnienie wiadomości teoretycznych zgromadzonych w e-lekcji.
Test napisany jest w formie interaktywnej – student pytanie po pytaniu może uczyd się odpowiedzi na poszczególne zagadnienia. Kolejne kroki rozwiązywania testu pokazują poniższe rysunki.
Zanim zaczniemy odpowiadad na pytanie należy je dokładnie przeczytad.
Rysunek 15. Brak zaznaczonej odpowiedzi
Funkcjonowanie e-lekcji
4 6
Gdy zapoznamy się już z treścią zadania odpowiadamy na pytanie klikając w wybraną przez nas odpowiedź. Jeśli jest ona błędna wyśietli nam się ikona oznaczająca błąd i jednocześnie zobaczymy która odpowiedź jest prawidłowa.
Rysunek 16. Zaznaczona odpowiedź nieprawidłowa
Nie należy się oczywiście przejmowad początkowym niepowodzeniem, na pewno za drugim razem pójdzie już lepiej i zobaczymy sytuację przedstawioną na rysunku poniżej.
Rysunek 17. Zaznaczona prawidłowa odpowiedź
Na samym koocu testu widzimy dwa przyciski:
Rysunek 18. Opcje testu
ikona nieprawidłowej odpowiedzi
zaznaczona odpowiedź
odpowiedź prawidłowa
zaznaczona odpowiedź
ikona prawidłowej odpowiedzi
Funkcjonowanie e-lekcji
4 7
Przycisk „Pokaż wynik” wyświetli bieżące postępy w rozwiązywaniu testu, natomiast „Wyczyśd odpowiedzi” po uprzednim potwierdzeniu, usunie wszystkie zaznaczone przez studenta odpowiedzi.
Po kliknięciu przycisku „Pokaż wynik” wyświetli się informacja o aktualnym stanie rozwiązania testu.
Rysunek 19. Bieżące postępy rozwiązywania testu
Drugi typ zadao to zadania dłuższe z treścią, do których dołączone są krótkie rozwiązania. (Aby je odczytad należy kliknąd polecenie „Pokaż/ukryj odpowiedź”)
Rysunek 20. Zadanie z odpowiedzią
Układ zadao oraz skrypt (napisany w języku JavaScript) pozwalający na rozwiązanie testu został zaprojektowany wspólnie z Joanną Niedźwiedzką.
Przykładowa lekcja
4 8
7. Przykładowa lekcja
7.1. Pole elektryczne – wektor natężenia pola 7.1.1. Wygląd lekcji
Rysunek 21. Wygląd lekcji
dostępne materiały (Hasła, programy oraz filmy)
definicje i ważne fragmenty są
wyróżnione w tekście
łatwy i szybki dostęp do multimediów
Przykładowa lekcja
4 9
Każda lekcja w przejrzysty sposób opowiada o wybranym temacie. Już na pierwszy rzut oka można stwierdzid jakie mamy do dyspozycji materiały multimedialne – w naszym przypadku jest to rysunek przedstawiający obraz linni sił pola dla pola wytworzonego przez ładunek dodatni i ujemny, program wizualizujący pole elektrostatyczne pochodzące od układu ładunków oraz film, na którym zobaczymy doświadczenie ilustrujące rozpatrywany temat.
Po kliknięciu w rysunek zobaczymy jego powiększenie. Możemy łatwo obejrzed nagrany film, po prostu klikając na niego.
Rysunek 22. Powiększenie rysunku
Rysunek 23. Obserwacja przestrzennego obrazu linii sił pola za pomocą "pióropusza" – migawka z filmu
Przykładowa lekcja
5 0
7.1.2. Program „Pole elektrostatyczne”
Program „Pole elektrostatyczne” (autorstwa Bartosza Dudy) dostępny w e-lekcji pozwala wyznaczyd linie sił pola elektrycznego i rozkład potencjału pochodzący od zadanego statycznego rozkładu ładunków. W programie można wczytad jeden z proponowanych układów ładunków (np. dipol) lub utworzyd własny układ ładunków.
7.1.2.1. Wygląd programu
Rysunek 24. Wygląd programu „Pole elektrostatyczne”
Program stanowi pojedyncze okno, na którym można generowad układy ładunków elektrostatycznych, następnie obserwowad linie sił pola wytworzonego przez te ładunki oraz śledzid powierzchnie ekwipotencjalne, jakie tworzą obszary o tym samym potencjale pola.
Przykładowa lekcja
5 1
7.1.2.2. Tworzenie ładunków
Rysunek 25. Menu główne
Aby utworzyd ładunek na powierzchni okna programu klikamy w dowolnym punkcie okna prawym klawiszem myszy i wybieramy interesującą nas pozycję, np. tworzymy ładunek dodatni.
Rysunek 26. Tworzenie ładunku dodatniego
Aby otworzyd menu główne, kliknij na powierzchni okna w dowolnym punkcie prawym klawiszem myszy
Tworzymy ładunek z głównego menu – wybierając opcję „Utwórz ładunek +” lub „Utwórz ładunek –„
Przykładowa lekcja
5 2
Następnie tworzymy ładunek ujemny postępując zgodnie z wcześniejszymi instrukcjami, wybierając jednak polecenie „Utwórz ładunek –„
Rysunek 27. Utworzony ładunek ujemny
W każdym momencie możemy sprawdzid z jakimi ładunkami mamy do czynienia w utworzonym przez nas polu – wystarczy najechad myszką na interesujący nas ładunek, a natychmiast pojawi się okienko w którym zobaczymy wartośd oraz koordynaty naszego ładunku.
Rysunek 28. Właściwości ładunku
Utworzony ładunek ujemny
Przykładowa lekcja
5 3
Możemy łatwo przesuwad ładunki metodą „przeciągnij i upuśd” – w tym celu klikamy lewym przyciskiem myszy na ładunku i trzymając klawisz przesuwamy myszkę, a wraz z nią nasz ładunek w upragnione miejsce. Gdy puścimy klawisz myszki ładunek upadnie w pozycji, gdzie ostatnio znajdował się kursor.
Bardzo łatwo możemy również zmienid właściwości ładunku – wystarczy że klikniemy na niego prawym klawiszem myszki.
Rysunek 29. Zmiana właściwości ładunku
W każdym momencie możemy usunąd ładunek wybierając opcję „Usuo ładunek”
Rysunek 30. Usuwanie ładunku
Przykładowa lekcja
5 4
Równie łatwo można usunąd wszystkie ładunki korzystając z opcji
„Resetuj”. Opcja „Odśwież” może przydad się, gdy z jakiegoś powodu wizualizacja stała się nieczytelna.
7.1.2.3. Wczytywanie/zapisywanie układu ładunków
W programie dostępnych jest kilka predefiniowanych układów ładunków, które dostępne są poprzez opcję „Wczytaj ustawienie ładunków”.
Rysunek 31. Wczytywanie układu ładunków
Rysunek 32. Wczytany układ ładunków
Przykładowa lekcja
5 5
Rysunek 33. Dostępne predefiniowane układy ładunków
Możemy również w prosty sposób zapisad swój układ do formatu obsługiwanego tylko przez program, bądź do bitmapy stosując polecenie
„Zapisz obrazek”.
Rysunek 34. Zapisywanie układu ładunków jako bitmapa
Przykładowa lekcja
5 6
7.1.2.4. Linie sił pola i powierzchnie ekwipotencjalne
Program pozwala wyświetlad również linie sił pola pochodzące od ładunków. Linie sił włączamy poprzez opcję „Wyświetl linie pola” dostępną w menu głównym.
Rysunek 35. Wyświetlanie linii pola
Podsumowanie
5 7
8. Podsumowanie
E-learning to ciągle dośd nowa i szybko rozwijająca się dziedzina w nauczaniu, pozwalająca zdobywad na prestiżowych uniwersytetach wiedzę osobom nawet z najdalszych zakątków świata czy rozszerzyd tradycyjne formy nauczania o nowe technologie czyniąc je bardziej skutecznymi i efektywnymi.
W niniejszej pracy opisałem i porównałem tradycyjne formy nauczania z e-learningiem. Przedstawiłem sytuację, jaka kształtuje się w związku z omawianym tematyem na polskich uczelniach wyższych. Skupiłem się także na metodyce pisania kursów e-learningowych.
W wyniku niniejszej pracy powstała instytucja kształcenia pod tytułem „e-lekcja fizyki | elektrostatyka”, dotycząca wszelkich zagadnieo związanych z szerokim działem fizyki jakim jest właśnie elektrostatyka. Cały przebieg tworzenia tego kursu można podzielid na dwa etapy.
W pierwszym etapie podzieliłem cały materiał na poszczególne działy, przygotowałem całe zaplecze programów, które posłużyły mi do stworzenia najdrobniejszych elementów kursu, między innymi programu „Pole elektrostatyczne”
który został opracowany i napisany w środowisku Borland C++ Builder 4.0.
Opracowałem bazę potrzebnych ilustracji i animacji, a dodatkowo wspólnie z Joanną Niedźwiedzką nakręciliśmy w sali wykładowej nr 322 w budynku A-1 Politechniki Wrocławskiej wiele filmów dydaktycznych obrazujących zjawiska fizyczne charakterystyczne dla opisywanych dziedzin.
W drugim etapie tworzenia kursu zająłem się łączeniem wszystkich przygotowanych materiałów w jedną spójną całośd poprzez stworzenie witryny internetowej w formie interaktywnej lekcji fizyki. Wykorzystałem wiele dostępnych technologii takich jak HTML, CSS, JavaScript, jak i te, które pobrałem ze stron internetowych producentów innych narzędzi wykorzystywanych przeze mnie w pracy.
Do pracy dołączona jest płyta CD-ROM zawierająca utworzony w drugim etapie kurs fizyki, razem ze wszystkimi ilustracjami, animacjami, programami, oraz filmami
Podsumowanie
5 8
dostępnymi w poszczególnych rozdziałach e-lekcji. Przygotowane materiały z pewnością mogą posłużyd za pomoc dydaktyczną na zajęciach fizyki, ponieważ oprócz suchej teorii zawierają wiele interesującyh dodatków, które urozmaicają przyswajanie wiedzy.
Studenci o wiele szybciej sięgają po komputer niż po książkę, więc jest bardzo prawdopodobne, że niniejsza e-lekcja przyczyni się do lepszego pozyskiwania wiedzy przez szersze grono osób.
<Bibliografia
5 9
9. Bibliografia
1. A.Gruszka. Po wiedzę w sied. Magazyn komputerowy „Chip”. 07 2002, strony 162-166.
2. Sieciowa encyklopedia informatyki. [Online] http://helionica.pl.
3. A.W.Chickering, Z.F.Gamson. Seven Principles for Good Practice in Undergraduate Education. AAHE Bulletion. 1987, strony 3-7.
4. R. M.Gagne, L.J.Griggs, W.W.Wager. Principles of Instructional Design. brak miejsca : Wadsworth Publishing, 1992.
5. Zając, M. Metodyczne aspekty projektowania kursów online. brak miejsca : Akademia Ekonomiczna w Katowicach, 2004. strony 24-31.
6. W.Strykowski, W.Skrzydlewski. Media i edukacja w dobie integracji. Poznao : brak nazwiska, 2002.
7. Wikipedia, Wolna encyklopedia. [Online] http://pl.wikipedia.org.
Dodatkowo, podczas tworzenia multimedialnej e-lekcji wykorzystano materiały dostępne w następujących pozycjach:
1. Z. Kąkol, „Fizyka”, Kraków 2006.
2. D. Halliday, R. Resnick, „Fizyka”, T.1 i T.2, Warszawa, PWN 1996.
3. J. Orear, „Fizyka”, T.1 i T.2, Warszawa, WNT 1990.
4. C. Bobrowski, „Fizyka - Krótki Kurs”, Warszawa, WNT 1995.
5. A.K. Wróblewski, J.A. Zakrzewski, „Wstęp do Fizyki”, T.1, Warszawa, PWN 1984.
6. K. Sieraoski, K. Jezierski, B. Kołodka, „Wzory i prawa z objaśnieniami”, T.2, Wrocław, Scripta 2005.
7. Witold Mizerski, „Tablice fizyczno-astronomiczne”, Warszawa, Adamantan 2002.
8. http://www.codegear.com/products/cppbuilder 9. http://webmaster.helion.pl/
10. http://pl.wikipedia.org/
11. Andrzej Persona, „Fizyka, wybór testów z egzaminów wstępnych na akademie medyczne i kierunki przyrodnicze”, Warszawa, Medyk 2000.
Spis rysunków
6 0
10. Spis rysunków
Rysunek 1. Wygląd okna głównego programu HateML Pro ... 30
Rysunek 2. Wygląd arkusza stylów CSS w programie HateML ... 34
Rysunek 3. Logo mootools ... 35
Rysunek 4. Strona główna projektu phatfusion multibox (http://www.phatfusion.net/multibox/) ... 35
Rysunek 5. Przykład działającego skryptu multibox... 36
Rysunek 6. Wygląd środowiska programistycznego Borland C++ Bulder 2007 ... 37
Rysunek 7. Fragment kodu napisanego w C++ ... 38
Rysunek 8. Projektowanie interfejsu programu w Borland C++ Builder ... 38
Rysunek 9. Strona główna e-lekcji ... 39
Rysunek 10. Menu główne e-lekcji ... 39
Rysunek 11. Menu boczne ... 40
Rysunek 12. Dwa dodatkowe sposoby poruszania się po e-lekcji ... 41
Rysunek 13. Skrócona mapa witryny ... 42
Rysunek 14. Mapa trybu nauki... 43
Rysunek 15. Brak zaznaczonej odpowiedzi ... 45
Rysunek 16. Zaznaczona odpowiedź nieprawidłowa ... 46
Rysunek 17. Zaznaczona prawidłowa odpowiedź ... 46
Rysunek 18. Opcje testu ... 46
Rysunek 19. Bieżące postępy rozwiązywania testu ... 47
Rysunek 20. Zadanie z odpowiedzią ... 47
Rysunek 21. Wygląd lekcji ... 48
Rysunek 22. Powiększenie rysunku ... 49
Rysunek 23. Obserwacja przestrzennego obrazu linii sił pola za pomocą "pióropusza" – migawka z filmu ... 49
Rysunek 24. Wygląd programu „Pole elektrostatyczne” ... 50
Rysunek 25. Menu główne ... 51
Rysunek 26. Tworzenie ładunku dodatniego ... 51
Rysunek 27. Utworzony ładunek ujemny... 52
Rysunek 28. Właściwości ładunku... 52
Rysunek 29. Zmiana właściwości ładunku ... 53
Rysunek 30. Usuwanie ładunku ... 53
Rysunek 31. Wczytywanie układu ładunków ... 54
Rysunek 32. Wczytany układ ładunków ... 54
Rysunek 33. Dostępne predefiniowane układy ładunków ... 55
Rysunek 34. Zapisywanie układu ładunków jako bitmapa ... 55
Rysunek 35. Wyświetlanie linii pola ... 56