Nazwa przedmiotu: PROGRAMOWANIE INTERAKTYWNEJ GRAFIKI KOMPUTEROWEJ Kierunek: Informatyka Rodzaj przedmiotu: moduł specjalności obowiązkowy: Programowanie aplikacji internetowych Rodzaj zajęć: wykład, laboratorium I KARTA PRZEDMIOTU CEL PRZEDMIOTU Programming of interactive computer graphics Forma studiów: Stacjonarne Poziom kwalifikacji: I stopnia Liczba godzin/tydzień: 2W E, 2L PRZEWODNIK PO PRZEDMIOCIE C1. Zapoznanie studentów z dostępnymi technologiami umożliwiającymi tworzenie interaktywnej grafiki na stronach WWW.. Nabycie przez studentów praktycznych umiejętności projektowania oraz wykonania bogatej na stronach WWW przy wykorzystaniu wybranych technologii oraz narzędzi. WYMAGANIA WSTĘPNE W ZAKRESIE WIEDZY, UMIEJĘTNOŚCI I INNYCH KOMPETENCJI 1. Wiedza z zakresu podstaw programowania w języku C++, podstawowa znajomość HTML, CSS. 2. Podstawowa znajomość zasad projektowania stron internetowych. 3. Znajomość zasad bezpieczeństwa pracy przy użytkowaniu sprzętu komputerowego. 4. Umiejętność korzystania z różnych źródeł informacji, w tym z instrukcji oraz dokumentacji technicznej, wykorzystywanych narzędzi. 5. Umiejętność pracy samodzielnej i w grupie. Kod przedmiotu: E6_05 Rok: III Semestr: VI Liczba punktów: 5 ECTS EFEKTY KSZTAŁCENIA EK1 posiada podstawową wiedzę teoretyczną z zakresu programowania na stronach WWW. EK2 zna podstawowe technologie umożliwiające tworzenie interakcji oraz na stronach WWW. EK3 potrafi oraz wykonać stronę internetową o określonym przeznaczeniu zawierającą elementy interaktywne. EK4 potrafi dobrać właściwą od przeznaczenia oraz rodzaju problemu dla interaktywnej strony WWW. EK5 potrafi efektywnie operować na WWW, zmieniać jej wygląd w odpowiedzi na zdarzenia, operować na elementach składowych wykorzystując właściwą technologię. EK6 potrafi wykonać interfejs aplikacji internetowej modyfikując wygląd, efektywnie wykorzystując kontenery zarządzające położeniem. EK7 zna biznesowych. EK8 potrafi oraz wykonać animację wzbogacającą stronę WWW o elementy
interaktywne wykorzystując do tego właściwe narzędzia. TREŚCI PROGRAMOWE Forma zajęć WYKŁADY Liczba godzin W 1 Wprowadzenie do na stronach WWW, przegląd dostępnych 2 technologii. W 2 Podstawy składni JavaScript, biblioteka JQuery, selektory. 2 W 3 Selektory CSS, operowanie na WWW. 2 W 4 Zdarzenia i animacje, zasady stosowania animacji. 2 W 5 Zaawansowane operowanie na elementach DOM. 2 W 6 Podstawy Silverlight, wprowadzenie do XAML. 2 W 7 Budowa interfejsu użytkownika. 2 W 8 Modyfikacja wyglądu, biblioteki. 2 W 9 Zdarzenia i animacje. 2 W 10 Kontrolki użytkownika, interaktywna grafika w internetowych aplikacjach 2 biznesowych. W 11 Flash - budowa interfejsu użytkownika. 2 W 12 Animacje, rodzaje animacji. 2 W 13 Kontrolki, modyfikacja wyglądu. 2 W 14 Obsługa zdarzeń w ActionScript. 2 W 15 Edytor ruchu, kinematyka. 2 Forma zajęć LABORATORIUM L 1 Projekt strony, dobór kolorystyki dla strony internetowej. 2 L 2 Selektory, modyfikacja, narzędzia analizy źródeł stron WWW. 2 L 3 Selektory CSS, operowanie na WWW. 2 L 4 Zdarzenia i animacje, elementy interaktywne. 2 L 5 Zaawansowane operowanie na elementach DOM. 2 L 6 Silverlight, budowa interfejsu użytkownika w Visual Studio i Expression Blend. 2 L 7 Interfejs użytkownika, podstawowe kontenery. 2 L 8 Modyfikacja wyglądu elementów interfejsu użytkownika, biblioteki. 2 L 9 Stany aplikacji, zdarzenia, interakcja, tworzenie złożonych animacji. 2 L 10 Budowa kontrolki użytkownika, aplikacje biznesowe. 2 L 11 Flash, interfejs użytkownika, listwa czasowa, narzędzia rysowania. 2 L 12 Animacje, rodzaje animacji, operacje na listwie czasowej. 2 L 13 Kontrolki, modyfikacja wyglądu. 2 L 14 Zdarzenia, obsługa zdarzeń w ActionScript. 2 L 15 Edytor ruchu, zastosowanie kinematyki do złożonych animacji. 2 NARZĘDZIA DYDAKTYCZNE 1. wykład z wykorzystaniem prezentacji multimedialnych 2. ćwiczenia laboratoryjne, ocena realizacji wykonywanych ćwiczeń 3. prezentacja przykładowych realizacji aplikacji 4. instrukcje do wykonania na ćwiczeniach laboratoryjnych 5. stanowiska komputerowe wyposażone w odpowiednie oprogramowanie Liczba godzin 2
SPOSOBY OCENY ( F FORMUJĄCA, P PODSUMOWUJĄCA) F1. ocena przygotowania do ćwiczeń laboratoryjnych F2. ocena umiejętności stosowania zdobytej wiedzy podczas wykonywania ćwiczeń F3. ocena realizacji projektów, zadań realizowanych poza zajęciami laboratoryjnymi F4. ocena aktywności podczas zajęć P1. ocena umiejętności rozwiązywania postawionych problemów zaliczenie na ocenę* P2. ocena opanowania materiału nauczania będącego przedmiotem wykładu zaliczenie wykładu (lub egzamin) *) warunkiem uzyskania zaliczenia jest otrzymanie pozytywnych ocen ze wszystkich ćwiczeń laboratoryjnych, OBCIĄŻENIE PRACĄ STUDENTA Forma aktywności Godziny kontaktowe z prowadzącym Godziny konsultacji z prowadzącym Godziny na przeprowadzenie egzaminu Zapoznanie się ze wskazaną literaturą Przygotowanie do ćwiczeń laboratoryjnych Wykonanie dodatkowych projektów, zadań stanowiących rozszerzenie ćwiczeń laboratoryjnych (czas poza zajęciami laboratoryjnymi) Przygotowanie do egzaminu Średnia liczba godzin na zrealizowanie aktywności 30W 30L 60 h 5 h 3 h 12 h 15 h 10 h 20 h Suma 125 h SUMARYCZNA LICZBA PUNKTÓW ECTS DLA PRZEDMIOTU Liczba punktów ECTS, którą student uzyskuje na zajęciach wymagających bezpośredniego udziału prowadzącego Liczba punktów ECTS, którą student uzyskuje w ramach zajęć o charakterze praktycznym, w tym zajęć laboratoryjnych i projektowych 5 ECTS 2.7 ECTS 2.2 ECTS LITERATURA PODSTAWOWA I UZUPEŁNIAJĄCA 1. Porters S.: Grafika w Internecie, Helion 2009, 2. Bibeault B., Y. Katz.: jquery in Action, Second Edition, Manning Publications Co. 2010, 3. Castledine E., Sharkie C.: JQuery Novice to Ninja, SitePoint, 2010, 4. Wellman D., JQuery 1.4 Animation Techniques, Packet Publishing, 2011, 5. Żarski A.: Expression Blend Przewodnik, APN Promise 2009, 6. Maciejewski P: Redmerski P., Silverlight od podstaw, Helion 2009, 7. http://www.silverlight.net/learn/tutorials/full/1/ 8. http://expression.microsoft.com/en-us/cc197141.aspx 9. Adobe Creative Team: ActionScript 3.0 dla Adobe Flash CS4/CS4 PL Professional. Oficjalny podręcznik, Adobe 2009, 10. Laurence M.: Microsoft Silverlight Step by Step, O'Reilly Media 2010, 11. Adobe Creative Team: Adobe Flash CS4/CS4 PL. Oficjalny podręcznik, Helion 2009, 12. Adobe Creative Teamm: Adobe Flash CS5/CS5 PL Professional. Oficjalny podręcznik, 3
Adobe 2011, PROWADZĄCY PRZEDMIOT ( IMIĘ, NAZWISKO, ADRES E-MAIL) 1. dr inż. Piotr Dziwiński piotr.dziwinski@kik.pcz.pl Efekt kształcenia EK1 EK2 EK3 EK4 EK5 EK6 EK7 EK8 Odniesienie danego efektu do efektów zdefiniowanych dla całego programu (PEK) K_W08 K_W15 K_W19 KPAI1_W03 KPAI1_W04 K_W08 K_W15 K_W19 KPAI1_W03 KPAI1_W04 K_U12 K_U18 K_W08 K_W15 K_W19 KPAI1_W03 KPAI1_W04 Cele przedmiotu Treści programowe Narzędzia dydaktyczne Sposób oceny C1, W1-15 1 P2 C1, W1-W15 1 P2 L1-L15 2-5 C1 C1 C1 F2, F3, P1 W1-W15 1,3 P2 W3, W5 L3, L5 W7,W8 L7,L8 W10 L10 W4, W9, W12, W15 L4, L9, L12, L15 F1 - F4 P2 F1-F4 P1, P2 F1-F4, P2 F1-F4, P1 II. FORMY OCENY - SZCZEGÓŁY Efekt 1 Student opanował wiedzę z zakresu programowania na stronach WWW, potrafi opisać kilka sposobów realizacji implementacji interakcji oraz Na ocenę 2 Na ocenę 3 Na ocenę 4 Na ocenę 5 Student nie Student opanował Student opanował Student opanował opanował wiedzę wiedzę z zakresu wiedzę z zakresu doskonale wiedzę z zakresu programowania programowania z zakresu programowania programowania na na na stronach WWW stronach WWW na stronach WWW w stopniu w stopniu dobrym, stronach WWW, minimalnym, potrafi potrafi podać potrafi podać podać przykłady przykłady realizacji, przykłady realizacji, realizacji, ale orientuje się w nich orientuje się w nich orientuje się w nich dobrze, zna je jednak bardzo dobrze, 4
animacji słabo. dość powierzchownie potrafi podać przykłady rozwiązań odnalezionych samodzielnie w literaturze. Efekt 2 Student zna podstawowe technologie umożliwiające tworzenie interakcji, na stronach WWW, potrafi je wymienić, opisać ich wady, zalety, potencjalny obszar. Efekt 3 oraz wykonać stronę WWW o określonym przeznaczeniu, potrafi dobrać właściwie kolorystykę, wzbogaca swój projekt o interakcję oraz animację ułatwiające obsługą strony. Efekt 4 dobrać właściwą problemu oraz obszaru proponowanego rozwiązania. Efekt 5 efektywnie operować na WWW, zmieniać jej wygląd w odpowiedzi na zdarzenia, operować na elementach składowych wykorzystując wymienić technologii, nie potrafi scharakteryzować żadnej z nich. strony WWW, student nie potrafi wykonać strony WWW. technologii zależnie nie potrafi sprecyzować potencjalnych obszarów ich. operować na WWW, nie potrafi zmieniać jej wyglądu, nie zna sposobu na zmianę zawartości strony WWW po wystąpieniu określonych zdarzeń wymienić poznane technologie, potrafi opisać jedną z nich stronę WWW, jej zawartość jest niespójna, układ jest niewłaściwy, kolorystyka nie jest zbyt dobrze dobrana, bardzo mała ilość interakcji, zadanie wykonane na minimalnym poziomie. ograniczenia oraz wady poszczególnych technologii są jednak dla niego niejasne. Student słabo potrafi operować na WWW, potrafi wybrać tylko najprostsze elementy przy użyciu selektorów, umie obsłużyć tylko najprostsze zdarzenia wymienić poznane technologie, potrafi krótko scharakteryzować każdą z nich, ma jednak problemy z określeniem obszaru ich. stronę WWW, jej zawartość jest dość dobrze przemyślana, układ jest właściwy, kolorystyka dobrze dobrana ale nie dopracowana, strona WWW zawiera interakcje oraz animacje, ale niecałkiem posują one do całości projektu. ograniczenia oraz wady poszczególnych technologii są dla niego jasne Student dobrze potrafi operować na WWW, przy użyciu selektorów potrafi wybrać głęboko zagnieżdżone elementy, dobrze radzi sobie z obsługą podstawowych zdarzeń Student biegle orientuje się w poznanych technologiach, potrafi scharakteryzować każdą z nich, podaje obszary ich, potrafi podać przykłady realizacji. stronę WWW, jej zawartość jest dobrze dobrana, kolorystyka estetyczna i dopracowana, liczne interakcje wpływające pozytywnie na obsługę strony. ograniczenia oraz wady poszczególnych technologii są dla niego jasne, potrafi potwierdzić to przykładami. Student biegle operuje na WWW przy użyciu selektorów, potrafi konstruować złożone selektory, bardzo dobrze radzi sobie z obsługą zdarzeń 5
właściwą technologię Efekt 6 wykonać interfejs aplikacji internetowej modyfikując wygląd, efektywnie wykorzystując kontenery zarządzające położeniem Efekt 7 Student zna biznesowych. Efekt 8 oraz wykonać animację wzbogacającą stronę WWW o elementy interaktywne wykorzystując do tego właściwe narzędzia wykonać interfejsu aplikacji internetowej, nie potrafi modyfikować wyglądu podstawowych Student nie zna biznesowych animacji, nie zna właściwych narzędzi, technologii wykonać bardzo prosty interfejs aplikacji, nie jest on dopracowany i spójny, student potrafi modyfikować wygląd tylko nielicznych, stosuje najprostsze kontenery. Student słabo zna biznesowych oraz wykonać proste animacje, słabo zna narzędzia, ale wybiera właściwe dla danego wykonać bardziej rozbudowany interfejs aplikacji, jest on dość dobrze dopracowany, zawiera wiele o dopasowanym wyglądzie, efektywnie stosuje kontenery. Student dobrze zna biznesowych, potrafi podać kilka przykładów oraz wykonać bardziej złożone animacje wzbogacające stronę WWW o elementy interaktywne, zaprojektowane animacje dobrze komponują się z pozostałą zawartością strony, student wykazuje się dobrą znajomością zastosowanego narzędzia, technologii wykonać złożony interfejs zawierający interakcje, jest on bardzo dobrze zaprojektowany, posiada wiele o zmodyfikowanym wyglądzie, biegle stosuje kontenery, potrafi kontrolkę użytkownika. Student bardzo dobrze zna biznesowych, potrafi podać kilka przykładów, poszerzył swoją wiedzę o liczne, które można odnaleźć w Internecie oraz wykonać złożone animacje wzbogacające stronę WWW o elementy interaktywne, animacje są bardzo dobrze dopasowane do wykorzystuje do tego celu najlepsze narzędzie, student wykazuje się bardzo dobrym wykorzystaniem zastosowanego narzędzia, technologii Dopuszcza się wystawienie oceny połówkowej o ile student spełniający wszystkie efekty kształcenia wymagane do oceny pełnej spełnia niektóre efekty kształcenia odpowiadające ocenie wyższej 6
III. INNE PRZYDATNE INFORMACJE O PRZEDMIOCIE 1. Wszelkie informacje dla studentów (prezentacje do zajęć, instrukcje do ćwiczeń laboratoryjnych, przykładowe aplikacje) dostępne są na stronie internetowej http://kik.pcz.pl/ w zakładce Dydaktyka. 2. Informacja na temat konsultacji przekazywana jest studentom podczas pierwszych zajęć z danego przedmiotu. 7