Integration of Markup Languages and Object-Oriented Techniques in a Hypermedia Methodology Antonio Navarro Universidad Complutense de Madrid, Spain Alfredo Fernandez-Valmayor Universidad Complutense de Madrid, Spain Baltasar Fernandez-Manjon Universidad Complutense de Madrid, Spain Jose Luis Sierra Universidad Complutense de Madrid, Spain 2000 University of Glasgow Glasgow ALLC/ACH 2000 editor Jean Anderson Amal Chatterjee Christian J. Kay Margaret Scott encoder Sara A. Schmidt Text Encoding In this paper we present a hypermedia design and production methodology integrating markup languages and object-oriented techniques. This methodology tries to solve the main problems presented during hypermedia development, improving the communication between customers (content providers and interaction designers), and developers (software designers and programmers). 1. Introduction Hypermedia production is a complex and costly task with a specific need to involve experts of very different fields during all the phases of the software development. Usually in traditional software production, the customer gives the functional and operational requisites to developers, who in a very independent way implement the program. On the contrary, in hypermedia production we need more implication of the customer providing all the information needed to build the application. We have learned all these lessons during the construction of Galatea, an educational hypermedia for French text comprehension, developed in collaboration with a linguists team (complementary information about Galatea can be found in [Fernandez-Manjon et al. 98]). This customer presence, providing contents and interaction, originates a severe problem in the design phase. In this phase we need a systematic and well-defined formalism to represent the application in an abstract way that facilitates the relationship between customers and software designers. Two main approaches have been used to solve this problem. One solution is the use of hypermedia models in the design and development of these applications. The other one is to use object-oriented diagrams to cover the design phase. In this paper we analyze both approaches [Navarro 98], and propose a production hypermedia methodology integrating hypermedia models and object-oriented techniques. Our methodology [Navarro&Fernandez-Manjon 00, Navarro&Sierra 00] tries to solve some of the problems identified in previous approaches facilitating the interaction between customers and developers, easing the code generation based on design phase, and improving the application maintenance. 2. Hypermedia models and object-oriented design and development techniques Hypermedia models as Dexter Hypermedia Model [Halasz and Schwartz 94], Amsterdam Hypermedia Model [Hardman et al. 94], Hypertext Abstract Machine HAM [Campbell and Goodman 88], Hypergraph Model [Tompa 89], Trellis Model [Stotts and Furuta 89], and Hypertext Design Model HDM [Garzotto et al. 93] present important advantages [Garzotto et al. 93], and a few drawbacks. They are closed systems, making it impossible (or very difficult) to include complex computational activities in the hypermedia application, if the model doesn't support this activity; some of them are too hard to be managed by non computer science people; and none of them enables the design of an hypermedia application centred on the information structure, with a real independence of the presentation structure. Object-oriented software development methodologies, as Booch [Booch 94] or UML [Rumbaugh et al. 98], are extensively and successfully applied in computer projects development, because they improve software quality and maintenance, but these methodologies also present some drawbacks. They are not primarily intended for the development of hypermedia applications; and they use diagrams which are valuable for software designers, but very difficult to be understood by a customer team. Our approach combines ideas for both domains, and integrates them through the use of XML. XML, the Extensible Markup Language [W3C XML], is the evolution of the first attempt to represent markup languages in a standardized way, SGML, the Standard Generalized Markup Language [ISO/IEC SGML]. XML is based on descriptive markup (the tag semantic is not specified in the tag definition); the separation between the structure, content and treatment of a document; and the platform independence. To achieve these goals XML defines the set of tags that conform to the markup language (that is the document structure) through an XML construction called DTD (Document Type Definition). This DTD is the grammar that formally describes the structure of a class of text, and a document that includes the DTD tags to structure its content is called an instance of the DTD. 3. Our approach As previously stated, our methodology tries to solve the problems identified in previous approaches, improving the communication between customers and developers. In our approach, developers are divided into software designers that must provide a representation of the application (code independent), and programmers that translate this representation into real code. Customers also play a double role. They are the content providers that organize the knowledge included in the application (this knowledge has a double structure: natural and hyperlink structure), and they are the interaction designers who decide the time and space of content presentation. Interaction between the content providers team and the software designers team is one of the problems that our methodology solves. We use an XML DTD, called the content DTD, to represent the contents of the application, and the hyperlinks between these contents. The content provider team describes the structure of the contents (using natural language), and the software designers team use this information to build the content DTD. Then, the content provider team generates an instance of this content DTD that organizes the contents of hypermedia application in a formal way. The use of meaningful tags, and the inclusion of attributes (properties) in these tags, solves the problem of content providers and software designers interaction. Our methodology also eases the communication problems between the interaction designers team and software designer team. We use another XML DTD, called the presentation DTD to characterize the presentational structure of hypermedia applications. The elements of the presentation DTD describe the application presentational elements (screens, windows, buttons, etc.) and the hyperlinks between them. This DTD is common to all (or most) hypermedias, and is provided by the software designers team. Moreover we are working in the assignment of a concrete semantic to the presentation DTD, based on an object-oriented windows class hierarchy, to provide a consistent connection between the markup view, and the object-oriented view of our methodology. This separation from content and presentation provides the means to associate different presentations with the same content. The relationship between content DTD and presentation DTD is accomplished through the overmarkup. Overmarkup basic idea is a very simple one: when we build the instance of the presentation DTD, to describe the presentation and interaction framework of the application, the elements of the content DTD are the content of the elements of the presentation DTD. We apply this overmarkup in two phases. In phase 1, structural overmarkup, there are no real contents, and when the interaction designers (helped by software designers) build the instance 1 of the presentation DTD, the elements of the presentation DTD overmark the elements (only the name of the element) of the content DTD, enabling a better understanding of the structure of the application. In phase 2, content overmarkup, when the interaction designers (helped by software designers) build the instance 2 of the presentation DTD, the elements of the presentation DTD overmark the instances of the elements of the content DTD (the real content) to represent the final hypermedia application. If we need to represent some complex computational activity in the application (for example an exercise that evaluates the learner knowledge) we use object-oriented diagrams (mainly class and state transition diagrams) that are attached to instance 2 of the presentation DTD. This instance 2 is what we call the application design document, and provides a real representation of the total application used by customers and programmers. Customers (content providers and interaction designers) use the design document to evaluate if it conforms to its requirements, and make any change (obviously they ignore the object-oriented diagrams). Programmers use part of this document in the coding phase directly, whereas other parts represent the application design that they must translate in real code. This task is facilitated by the relation between presentation DTD and real object-oriented code, and facilitates the maintenance of the final application. 4. Conclusions and future work We think that our approach provides a solution for the development of hypermedia applications, solving the problems of hypermedia models and object-oriented construction techniques. Indeed our solution is not closed (we have integrated all the power provided by object-oriented development techniques), and is specifically created to deal with hypermedia software. Our experience in the Galatea development has showed us that XML markup (and its supporting tools) is easy enough to be used by customers (a similar approach is used in [Nanard and Nanard 95]), and the design phase is totally covered by overmarkup. Content and presentation DTD improve the communication between customers and developers, and provide the means to capture the content and presentation structure in different stages. Overmarkup phases integrate these structures: structural overmarkup represents a fast application "prototype", and the design document is a complete application representation that solves the interaction problem between customers and software designers. Moreover we can use the structure provided by the presentation DTD to generate part of the object-oriented code (improving the communication between software designers and programmers), and the existence of the design document facilitates the application maintenance. Present work includes the total assignment of an object-oriented semantic to elements of presentation-DTD. The next step is the development of a CASE tool that facilitates the overmarkup process, and that provides different views of the application (overmarkup view, window view - an application preview - and object-oriented view). 5. References G. Booch Object-oriented analysis and design with applications Second Edition Benjamin Cummings Publishing Company 1994 B. Campbell J. M. Goodman HAM: A general purpose hypertext abstract machine Communications of the ACM 31 7 856-861 1988 B. Fernandez-Manjon A. Navarro J. Cigarran A. Fernandez-Valmayor Using Standard Markup in the design and development of Web educational software Proceedings de TeleTeaching 98 1998 F. Garzotto P. Paolini D. Schwabe HDM: A model-based approach to hypertext application design ACM Transactions on Information Systems 11 1 1-26 1993 F. Halasz M. Schwartz The Dexter Hypertext Reference Model Communications of the ACM 37 2 30-39 1994 L. Hardman D. C. A. Butlerman G. van Rossum The Amsterdam Hypermedia Model: Adding Time and Context to the Dexter Model Communications of the ACM 37 2 50-62 1994 International Standards Organization Standard Generalized Markup Language (SGML), ISO/IEC IS 8879 1986 J. Nanard M. Narnard Hypertext design environments and the hypertext design process Communications of the ACM 38 8 49-56 1995 A. Navarro Aplicaciones de los lenguajes de marcado en la abstraccion del diseño de un sistema hipermedia Trabajo de Investigacion Departamento de Sistemas Informaticos y Programacion Universidad Complutense de Madrid 1998 A. Navarro B. Fernandez-Manjon A. Fernandez-Valmayor J. L. Sierra A Practical Methodology for the Development of Educational Hypermedias Proceedings of ICEUT 2000, 16th IFIP World Computer Congress 2000, Information Processing Beyond Year 2000 (in press 2000) A. Navarro J. L. Sierra B. Fernandez-Manjon A. Fernandez-Valmayor XML-based Integration of Hypermedia Design and Component-Based Techniques in the Production of Educational Applications M. Ortega J. Bravo Computers and Education in the 21st Century: Invited papers from the Spanish Congress on Computers in Education (Conied'99) Kluwer Academic Publisher (in press 2000) J. Rumbaugh G. Booch I. Jacobson Unified Modeling Language Reference Manual Addison-Wesley Object-Oriented Series Addison-Wesley 1998 P. D. Stotts R. Furuta Petri-Net-Based Hypertext: Document Structure with Browsing Semantics ACM Transactions on Office Information Systems 7 1 3-29 1989 F. Tompa A Data Model for Flexible Hypertext Database Systems ACM Transactions on Information Systems 7 1 85-100 1989 World Wide Web Consortium W3C Extensible Markup Language XML 1998 <>.