User Interface Implementation Issues for a Web-based system for Ordered Asynchronous Multimedia Annotations
Cleo Sgouropoulou, Anastasios Koutoumanos and Emmanuel Skordalakis
Software Engineering Laboratory, National Technical University of Athens, Greece
Peter Goodyear
Centre for Studies in Advanced Learning Technology, Lancaster University, England
 

Abstract

WebOrama is a Web-based system that provides a platform for creating, managing and presenting ordered asynchronous multimedia annotations. This system will be used within the project ‘SHARP’ for the support of coordinated, asynchronous discussions, which will emanate from a video representation of industry’s best practice. These discussions will serve as a medium for the exchange of tacit, experience-based knowledge, among a community of practitioners, and will also facilitate learners in the acquisition of complex skills applicable in real-world working context. WebOrama utilises an innovative algorithm for dynamic filtering of annotations, in order to provide an adaptive and customisable representation of content, personalised for a particular user-group perspective. This paper presents the issues encountered in the design and implementation of the user interface of WebOrama.

Introduction

The widespread use of information and communications technologies (ICT), and particularly the use of the World Wide Web, has made feasible many new forms of collaborative distance learning activities, that take advantage of the capacity to integrate communications with information access and organisation, within a commonly accessible hyperlinked environment (Khan 1997). There is an increasing amount of research supporting the critical influence that the choice of communication technology and the design of any instrumentation, used commonly by the learners, can have on both the process and the product of collaborative distance learning (Collis and Smith 1997).

Asynchronous computer mediated communications (CMC), and especially asynchronous text-based communications, have long been established as having value in supporting the collaborative distance learning process, due to the fact that they offer flexibility in the use of time as well as space. However, this is the case only when what is being learned is ‘textbook’ knowledge. Text has its virtues, but it is not good for all purposes: almost ten years of experience with this approach reveal that it can be quite hard to begin and sustain a discussion about specific working practices if the medium of exchange has to be text. When it comes to the learning of skills, especially the complex skills that are embedded in real-world working practices, the support offered by this kind of technology proves to be insufficient, in the sense that it makes only some forms of exchange about working practices possible. Asynchronous multimedia conferencing (AMC) is a useful way of supporting the acquisition of such skills and real world knowledge.

SHARP (Shareable Representations of Practice: pedagogy for asynchronous multimedia conferencing) is a European partnership project in the Open and Distance Learning (ODL) sector of SOCRATES (European Commission 1995), that aims to identify and disseminate pedagogical and organisational guidelines for the use of asynchronous multimedia conferencing, both within a community of practitioners that exchange experience, knowledge and discuss on a common working practice, as well as with learners who are acquiring complex skills (SHARP team 1996).

There are various approaches that can be followed for the implementation of systems that support AMC. In fact a few such systems exist today, but they require proprietary hardware and software platforms and are generally not suitable for the specific needs of SHARP. On this basis, the Software Engineering Laboratory of the Computer Science Division, at the National Technical University of Athens (NTUA), being responsible within SHARP for identifying the requirements for the user trials and providing a common infrastructure to the rest of the partners, decided to develop a system that would cover the specific needs of SHAPR. The approach that the development team chose, was the use and augmentation of existing components and standards, in order to create an integrated environment that provides the required functionality. The result of this undertaking is WebOrama: a Web-based system for ordered asynchronous multimedia annotations. The WebOrama system is presented in this paper, with emphasis on issues encountered in the requirements definition, the design and the implementation of the user interface.

The WebOrama System

WebOrama will serve as an integrated system that will facilitate the exchange of representations of working practices and the creation, management and presentation of asynchronous multimedia annotations on those working practices. In order to do so, it will facilitate the creation of an audio-visual representation of a working practice by an expert practitioner, which will serve as base material for an asynchronous, multimedia discussion. Furthermore, the system will provide a means for exchange and review of the base material and the capture and hyperlinking of multimedia annotations to this material.

One of the most innovative concepts incorporated within WebOrama is that of ordered annotations. Annotations created by different types of users (audio-visual representation creators, practitioners, and learners) are of different order. This ordering scheme serves as a means for filtering of what information (set of annotations) is presented to each user-group. In this way, even if the same base representation is used at the same time by both a group of practitioners and a class of learners, interference or degradation of service is impossible for either of these user-groups. However, while it is important to separate contributions to a discussion within each group, it might be some times equally necessary to attract attention to a contribution to one group to the members of another group. This is achieved through a transclusion mechanism, thoroughly described in (Bieber et al. 1997). Using this mechanism, the co-ordinator of the discussion of each user group can include an annotation in a different order-set to the one it originally appeared in. This mechanism can also be utilised to facilitate reusability of an existing set of annotations: a teacher, for example, can define a new order for her class and, transcluding all the relevant contributions from other order-sets, offer an exciting educational resource to her students.

User Interface Requirements Definition

The user interface is by all means the most important component of the WebOrama system, especially for the purposes of user trials that will be conducted within the SHARP project. An inappropriate user interface would invalidate the project and hinder its expected results: it is not the intention of the partners to test and evaluate an AMC system, but rather to use it in order to get feedback and data on the effectiveness of AMC within the educational process and for the exchange of working practices and ideas within a community of practitioners and learners. Therefore, it was clear to the development team of WebOrama that great effort had to be put on the design and implementation of the user interface. The design process of WebOrama’s user interface was supported by the methodology proposed by Balasubramanian and Turoff (1995) and (1996), that provides a comprehensive approach to designing self-evident user interfaces for interactive systems.

The following non-functional requirements were defined for the user interface of WebOrama:

The functional requirements that were set for the user interface of WebOrama, are summarised below: User Interface Design Issues

The non-functional and functional requirements for WebOrama’s user interface, led to a some strategic decisions, the most important of which are described below.

