1

Hypermedia Design Models & Methodologies

Dr Gary Wills

IAM Research Group

© University of Southampton

2

Aims of Lecture

• To present the major design models and methodologies.– HDM– RMM– OOHDM

• To briefly look at:– Design environments– Design patterns

3

Why Do We Use Design Models

• Give a discipline approach and structure to the design process– Makes visible the activities to be undertaken– Identify the deliverables– Aids organisation to plan

• Staff, schedules, budgets, project management

– Aids communication between Analysts, designers, implementers and clients

4

Hypermedia Design Model (HDM).

• Originally developed by Garzotto et al around 1993

• This is a design model and not so much a methodology

• Allows the documentation and comparison of designs

5

HDM- Authoring

• Authoring in the Large– Overview of information elements – Navigational structures – Independent of node content

• Authoring in the Small– Development of the node contact– Captures semantics of the the application

6

HDM-Entities

• Entities – a physical object or concept in the domain– Grouped into entity types.– Autonomous pieces of information– Consist of a hierarchy of components

• Components– Represent an abstraction of a set of units

• Units – Represent information from different perspective

7

HDM. – Entity Relationships

• Different from tradition E-R diagrams– Complex inner structures– Default browsing semantics (structure)

• Perspective– Syntactical device to organise information– All components of an entity have the same

number of perspectives as the entity.

8

HDM.-links• Links in HDM

– Capture the domain relations

– Capture the navigational patterns

• Link Types– Structural links: connect together components

belonging to the same entity.

– Perspective links: connect together the different units that correspond to the same component.

– Application links: denote arbitrary, domain dependent relationships

9

HDM. -Schema

• A schema (a diagrammatic outline) describes the application at a global level– Independent of file structure and implementation

• A schema definition specifies a set of entity types and link types.

• A schema instance is a collection of entities, components, units, and links that satisfy the definitions of the schema

10

HDM.- Summary

• HDM is a design model– HDM consists of typed entities which in turn are

composed of components.

– Entities and components are connected by structural links or application links.

– An HDM schema is a set of entity and link type definitions

– A schema instance is a set of actual entities and links.

– HDM is a top-down design process for the development of applications

11

The Relationship Management Methodology (RMM).

• Originally developed by Isakowitz et al in 1995

• This is a design methodology based on similar concepts as HDM

• Applicable to a narrow set of data– Volatile data that requires regular updating

12

RMM.

• RMM provides both a design model and a set of steps to aid implementation.

• Uses a form of E_R diagram – Relationship management data MODEL

• The RMM is a full design life-cycle model

• The methodology core focuses on the design phases

13

Construction

Run-Time BehaviourDesign

Navigational Design S3

User InterfaceScreen Design

Entity Design S2

Conversion ProtocolDesign

Entity Relationship (diagrams) S1 Design

14

RMM.-Step 1 E-R Diagram

• Information space analysed and modelled using E-R diagram– Well known and documented technique

– Identifies entities and relationships

– Focus on inherent structure not domain information use

– Similar techniques to reduce many-to-many relationships

• Slight difference from E-R– Links are directional

15

RMM.- Step 2 Slice Design

• Determine how the information in the entity is – Presented to the user, – How the user may access it.

• Attributes of a entity instance are grouped into slices– Structural links: links between slices of same entity– Associated links: links between slices from

different entities

16

ContactDetails

Name

Address

GenreBiography

lives at

Contact at

Bio Info

writes

Wri

tes

Author

17

RMM. – M Slice

• A limitation to slicing – Can only slice up an entity

• New type of slice, m-slice– Models presentation units that contain

information from more than one entity.– Models only information not presentation– Can be nested

18

19

RMM. -Step 3 Navigational Design

• Designing the navigation paths through the entities.

• Described in generic terms and not hard coded. – Aids updating of the information– Achieved by referring to properties of the

entities and their relationships.

• Conducted in parallel with S2

20

RMM- Remaining Steps

• S4 conversion protocol: – This step transforms each element on the RMDM

diagram into an implementation object..

• S5 user-interface design: – Design of interface components using the

