Web Engineering CS666 Web Engineering Lecture06 PMASArid Agriculture

Web Engineering (CS-666) Web Engineering Lecture-06 PMAS-Arid Agriculture University, Rawalpindi University Institute of Information Technology

Web Engineering (CS-666) Lecture Outline q Content Modeling q Navigation Modeling q Presentation Modeling PMAS-Arid Agriculture University, Rawalpindi University Institute of Information Technology

Web Engineering (CS-666) Content Modeling PMAS-Arid Agriculture University, Rawalpindi University Institute of Information Technology

Web Engineering (CS-666) Content Modeling q q The information provided by a web application is one of the most important factors for the success of that application. Content modeling aims at modeling the content requirements of a web application. q q q Diagraming the structural and behavioral aspects of the information. Ignores the navigational information Key UML Diagrams q q Class diagram: to model the structural aspects of information State machine diagram: to model behavioral aspects of information PMAS-Arid Agriculture University, Rawalpindi University Institute of Information Technology

Web Engineering (CS-666) Content Modeling q Class Diagram describes the structure of a system by q q system’s classes class attributes operations (methods) relationship among objects PMAS-Arid Agriculture University, Rawalpindi University Institute of Information Technology

Web Engineering (CS-666) Content Modeling q Class Diagram (Elements) q Class q class is represented by a rectangle with three compartments q name q attributes q methods PMAS-Arid Agriculture University, Rawalpindi University Institute of Information Technology

Web Engineering (CS-666) Content Modeling q Class Diagram (Elements) q Attributes q an attribute describes a piece of information that an object owns q specified by name q kind (data type) q visibility (+, - , #) q default value q visibility name : type= default value q + name : string = ‘ali’ {maximum 25 characters} PMAS-Arid Agriculture University, Rawalpindi University Institute of Information Technology

Web Engineering (CS-666) Content Modeling q Class Diagram (Elements) q Methods q behaviors (things objects can do or can be done with them) q name q arguments q visibility (+, - , #) q return value q visibility name (argument_name: type): return_value q + user. Login(email: string, password: string): null PMAS-Arid Agriculture University, Rawalpindi University Institute of Information Technology

Web Engineering (CS-666) Content Modeling q Class Diagram (Elements) q Association q relationship between classes q name of relationship q visibility (+, - , #) q direction of relationship q Association multiplicity q How many objects participating in the relation PMAS-Arid Agriculture University, Rawalpindi University Institute of Information Technology

Web Engineering (CS-666) Content Modeling q Class Diagram (Elements) q Aggregation relation q class has features of another class plus some own features q Composition relation PMAS-Arid Agriculture University, Rawalpindi University Institute of Information Technology

Web Engineering (CS-666) users - name : string -email : string -password : string -register -login 1. . 1 0. . * -introduction : string 1. . 1 0. . * user uploads 0. . * Register user video -video. ID : int +video. TITLE : string +video. DES : string +upload() +search() Video Sharing 0. . * PMAS-Arid Agriculture University, Rawalpindi University Institute of Information Technology

Web Engineering (CS-666) Content Modeling q State Machine Diagram q q q For dynamic Web applications, they depict important states and events of objects, and how objects behave in response to an event (transitions) Show the life-cycle of an object Used only for state-dependent objects PMAS-Arid Agriculture University, Rawalpindi University Institute of Information Technology

Web Engineering (CS-666) Uploaded Search PMAS-Arid Agriculture University, Rawalpindi University Institute of Information Technology Watch

Web Engineering (CS-666) Second state First state Third state Fourth state Fifth state PMAS-Arid Agriculture University, Rawalpindi University Institute of Information Technology

Web Engineering (CS-666) Navigation Modeling PMAS-Arid Agriculture University, Rawalpindi University Institute of Information Technology

Web Engineering (CS-666) Navigation Modeling q Models how web-pages are linked together q defines the structure of the hypertext q Which classes of the content model can be visited by navigation q http: //uwe. pst. ifi. lmu. de/teaching. Tutorial. Navigation. html q UWE navigation modeling navigation. Class q Menu q Index q Query q process. Class q Processlink q Navigation link q External link q PMAS-Arid Agriculture University, Rawalpindi University Institute of Information Technology

Web Engineering (CS-666) Navigation Modeling q Online video sharing q Home page q video list search video q upload video q q q Register login q Upload PMAS-Arid Agriculture University, Rawalpindi University Institute of Information Technology

Web Engineering (CS-666) <<navigation. Class>> Video Sharing <<processlink>> <<query>> search. Video <<process. Link>> <<navigationlink>> <<menu>> main. Menu <<navigationlink>> <<navigation. Class>> upload. Video <<navigation. Link>> <<index>> videolist <<processlink>> <<process. Class>> register <<process. Class>> upload PMAS-Arid Agriculture University, Rawalpindi University Institute of Information Technology <<processlink>> <<process. Class>> login

Web Engineering (CS-666) Presentation Modeling PMAS-Arid Agriculture University, Rawalpindi University Institute of Information Technology

Web Engineering (CS-666) Presentation Modeling q q q Purpose: To model the look & feel of the Web application at the page level The design should aim for simplicity and self-explanation Describes presentation structure: q Composition & design of each page PMAS-Arid Agriculture University, Rawalpindi University Institute of Information Technology

Web Engineering (CS-666) Presentation Modeling q Presentation Modeling Levels: q Presentation Page q page container Presentation Unit q A fragment of the page logically defined by grouping related elements q Presentation Element q q q A unit’s informational components Text, images, buttons, fields PMAS-Arid Agriculture University, Rawalpindi University Institute of Information Technology

Web Engineering (CS-666) PMAS-Arid Agriculture University, Rawalpindi University Institute of Information Technology