Portability and standardisation: The exclusive use of HTML pages, which can be presented in any Java-enabled Web browser (i.e., Netscape Navigator, Internet Explorer, etc.), was imperative in order to meet this requirement. This way, potential users of WebOrama are not constrained to using particular hardware or operating systems, which in fact was one of the greater considerations of the design, provided the great diversity of existing hardware and software infrastructure throughout the members of SHARP’s team and their institutions.

Consistency and integrability: In order to meet this requirement, a well-defined set of available functions, for each different group of WebOrama’s users, has been prescribed. This functionality was implemented with plain HTML, where possible, and with the use of Java, for the cases that HTML could not cover the presentation or application level programming needs. For example, text annotations can be created using HTML forms, while audio annotations with the use of a suitable Java applet. A similar kind of functionality is not yet supported for the real-time creation of video annotations. However, hyperlinking of a video annotation (produced with the help of an external tool) is feasible. In order to achieve consistency and avoid confusion and degradation of service, the user interface controls and affordances were kept to a minimum.

Adaptive and customisable user’s view: This requirement has been challenged mainly with the introduction of the transclusion mechanism, which provides a way for dynamic and collaborative filtering of information. While the system proposes the presentation of only those annotations that have been made by peers (i.e. users belonging to the same group), users do have a way to impose their personal criteria of significance and/or importance. As described in the previous section, with the use of the transclusion mechanism, annotations within a user group can be ‘advertised’ to members of other groups. In order to avoid confusion, the user interface uses indicative markers to clarify the original group that each annotation first appeared in (its order), as well as for implying the level of comments, questions, issues, etc. that have risen from a particular annotation. In addition, users have the choice of simultaneously viewing annotations from diverse groups, if they do not feel that the load of information presented is overwhelming.

User friendly information visualisation and navigation: WebOrama uses the familiar paradigm of threaded representation of subject lines, as this is used in many USENET news-readers applications and text-based annotation systems, in order to provide a clear view of the sequence of annotations and their follow-ups. Furthermore, in order to avoid undesirable navigation, a lightweight, popup viewer, activated with the right mouse button, hints on the content of each annotation and the corresponding follow-ups. This way, users can easily examine whether or not to follow a thread, which might lead to an irrelevant, and perhaps expensive in terms of network bandwidth, discussion.

Multimedia material management: Meeting this requirement was one of the most difficult issue, since embedding a video resource in an HTML page is only possible with the use of proprietary plugins that invalidate the portability of WebOrama. Existing media players for desktop computers are heavily dependent on native code for computationally intensive tasks like decompression and rendering. However, the newly released Java Media Framework (JMF) makes handling multimedia resources possible within any Java applet. The JMF specification defines application programming interfaces (APIs) that provide a platform-neutral framework for displaying time-based media. JMF provides an abstraction that hides implementation details from the developers. JMF is in fact a set of three APIs (being co-defined by Sun, Silicon Graphics, and Intel), the Media Player API, the Capture API and the Conferencing API. Only the first one is currently available for use, while the others’ release date is still to be determined.

Figure 1: A screenshot from WebOrama’s client

Implementation Issues

A prototype of WebOrama is currently underway at the Software Engineering Laboratory. The implementation of the user interface component of this prototype is based on the Java programming language, a choice made in order to satisfy the design principles for a portable, standard, consistent and integrated system. With regard to the user interface, a combination of HTML forms and Java applets was used to support the interaction model described in the previous section. The implementation was relatively straightforward, especially due to the use of JMF.

Using the Java Media Player API, we were able to build most of the desired functionality into the user interface, implementing support for almost any audio and video format. A screenshot of the user interface is shown in Figure 1. The user has control over the playback of the base audio-visual material, while at the same time, can review relevant annotations or add new ones.

References

Balasubramanian, V. and Turoff, M. (1995) A Systematic Approach to User Interface Design for Hypertext Systems. Proceedings of the 28th Annual Hawaii International Conference on System Sciences (HICSS’95), III, 241–250.

Balasubramanian, V. and Turoff, M. (1996) Supporting the User Interface Design Process with Hypertext Functionality. Position Paper at the Second Workshop on Incorporating Hypertext Functionality into Software Systems, Hypertext’96, Washington D.C.

Bieber, M., Vitali, F., Ashman, H., Balasubramanian, V. and Oinas-Kukkonen, H. (1997) Fourth generation hypermedia: some missing links for the World Wide Web. International Journal of Human Computer Studies, 46.

Collis, B. and Smith, C. (1997) Desktop multimedia environments to support collaborative distance learning. Instructional Science, 25, 433–462.

European Commission (1995). SOCRATES Vademecum. DGXXII Education, Training and Youth, Office for official publications of the European Commission. Luxembourg.

Khan, B. (1997) Web-Based Learning. Englewood Cliffs, NJ:Educational Technology Publications.

SHARP team (1996) Sharable Representations of Practice: pedagogy for asynchronous multimedia conferencing. http://www.lancs.ac.uk/users/edres /research/sharp/index.htm

 
Address

C. Sgouropoulou, A. Koutoumanos and E. Skordalakis
Software Engineering Laboratory
Electrical and Computer Engineer Department
National Technical University of Athens
Polytechnioupoli, GR-15780, Athens, Greece
Tel: +30-1-7722476, Fax: +30-1-7722519
Email: {csgouro,tkout,skordala}@softlab.ntua.gr

P. Goodyear
Centre for Studies in Advanced Learning Technology (CSALT)
Department of Educational Research
Lancaster University, Lancaster, LA1 4YL, England
Tel: +44 (0)1524 592685, Fax: +44 (0)1524 844788
Email: P.Goodyear@lancaster.ac.uk