RMDM..

• S6 run-time behaviour: – This stage considers the functionality of the

application.

• S7 construction and testing:

21

RMM. - Summary

• Based on entity-relationship modelling. • Focuses the design stage.• Most appropriately used for applications. When

– High degree of structure – High volatility of information

• Does not tied the designers to any specific implementation

• RMM takes a top-down approach to the design but does not support iteration

22

The Object Oriented Hypermedia Design Model, (OOHDM)

• This methodology was proposed by Schwabe et al.

• They say that a good Web application should be, first of all, a good hypermedia application.

• OOHDM builds a hypermedia application using an object-oriented framework.

• The design method uses a four-step process, each focusing on a particular design control.

23

OOHDM- Conceptual Analysis

• The main aim of this step is to capture the domain semantics as naturally as possible.

• Little concern is made of the type of user , task undertaken, functionality or structure.

• Results in a conceptual schema built out of subsystem classes and relationships.

24

OOHDM-Navigational Design

• Reorganised the information to take into account the users tasks/profiles – Define a navigational model in terms of nodes,

links and access structures. – Avoids the redundant information and prevent

the user getting lost in hyperspace.

• Independently of the conceptual model.

25

OOHDM-Abstract Interface

• Perceptible interface objects are defined in terms of interface classes.

• Interface behaviour is declared specifying – how to handle external and user generated events

– how communication takes place between navigational and interface objects.

• A clear separation– allows different interfaces for the same navigational

model, giving a higher degree of independence.

26

OOHDM-Implementation:

• The designer maps the navigational and interface models into a concrete object.

• The conceptual domain-use relational database and scripts

27

OOHDM-

• Separation of the design into clear steps allows the designer to focus on the important issues in each step.

• OOHDM does not cover the early aspects of the design process nor does it address how the steps are coordinated

28

OOHDM-Summary

• An OO incremental based design method with hypermedia domain specific extensions

• There are four main activities–  Conceptual, design Navigation design, Abstract

interface design, Implementation

• By separating the different design phases OOHDM improves maintainability

• OHDM is an iterative approach, yet it does not describe explicitly how the design phase are coordinated

29

Applying and Adapting the Methodology.

• You will need to adapt the model and methodology to you requirements– Principles the same, examples different

– Modify the product model by adding domain specific entities and removing redundant entities

– Modify the activities to reflect the changes in the product model, even add or remove activities.

– Modify the outputs to reflect the changes to the activities and add or remove outputs

30

Tools and Environments

• The design methodology is independent of implementation solution.

• A design environment are required– A fast experimental feedback loop.

– Tools for generalisation and instantiating models.

– Easy and unconstrained cloning tools.

– The ability to easily build solutions that may be evaluated directly.

– Integrating light prototyping

31

Tools and Environments

• Tools-– Golden rule: First decide the methodology to

be used, implement it, then look for opportunities to enhance it by using a tool.

– Support for a specific methodology, i.e, RMCase

– General tools i.e ColdFusion

32

Design Patterns

• Capturing design rules that emerge from the design– Identify common problems during design– Identify alternative solutions– Uses a shared vocabulary-model independent– Helps newer team member learn quickly

• Does require time, as information entered into a knowledge base

33

Design Patterns;- Structure

• The pattern should be clear, consistent and in a uniform structure.– Always give the pattern's context– Problem and interaction of events– Elements of the solution– Try to include examples– Use a naming convention

34

Design Patterns :- Examples

• Organising information space:– What are the effective ways to organise the information

to aid navigation and yet also suit human cognition

• Organising the interface: – What type of interface is appropriate in what

circumstance.

• Implementation: – Implementing the appropriate navigation aids.

• Process: – Often captured in a methodology as described above.

35

Summary

• HDM– A model– Use E-R diagrams– Used as the basis of the other methodologies

• RMM– E-R based– Slice entities

• OOHDM– OO techniques used

36

Summary

• No perfect design model as yet– You need to modify and methodology used.

• Tools– Choose your methodology first

• Design patterns– Captures your ‘neat’ ways of solving a problem