63
METODOLOGIE METODOLOGIE ORIENTOVANÉ NA ORIENTOVANÉ NA TVORBU WEBOVÝCH TVORBU WEBOVÝCH SÍDEL SÍDEL Ing. Martin Molhanec, CSc. Ing. Martin Molhanec, CSc.
METODOLOGIE METODOLOGIE ORIENTOVANÉ ORIENTOVANÉ
NA TVORBU NA TVORBU WEBOVÝCH WEBOVÝCH
SÍDELSÍDEL
METODOLOGIE METODOLOGIE ORIENTOVANÉ ORIENTOVANÉ
NA TVORBU NA TVORBU WEBOVÝCH WEBOVÝCH
SÍDELSÍDEL
Ing. Martin Molhanec, CSc.Ing. Martin Molhanec, CSc.
Úvod• Metodologie pro tvorbu webových sídel
jsou specifickou podmnožinou softwarového inženýrství.
• Navazují na metodologie pro tvorbu hypermediálních/hypertextových aplikací.
• Jejich znalost není všeobecně rozšířená!• Poskytují cestu pro automatizovanou
tvorbu webových aplikací.
RMM – Relationship Management Methodology
• Isakowitz, Stohr, Balasubramanian (1995)
• Hlavní kroky matodologie– 1. Entity-Relational Design – 2. Slice Design – 3. Navigational Design – 4. User Interface Design – 5. Protocol Conversion Design – 6. Run-Time Behaviour – 7. Construction and Testing
RMM – Relationship Management Methodology
• Základem je RMDM (Relationship Management Data Model), podobný ER modelům.
• Slice Design, který definuje jakési pohledy na RMDM.
• Navigační návrh – definuje pohyb uživatele po aplikaci.– Index, Guided Tour, Indexed Guided Tour, Grouping,
Link.
• RMCase – pro podporu analýzy a návrhu
RMM – Relationship Management Methodology
RMM – Relationship Management Methodology
RMM – Relationship Management Methodology
RMM – Relationship Management Methodology
RMDM – Relational Management data
Model
RMM – Relationship Management Methodology
OOHDM – Object Oriented Hypermedia
Design Method• Rossi a Schwabe (1996, 1998)• Nahradila starší HDM metodologii, je ale ve
skutečnosti úplně novou metodologií.• Byla podrobněji prezentována na této
konferenci a na konferenci Objekty.• Kroky metodologie:
– Konceptuální modelování– Návrh navigace– Návrh abstraktního rozhraní– Implementace
OOHDMvztahy mezi jeho částmi
Konceptuální diagram
Schéma navigačních tříd
Typy kontextů• Simple class based – splňují objekty, které jsou
téže třídy C a jsou vybrány prostřednictvím atributu P, který splňuje danou podmínku. Například „all Stories“ pokud je P vždy pravdivé.
• Class based group – je množina kontextů, které jsou typu Simple class based. Například „Stories by type“ je skupina kontextů, kde každý jednotlivý kontext je Story určitého typu.
Typy kontextů• Link based – objekty v tomto kontextu jsou stejné
třídy a jsou vybrány prostřednictvím vztahu 1:M. Například „all Stories by Bob Woodward“.
• Link based group – je množina kontextů, kde každý z nich je Link based. Například „Stories by Author“.
• Enumarated – v tomto případě jsou jednotlivé elementy kontextu jmenovitě vyjmenovány.
OOHDM – Object Oriented Hypermedia Design
Method
Diagram navigačního kontextu
Návrh abstraktního rozhraní
• Zabývá se aspekty uživatelského rozhraní
• Je oddělena od navigace, čili jedna navigace může mít několik rozhraní!
• V praxi jsme často omezeni určitým vývojovým prostředím
Návrh abstraktního rozhraní
• ADV (Abstract Data View) jsou objekty popisující uživatelské rozhraní, popisují svůj stav a rozhraní, nikoliv svoji implementaci!
• ADV mohou obsahovat jiné ADV
• Je také možné využívat hierarchie
ADV diagramy
Vztah ADV diagramu a skutečné stránky
OOHDM-Webnástroj pro podporu
• OOHDM analýza
• CGILua – skriptovací nástroj pro vytváření dynamických stránek
• Lua – jazyk skriptů
Nevýhoda: dokumentace je jenom v portugalštině
WebML – Web Modeling Language
• Politechnika v Miláně• Rozsáhlý projekt se zřejmým
komerčním záměrem• Základem jsou následující modely:
– Strukturální model (Structural Model)– Hypertextový model (Hypertext Model)– Prezentační model (Presentational Model)– Uživatelský model (Personalization Model)
Strukturální model • Jedná se ve skutečnosti o obvyklé
datové modelování. Lze použit libovolný ER nebo OO konceptuální datový model.
• Pro podporu dotazování do databáze se využívá dotazovací jazyk WebML-OQL, který vychází z jazyka OQL (Object Query Language).
Strukturální model
Hypertextový model• Skládá se ze dvou modelů, které se
kreslí do jednoho diagramu– Kompoziční model, který popisuje z
jakých prvků se stránka skládá: data, multi-data, index, filter, scroller a direct unit
– Navigační model, který zobrazuje navigaci mezi jednotlivými stránkami pomocí odkazů, které jsou: kontextové nebo bezkontextové.
Tento prvek slouží pro publikování (zobrazení) jednoho objektu (řádky) dané třídy (entity, tabulky). Například údaje o jednom konkrétním zpěvákovi z databáze zpěváků. Způsob zobrazení může být libovolný, toto není věc hypertextového modelu, ale modelu presentačního.
Tento prvek slouží pro publikování několika objektů v rámci jedné stránky. Například přehled zboží z databáze skladu. Způsob zobrazení může být libovolný, toto není věc hypertextového modelu, ale modelu presentačního. Nejčastěji se jedná o prvky typu grid, browser, atp.
Index představuje publikování několika objektů entity jako seznamu. Například seznam zboží. Po kliknutí na položku indexu se uskuteční akce navigace, například přechod na stránku s detailními informacemi o vybraném zboží.
Varianta Indexu, kdy je každý prvek seznamu spojen se zaklikávacím boxem. Tento prvek obsahuje dále tlačítko pro odeslání. Při odeslání se uskuteční akce navigace na jinou webovou stránku. Při této navigaci se informace o zaškrtnutých prvcích tohoto prvku přenáší jako parametry navigace do další stránky..
Prvek, který umožňuje krokovat (procházet se) mezi objekty dané entity. Obsahuje obvyklé možnosti vpřed a vzad, případně na začátek a na konec.
Prvek, který představuje vstupní formulář. Slouží pro zadávání údajů. Po odeslání následuje akce navigace na další stránku. Vložené údaje se přenášejí jako parametry navigace a jsou zpracovány následující stránkou.
Ukážeme si postupně!
Toto je vlastní diagram!
Toto je jednoduché grafické znázornění případných stránek.
Stránka zobrazující seznam zpěváků.
Stránka zobrazující informace o jednom zpěvákovi a přetáčecí
prvek.
Odkaz mezi dvěma
stránkami.
Odkaz v rámci jedné stránky.
Složitější příklad.Ukážeme si po jednotlivých
částech!
Stránka zobrazuje
seznam všech zpěváků.
Stránka zobrazuje údaje
o jednom zpěvákovi.
Odkaz mezi dvěma
stránkami.
Tento prvek zobrazuje
stručné údaje o jednom
zpěvákovi.
Tento element zobrazuje seznam alb
jednoho zpěváka.
Odkaz v rámci jedné stránky.
Stránka, která zobrazuje údaje o jednom albu.
Element, který zobrazuje údaje o jednom albu.
Element zobrazuje seznam
hudebníků.
Element zobrazuje
seznam skladeb na albu.
Element zobrazuje
stručná data o zpěvákovi.
Odkaz v rámci jedné stránky.Odkaz v rámci jedné stránky.
Odkazy v rámci jedné stránky.
Jak se Vám to líbilo ?Zdá se Vám notace WebML užitečná?
Uživatelský model• Modeluje uživatele, kteří s webovým sídlem
pracují.
• Modeluje práva uživatelů k jednotlivým informacím, které jsou webovým sídlem poskytovány.
• Využívá objektovou modelovací techniku s notací UML.
Uživatelský model
Objektový model uživatelů systému (webového sídla).
Prezentační model• Modeluje vzhled a chování
jednotlivých prvků webových stránek nezávisle na výstupním zařízení (HTML 3.2, HTML 4, WAP, … ).
• Využívá technologie XSLT.• Pro její využití je nutné
vývojové prostředí, které podporuje tento model.
• Toto prostředí poskytuje například produkt firmy WebRatio.
Development process• Site Designer
– Umožňuje vytvořit strukturální, hypertextový a uživatelský model.
• Presentational Designer– Umožňuje navrhovat vzhled a polohu prvků na
webové stránce.
• Site manager– Nástroj, který umí sídlo instalovat a spravovat.
Development process
Závěr přednášky
• Aktuální problematika – návrh webových sídel.
• Teoreticky propracovaná – stále se rozvíjí.
• Zahrnuje moderní prvky – například XML.
• Staví na standardech – UML.
Závěr přednášky
• Aktuální problematika – návrh webových sídel.
• Teoreticky propracovaná – stále se rozvíjí.
• Zahrnuje moderní prvky – například XML.• Staví na standardech – UML.
Metodologie podobného druhu jsou nesmírně důležité!
Závěr přednášky
• Aktuální problematika – návrh webových sídel.
• Teoreticky propracovaná – stále se rozvíjí.
• Zahrnuje moderní prvky – například XML.• Staví na standardech – UML.
Jinak je návrh webových sídel amatérský a nikoliv
inženýrský!
Závěr přednášky• Falešné ikony
– Grafika – čím úžasnější, tím lepší, vždyť webové sídlo je přeci umění!
– Technologie – je lepší ASP, PHP, .NET, Perl, Apache, IIS nebo JSP?
– Business – udělej si webové sídlo a vydělávej, vyrábět nic nemusíš, jenom obchoduj!
• Bohužel, činnosti jako analýza, projektové řízení, kvalita, údržba a testování, které jsou pro skutečný a trvalý úspěch daleko potřebnější přicházejí vniveč.
Závěr přednášky
• Svět metodologií pro návrh webových sídel je velice bohatý.
• Jejich nepoužívání je odpovědí na otázku proč tolik webových sídel je špatně navrženo!
