Pobieranie prezentacji. Proszę czekać

Pobieranie prezentacji. Proszę czekać

System webowy do tworzenia kolektywnych prototypów aplikacji sieciowych i mobilnych Łukasz Przywarty 171018.

Podobne prezentacje


Prezentacja na temat: "System webowy do tworzenia kolektywnych prototypów aplikacji sieciowych i mobilnych Łukasz Przywarty 171018."— Zapis prezentacji:

1 System webowy do tworzenia kolektywnych prototypów aplikacji sieciowych i mobilnych Łukasz Przywarty

2 Ramowy plan prezentacji Omówienie tematu. Wymagania projektowe. Słowo na temat prototypowania. Manipulacja grafiką w przeglądarce. Aplikacja – funkcje, budowa. 2/19

3 Omówienie tematu System webowy – aplikacja internetowa. Do tworzenia kolektywnych – możliwość współtworzenia projektów w czasie rzeczywistym. Prototypów aplikacji sieciowych i mobilnych – wyjście: interaktywne makiety (modele) innych systemów (webowych i mobilnych). 3/19

4 Wymagania projektowe Rodzaj aplikacji: internetowa. Cel działania: tworzenie projektu zawierającego minimum 1 makietę systemu webowego lub mobilnego. Możliwości: –tworzenie nowego projektu i makiety, –umieszczanie na makiecie predefiniowanych elementów systemu (pola tekstowe, obrazy, pola wybory etc.) – drag and drop, –modyfikacja elementów (kolor, kształt, pozycja etc.), 4/19

5 Wymagania projektowe c.d. Możliwości c.d.: –definiowanie przejść pomiędzy makietami – interaktywność, –śledzenie zmian, komentowanie w czasie rzeczywistym. Opcjonalnie: –eksport do PDF, JPG, HTML, –wersjonowanie projektów. 5/19

6 Technologia Node.js pakiety: express, jade, less, socket.io, Redis , JavaScript – jQuery i inne, HTML5, CSS3. 6/19

7 Prototyp Prototypowanie: Strategia efektywnego radzenia sobie z rzeczami, które są trudne do przewidzenia. Prototyp: –często niekompletny, –łatwy w modyfikacji, –szybko się starzeje. 7/19

8 Prototyp c.d. Cele prototypowania: –model wyglądu (jak system może wyglądać?), –model funkcjonalności (jak system może działać?), –model doświadczeń (jakie doświadczenia w użytkowaniu może zapewniać system?). 8/19

9 Prototyp c.d. Mockup - statyczny. Wireframe. - dynamiczny. Prototype. - dokładny. 9/19

10 Manipulacja grafiką: SVG Grafika wektorowa: statyczna, dynamiczna, interaktywna, animowana. Model obiektowy (XML) – elementy, atrybuty, style (podobnie jak w HTML). Elementy graficzne jako części drzewa DOM. Modyfikacja: CSS oraz skrypty. Dostępność. 10/19

11 Manipulacja grafiką: Canvas Bitmapa. Oparty o piksele (element w postaci obrazka z graficznym API). Pojedynczy element drzewa DOM – podobnie jak. Modyfikacja: tylko skrypty. Stosowany do: generowania grafiki rastrowej (gry), edycji obrazów etc. 11/19

12 Wydajność SVG i Canvas Różna liczba obiektów 12/19

13 Wydajność SVG i Canvas Różna wielkość powierzchni rysowania: 13/19

14 Funkcje Część default –obsługa użytkownika: logowanie, tworzenie nowego konta etc., –zarządzanie projektami i makietami: usuwanie, edycja parametrów, –tworzenie nowego projektu i makiety w projekcie, –zarządzanie użytkownikami w projekcie. 14/19

15 Funkcje c.d. Część edit –edycja makiety: rozmiar, nazwa, wyświetlanie siatki, –wybór elementów (np. button) z listy i umieszczanie ich na makiecie (drag&drop), –modyfikacja parametrów elementu: kolor, rozmiar, kolejność wyświetlania na makiecie, pozycja na makiecie, blokowanie i wyrównywanie elementów – względem siebie oraz siatki, –definicja przejść pomiędzy makietami. 15/19

16 Ograniczenia Do korzystania z systemu wymagane połączenie z Internetem. Pewne trudności w instalacji i rozwoju systemu – niszowa technologia. Ograniczone możliwości zmiany wyglądu elementów – elementy predefiniowane. 16/19

17 Perspektywy rozwoju Dodanie nowych funkcjonalności: –komentarze użytkowników, –dodawanie własnych elementów (symboli) do biblioteki. Rozszerzenie bazy elementów prototypowych Zwiększenie interaktywności – akcje po najechaniu na element, animacje etc. 17/19

18 Bibliografia Cecco R., Supercharged JavaScript Graphics, 2011 Dailey D., Building Web Applications with SVG, 2012 Fulton S., HTML5 Canvas, 2011 MacCaw A., JavaScript Web Applications, /19

19 Łukasz Przywarty System webowy do tworzenia kolektywnych prototypów aplikacji sieciowych i mobilnych


Pobierz ppt "System webowy do tworzenia kolektywnych prototypów aplikacji sieciowych i mobilnych Łukasz Przywarty 171018."

Podobne prezentacje


Reklamy Google